talksik/stream-chat-flutter
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: update message_theme.dart

Browse Source 
Includes Diagnosticable, more descriptive field names, lerp, ==, and hashCode
This commit is contained in:
groovinchip
2021-08-02 10:47:38 -04:00
parent 5e1eb7a320
commit 628ef401d4
14 changed files with 175 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/stream_chat_flutter/example/lib/tutorial_part_6.dart
+2 -2
View File
@@ -63,9 +63,9 @@ class MyApp extends StatelessWidget {
borderRadius: BorderRadius.circular(8),
),
),
otherMessageTheme: MessageTheme(
otherMessageTheme: MessageThemeData(
messageBackgroundColor: colorTheme.textHighEmphasis,
messageText: TextStyle(
messageTextStyle: TextStyle(
color: colorTheme.barsBg,
),
avatarTheme: AvatarThemeData(
packages/stream_chat_flutter/lib/src/attachment/attachment_title.dart
+3 -3
View File
@@ -13,7 +13,7 @@ class AttachmentTitle extends StatelessWidget {
}) : super(key: key);
/// Theme to apply to text
final MessageTheme messageTheme;
final MessageThemeData messageTheme;
/// Attachment data to display
final Attachment attachment;
@@ -35,7 +35,7 @@ class AttachmentTitle extends StatelessWidget {
Text(
attachment.title!,
overflow: TextOverflow.ellipsis,
style: messageTheme.messageText?.copyWith(
style: messageTheme.messageTextStyle?.copyWith(
color: StreamChatTheme.of(context).colorTheme.accentPrimary,
fontWeight: FontWeight.bold,
),
@@ -51,7 +51,7 @@ class AttachmentTitle extends StatelessWidget {
.toList()
.reversed
.join('.'),
style: messageTheme.messageText,
style: messageTheme.messageTextStyle,
),
],
),
packages/stream_chat_flutter/lib/src/attachment/image_attachment.dart
+2 -2
View File
@@ -28,8 +28,8 @@ class ImageAttachment extends AttachmentWidget {
size: size,
);
/// [MessageTheme] for showing image title
final MessageTheme messageTheme;
/// [MessageThemeData] for showing image title
final MessageThemeData messageTheme;
/// Flag for showing title
final bool showTitle;
packages/stream_chat_flutter/lib/src/attachment/video_attachment.dart
+2 -2
View File
@@ -25,8 +25,8 @@ class VideoAttachment extends AttachmentWidget {
size: size,
);
/// [MessageTheme] for showing title
final MessageTheme messageTheme;
/// [MessageThemeData] for showing title
final MessageThemeData messageTheme;
/// Callback when show message is tapped
final ShowMessageCallback? onShowMessage;
packages/stream_chat_flutter/lib/src/deleted_message.dart
+3 -3
View File
@@ -15,7 +15,7 @@ class DeletedMessage extends StatelessWidget {
}) : super(key: key);
/// The theme of the message
final MessageTheme messageTheme;
final MessageThemeData messageTheme;
/// The border radius of the message text
final BorderRadiusGeometry? borderRadiusGeometry;
@@ -51,9 +51,9 @@ class DeletedMessage extends StatelessWidget {
),
child: Text(
'Message deleted',
style: messageTheme.messageText?.copyWith(
style: messageTheme.messageTextStyle?.copyWith(
fontStyle: FontStyle.italic,
color: messageTheme.createdAt?.color,
color: messageTheme.createdAtStyle?.color,
),
),
),
packages/stream_chat_flutter/lib/src/image_group.dart
+2 -2
View File
@@ -26,8 +26,8 @@ class ImageGroup extends StatelessWidget {
/// Message which images are attached to
final Message message;
/// [MessageTheme] to apply to message
final MessageTheme messageTheme;
/// [MessageThemeData] to apply to message
final MessageThemeData messageTheme;
/// Size of iamges
final Size size;
packages/stream_chat_flutter/lib/src/message_actions_modal.dart
+3 -3
View File
@@ -50,8 +50,8 @@ class MessageActionsModal extends StatefulWidget {
/// Message in focus for actions
final Message message;
/// [MessageTheme] for message
final MessageTheme messageTheme;
/// [MessageThemeData] for message
final MessageThemeData messageTheme;
/// Flag for showing reactions
final bool showReactions;
@@ -117,7 +117,7 @@ class _MessageActionsModalState extends State<MessageActionsModal> {
}
}
final roughSentenceSize = messageTextLength *
(widget.messageTheme.messageText?.fontSize ?? 1) *
(widget.messageTheme.messageTextStyle?.fontSize ?? 1) *
1.2;
final divFactor = widget.message.attachments.isNotEmpty == true
? 1
packages/stream_chat_flutter/lib/src/message_reactions_modal.dart
+5 -4
View File
@@ -28,8 +28,8 @@ class MessageReactionsModal extends StatelessWidget {
/// Message to display reactions of
final Message message;
/// [MessageTheme] to apply to [message]
final MessageTheme messageTheme;
/// [MessageThemeData] to apply to [message]
final MessageThemeData messageTheme;
/// Flag to reverse message
final bool reverse;
@@ -56,8 +56,9 @@ class MessageReactionsModal extends StatelessWidget {
messageTextLength = quotedMessageLength;
}
}
final roughSentenceSize =
messageTextLength * (messageTheme.messageText?.fontSize ?? 1) * 1.2;
final roughSentenceSize = messageTextLength *
(messageTheme.messageTextStyle?.fontSize ?? 1) *
1.2;
final divFactor = message.attachments.isNotEmpty == true
? 1
: (roughSentenceSize == 0 ? 1 : (roughSentenceSize / roughMaxSize));
packages/stream_chat_flutter/lib/src/message_text.dart
+9 -9
View File
@@ -25,8 +25,8 @@ class MessageText extends StatelessWidget {
/// Callback for when link is tapped
final void Function(String)? onLinkTap;
/// [MessageTheme] whose text theme is to be applied
final MessageTheme messageTheme;
/// [MessageThemeData] whose text theme is to be applied
final MessageThemeData messageTheme;
@override
Widget build(BuildContext context) {
@@ -64,16 +64,16 @@ class MessageText extends StatelessWidget {
styleSheet: MarkdownStyleSheet.fromTheme(
themeData.copyWith(
textTheme: themeData.textTheme.apply(
bodyColor: messageTheme.messageText?.color,
decoration: messageTheme.messageText?.decoration,
decorationColor: messageTheme.messageText?.decorationColor,
decorationStyle: messageTheme.messageText?.decorationStyle,
fontFamily: messageTheme.messageText?.fontFamily,
bodyColor: messageTheme.messageTextStyle?.color,
decoration: messageTheme.messageTextStyle?.decoration,
decorationColor: messageTheme.messageTextStyle?.decorationColor,
decorationStyle: messageTheme.messageTextStyle?.decorationStyle,
fontFamily: messageTheme.messageTextStyle?.fontFamily,
),
),
).copyWith(
a: messageTheme.messageLinks,
p: messageTheme.messageText,
a: messageTheme.messageLinksStyle,
p: messageTheme.messageTextStyle,
),
);
}
packages/stream_chat_flutter/lib/src/message_widget.dart
+10 -10
View File
@@ -283,7 +283,7 @@ class MessageWidget extends StatefulWidget {
final Message message;
/// The message theme
final MessageTheme messageTheme;
final MessageThemeData messageTheme;
/// If true the widget will be mirrored
final bool reverse;
@@ -413,7 +413,7 @@ class MessageWidget extends StatefulWidget {
Widget Function(BuildContext, Message)? usernameBuilder,
void Function(BuildContext, Message)? onMessageActions,
Message? message,
MessageTheme? messageTheme,
MessageThemeData? messageTheme,
bool? reverse,
ShapeBorder? shape,
ShapeBorder? attachmentShape,
@@ -888,14 +888,14 @@ class _MessageWidgetState extends State<MessageWidget>
),
InkWell(
onTap: widget.onThreadTap != null ? onThreadTap : null,
child: Text(msg, style: widget.messageTheme.replies),
child: Text(msg, style: widget.messageTheme.repliesStyle),
),
],
if (showUsername) _buildUsername(usernameKey),
if (showTimeStamp)
Text(
Jiffy(widget.message.createdAt.toLocal()).jm,
style: widget.messageTheme.createdAt,
style: widget.messageTheme.createdAtStyle,
),
if (showSendingIndicator) _buildSendingIndicator(),
]);
@@ -912,7 +912,7 @@ class _MessageWidgetState extends State<MessageWidget>
Container(
margin: EdgeInsets.only(
bottom: context.textScaleFactor *
((widget.messageTheme.replies?.fontSize ?? 1) / 2),
((widget.messageTheme.repliesStyle?.fontSize ?? 1) / 2),
),
child: CustomPaint(
size: const Size(16, 32) * context.textScaleFactor,
@@ -939,7 +939,7 @@ class _MessageWidgetState extends State<MessageWidget>
Container(
margin: EdgeInsets.only(
bottom: context.textScaleFactor *
((widget.messageTheme.replies?.fontSize ?? 1) / 2),
((widget.messageTheme.repliesStyle?.fontSize ?? 1) / 2),
),
child: CustomPaint(
size: const Size(16, 32) * context.textScaleFactor,
@@ -962,7 +962,7 @@ class _MessageWidgetState extends State<MessageWidget>
widget.message.user!.name,
maxLines: 1,
key: usernameKey,
style: widget.messageTheme.messageAuthor,
style: widget.messageTheme.messageAuthorStyle,
overflow: TextOverflow.ellipsis,
);
}
@@ -1186,7 +1186,7 @@ class _MessageWidgetState extends State<MessageWidget>
}
Widget _buildSendingIndicator() {
final style = widget.messageTheme.createdAt;
final style = widget.messageTheme.createdAtStyle;
final message = widget.message;
if (hasNonUrlAttachments &&
@@ -1263,8 +1263,8 @@ class _MessageWidgetState extends State<MessageWidget>
onMentionTap: widget.onMentionTap,
messageTheme: isOnlyEmoji
? widget.messageTheme.copyWith(
messageText:
widget.messageTheme.messageText!.copyWith(
messageTextStyle:
widget.messageTheme.messageTextStyle!.copyWith(
fontSize: 42,
))
: widget.messageTheme,
packages/stream_chat_flutter/lib/src/quoted_message_widget.dart
+3 -3
View File
@@ -74,7 +74,7 @@ class QuotedMessageWidget extends StatelessWidget {
final Message message;
/// The message theme
final MessageTheme messageTheme;
final MessageThemeData messageTheme;
/// If true the widget will be mirrored
final bool reverse;
@@ -139,11 +139,11 @@ class QuotedMessageWidget extends StatelessWidget {
message: msg,
messageTheme: isOnlyEmoji && _containsText
? messageTheme.copyWith(
messageText: messageTheme.messageText?.copyWith(
messageTextStyle: messageTheme.messageTextStyle?.copyWith(
fontSize: 32,
))
: messageTheme.copyWith(
messageText: messageTheme.messageText?.copyWith(
messageTextStyle: messageTheme.messageTextStyle?.copyWith(
fontSize: 12,
)),
),
packages/stream_chat_flutter/lib/src/stream_chat_theme.dart
+18 -18
View File
@@ -50,8 +50,8 @@ class StreamChatThemeData {
ChannelListHeaderTheme? channelListHeaderTheme,
ChannelPreviewThemeData? channelPreviewTheme,
ChannelHeaderThemeData? channelHeaderTheme,
MessageTheme? otherMessageTheme,
MessageTheme? ownMessageTheme,
MessageThemeData? otherMessageTheme,
MessageThemeData? ownMessageTheme,
MessageInputThemeData? messageInputTheme,
Widget Function(BuildContext, User)? defaultUserImage,
IconThemeData? primaryIconTheme,
@@ -159,10 +159,10 @@ class StreamChatThemeData {
final GalleryFooterThemeData galleryFooterTheme;
/// Theme of the current user messages
final MessageTheme ownMessageTheme;
final MessageThemeData ownMessageTheme;
/// Theme of other users messages
final MessageTheme otherMessageTheme;
final MessageThemeData otherMessageTheme;
/// Theme dedicated to the [MessageInput] widget
final MessageInputThemeData messageInputTheme;
@@ -195,8 +195,8 @@ class StreamChatThemeData {
ColorTheme? colorTheme,
ChannelPreviewThemeData? channelPreviewTheme,
ChannelHeaderThemeData? channelHeaderTheme,
MessageTheme? ownMessageTheme,
MessageTheme? otherMessageTheme,
MessageThemeData? ownMessageTheme,
MessageThemeData? otherMessageTheme,
MessageInputThemeData? messageInputTheme,
Widget Function(BuildContext, User)? defaultUserImage,
IconThemeData? primaryIconTheme,
@@ -324,13 +324,13 @@ class StreamChatThemeData {
title: textTheme.headlineBold,
),
channelHeaderTheme: channelHeaderTheme,
ownMessageTheme: MessageTheme(
messageAuthor:
ownMessageTheme: MessageThemeData(
messageAuthorStyle:
textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis),
messageText: textTheme.body,
createdAt:
messageTextStyle: textTheme.body,
createdAtStyle:
textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis),
replies: textTheme.footnoteBold.copyWith(color: accentColor),
repliesStyle: textTheme.footnoteBold.copyWith(color: accentColor),
messageBackgroundColor: colorTheme.disabled,
reactionsBackgroundColor: colorTheme.barsBg,
reactionsBorderColor: colorTheme.borders,
@@ -343,21 +343,21 @@ class StreamChatThemeData {
width: 32,
),
),
messageLinks: TextStyle(
messageLinksStyle: TextStyle(
color: accentColor,
),
),
otherMessageTheme: MessageTheme(
otherMessageTheme: MessageThemeData(
reactionsBackgroundColor: colorTheme.disabled,
reactionsBorderColor: colorTheme.barsBg,
reactionsMaskColor: colorTheme.appBg,
messageText: textTheme.body,
createdAt:
messageTextStyle: textTheme.body,
createdAtStyle:
textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis),
messageAuthor:
messageAuthorStyle:
textTheme.footnote.copyWith(color: colorTheme.textLowEmphasis),
replies: textTheme.footnoteBold.copyWith(color: accentColor),
messageLinks: TextStyle(
repliesStyle: textTheme.footnoteBold.copyWith(color: accentColor),
messageLinksStyle: TextStyle(
color: accentColor,
),
messageBackgroundColor: colorTheme.barsBg,
packages/stream_chat_flutter/lib/src/theme/message_theme.dart
+110 -33
View File
@@ -1,37 +1,38 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:stream_chat_flutter/src/theme/avatar_theme.dart';
/// Class for getting message theme
class MessageTheme {
/// Constructor into [MessageTheme]
const MessageTheme({
this.replies,
this.messageText,
this.messageAuthor,
this.messageLinks,
class MessageThemeData with Diagnosticable {
/// Creates a [MessageThemeData].
const MessageThemeData({
this.repliesStyle,
this.messageTextStyle,
this.messageAuthorStyle,
this.messageLinksStyle,
this.messageBackgroundColor,
this.messageBorderColor,
this.reactionsBackgroundColor,
this.reactionsBorderColor,
this.reactionsMaskColor,
this.avatarTheme,
this.createdAt,
this.createdAtStyle,
});
/// Text style for message text
final TextStyle? messageText;
final TextStyle? messageTextStyle;
/// Text style for message author
final TextStyle? messageAuthor;
final TextStyle? messageAuthorStyle;
/// Text style for message links
final TextStyle? messageLinks;
final TextStyle? messageLinksStyle;
/// Text style for created at text
final TextStyle? createdAt;
final TextStyle? createdAtStyle;
/// Text style for replies
final TextStyle? replies;
final TextStyle? repliesStyle;
/// Color for messageBackgroundColor
final Color? messageBackgroundColor;
@@ -52,12 +53,12 @@ class MessageTheme {
final AvatarThemeData? avatarTheme;
/// Copy with a theme
MessageTheme copyWith({
TextStyle? messageText,
TextStyle? messageAuthor,
TextStyle? messageLinks,
TextStyle? createdAt,
TextStyle? replies,
MessageThemeData copyWith({
TextStyle? messageTextStyle,
TextStyle? messageAuthorStyle,
TextStyle? messageLinksStyle,
TextStyle? createdAtStyle,
TextStyle? repliesStyle,
Color? messageBackgroundColor,
Color? messageBorderColor,
AvatarThemeData? avatarTheme,
@@ -65,33 +66,61 @@ class MessageTheme {
Color? reactionsBorderColor,
Color? reactionsMaskColor,
}) =>
MessageTheme(
messageText: messageText ?? this.messageText,
messageAuthor: messageAuthor ?? this.messageAuthor,
messageLinks: messageLinks ?? this.messageLinks,
createdAt: createdAt ?? this.createdAt,
MessageThemeData(
messageTextStyle: messageTextStyle ?? this.messageTextStyle,
messageAuthorStyle: messageAuthorStyle ?? this.messageAuthorStyle,
messageLinksStyle: messageLinksStyle ?? this.messageLinksStyle,
createdAtStyle: createdAtStyle ?? this.createdAtStyle,
messageBackgroundColor:
messageBackgroundColor ?? this.messageBackgroundColor,
messageBorderColor: messageBorderColor ?? this.messageBorderColor,
avatarTheme: avatarTheme ?? this.avatarTheme,
replies: replies ?? this.replies,
repliesStyle: repliesStyle ?? this.repliesStyle,
reactionsBackgroundColor:
reactionsBackgroundColor ?? this.reactionsBackgroundColor,
reactionsBorderColor: reactionsBorderColor ?? this.reactionsBorderColor,
reactionsMaskColor: reactionsMaskColor ?? this.reactionsMaskColor,
);
/// Linearly interpolate from one [MessageThemeData] to another.
MessageThemeData lerp(MessageThemeData a, MessageThemeData b, double t) =>
MessageThemeData(
avatarTheme:
const AvatarThemeData().lerp(a.avatarTheme!, b.avatarTheme!, t),
createdAtStyle: TextStyle.lerp(a.createdAtStyle, b.createdAtStyle, t),
messageAuthorStyle:
TextStyle.lerp(a.messageAuthorStyle, b.messageAuthorStyle, t),
messageBackgroundColor:
Color.lerp(a.messageBackgroundColor, b.messageBackgroundColor, t),
messageBorderColor:
Color.lerp(a.messageBorderColor, b.messageBorderColor, t),
messageLinksStyle:
TextStyle.lerp(a.messageLinksStyle, b.messageLinksStyle, t),
messageTextStyle:
TextStyle.lerp(a.messageTextStyle, b.messageTextStyle, t),
reactionsBackgroundColor: Color.lerp(
a.reactionsBackgroundColor, b.reactionsBackgroundColor, t),
reactionsBorderColor:
Color.lerp(a.messageBorderColor, b.reactionsBorderColor, t),
reactionsMaskColor:
Color.lerp(a.reactionsMaskColor, b.reactionsMaskColor, t),
repliesStyle: TextStyle.lerp(a.repliesStyle, b.repliesStyle, t),
);
/// Merge with a theme
MessageTheme merge(MessageTheme? other) {
MessageThemeData merge(MessageThemeData? other) {
if (other == null) return this;
return copyWith(
messageText: messageText?.merge(other.messageText) ?? other.messageText,
messageAuthor:
messageAuthor?.merge(other.messageAuthor) ?? other.messageAuthor,
messageLinks:
messageLinks?.merge(other.messageLinks) ?? other.messageLinks,
createdAt: createdAt?.merge(other.createdAt) ?? other.createdAt,
replies: replies?.merge(other.replies) ?? other.replies,
messageTextStyle: messageTextStyle?.merge(other.messageTextStyle) ??
other.messageTextStyle,
messageAuthorStyle: messageAuthorStyle?.merge(other.messageAuthorStyle) ??
other.messageAuthorStyle,
messageLinksStyle: messageLinksStyle?.merge(other.messageLinksStyle) ??
other.messageLinksStyle,
createdAtStyle:
createdAtStyle?.merge(other.createdAtStyle) ?? other.createdAtStyle,
repliesStyle:
repliesStyle?.merge(other.repliesStyle) ?? other.repliesStyle,
messageBackgroundColor: other.messageBackgroundColor,
messageBorderColor: other.messageBorderColor,
avatarTheme: avatarTheme?.merge(other.avatarTheme) ?? other.avatarTheme,
@@ -100,4 +129,52 @@ class MessageTheme {
reactionsMaskColor: other.reactionsMaskColor,
);
}
@override
bool operator ==(Object other) =>
identical(this, other) ||
other is MessageThemeData &&
runtimeType == other.runtimeType &&
messageTextStyle == other.messageTextStyle &&
messageAuthorStyle == other.messageAuthorStyle &&
messageLinksStyle == other.messageLinksStyle &&
createdAtStyle == other.createdAtStyle &&
repliesStyle == other.repliesStyle &&
messageBackgroundColor == other.messageBackgroundColor &&
messageBorderColor == other.messageBorderColor &&
reactionsBackgroundColor == other.reactionsBackgroundColor &&
reactionsBorderColor == other.reactionsBorderColor &&
reactionsMaskColor == other.reactionsMaskColor &&
avatarTheme == other.avatarTheme;
@override
int get hashCode =>
messageTextStyle.hashCode ^
messageAuthorStyle.hashCode ^
messageLinksStyle.hashCode ^
createdAtStyle.hashCode ^
repliesStyle.hashCode ^
messageBackgroundColor.hashCode ^
messageBorderColor.hashCode ^
reactionsBackgroundColor.hashCode ^
reactionsBorderColor.hashCode ^
reactionsMaskColor.hashCode ^
avatarTheme.hashCode;
@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
super.debugFillProperties(properties);
properties
..add(DiagnosticsProperty('messageTextStyle', messageTextStyle))
..add(DiagnosticsProperty('messageAuthorStyle', messageAuthorStyle))
..add(DiagnosticsProperty('messageLinksStyle', messageLinksStyle))
..add(DiagnosticsProperty('createdAtStyle', createdAtStyle))
..add(DiagnosticsProperty('repliesStyle', repliesStyle))
..add(ColorProperty('messageBackgroundColor', messageBackgroundColor))
..add(ColorProperty('messageBorderColor', messageBorderColor))
..add(DiagnosticsProperty('avatarTheme', avatarTheme))
..add(ColorProperty('reactionsBackgroundColor', reactionsBackgroundColor))
..add(ColorProperty('reactionsBorderColor', reactionsBorderColor))
..add(ColorProperty('reactionsMaskColor', reactionsMaskColor));
}
}
packages/stream_chat_flutter/test/src/deleted_message_test.dart
+3 -3
View File
@@ -21,11 +21,11 @@ void main() {
client: client,
child: const Scaffold(
body: DeletedMessage(
messageTheme: MessageTheme(
createdAt: TextStyle(
messageTheme: MessageThemeData(
createdAtStyle: TextStyle(
color: Colors.black,
),
messageText: TextStyle(),
messageTextStyle: TextStyle(),
),
),
),