feat: add support for url attachment theming.
Signed-off-by: xsahil03x <[email protected]>
This commit is contained in:
@@ -1,3 +1,14 @@
|
||||
## Upcoming
|
||||
|
||||
✅ Added
|
||||
|
||||
- Added `MessageTheme.urlAttachmentHostStyle`, `MessageTheme.urlAttachmentTitleStyle`, and
|
||||
`MessageTheme.urlAttachmentTextStyle` to customize the style of the url attachment.
|
||||
|
||||
🔄 Changed
|
||||
|
||||
- Deprecated `MessageTheme.linkBackgroundColor` in favor of `MessageTheme.urlAttachmentBackgroundColor`.
|
||||
|
||||
## 6.0.0
|
||||
|
||||
🐞 Fixed
|
||||
|
||||
@@ -79,7 +79,7 @@ class StreamUrlAttachment extends StatelessWidget {
|
||||
borderRadius: const BorderRadius.only(
|
||||
topRight: Radius.circular(16),
|
||||
),
|
||||
color: messageTheme.linkBackgroundColor,
|
||||
color: messageTheme.urlAttachmentBackgroundColor,
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(
|
||||
@@ -89,9 +89,7 @@ class StreamUrlAttachment extends StatelessWidget {
|
||||
),
|
||||
child: Text(
|
||||
hostDisplayName,
|
||||
style: chatThemeData.textTheme.bodyBold.copyWith(
|
||||
color: chatThemeData.colorTheme.accentPrimary,
|
||||
),
|
||||
style: messageTheme.urlAttachmentHostStyle,
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -109,14 +107,12 @@ class StreamUrlAttachment extends StatelessWidget {
|
||||
urlAttachment.title!.trim(),
|
||||
maxLines: messageTheme.urlAttachmentTitleMaxLine ?? 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: chatThemeData.textTheme.body
|
||||
.copyWith(fontWeight: FontWeight.w700),
|
||||
style: messageTheme.urlAttachmentTitleStyle,
|
||||
),
|
||||
if (urlAttachment.text != null)
|
||||
Text(
|
||||
urlAttachment.text!,
|
||||
style: chatThemeData.textTheme.body
|
||||
.copyWith(fontWeight: FontWeight.w400),
|
||||
style: messageTheme.urlAttachmentTextStyle,
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
@@ -205,7 +205,7 @@ class _QuotedMessage extends StatelessWidget {
|
||||
|
||||
Color? _getBackgroundColor(BuildContext context) {
|
||||
if (_containsLinkAttachment) {
|
||||
return messageTheme.linkBackgroundColor;
|
||||
return messageTheme.urlAttachmentBackgroundColor;
|
||||
}
|
||||
return messageTheme.messageBackgroundColor;
|
||||
}
|
||||
|
||||
@@ -215,7 +215,7 @@ class _MessageCardState extends State<MessageCard> {
|
||||
}
|
||||
|
||||
if (widget.hasUrlAttachments) {
|
||||
return widget.messageTheme.linkBackgroundColor;
|
||||
return widget.messageTheme.urlAttachmentBackgroundColor;
|
||||
}
|
||||
|
||||
if (widget.isOnlyEmoji) {
|
||||
|
||||
@@ -20,9 +20,15 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
this.reactionsMaskColor,
|
||||
this.avatarTheme,
|
||||
this.createdAtStyle,
|
||||
this.linkBackgroundColor,
|
||||
@Deprecated('Use urlAttachmentBackgroundColor instead')
|
||||
Color? linkBackgroundColor,
|
||||
Color? urlAttachmentBackgroundColor,
|
||||
this.urlAttachmentHostStyle,
|
||||
this.urlAttachmentTitleStyle,
|
||||
this.urlAttachmentTextStyle,
|
||||
this.urlAttachmentTitleMaxLine,
|
||||
});
|
||||
}) : urlAttachmentBackgroundColor =
|
||||
urlAttachmentBackgroundColor ?? linkBackgroundColor;
|
||||
|
||||
/// Text style for message text
|
||||
final TextStyle? messageTextStyle;
|
||||
@@ -58,9 +64,22 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
final StreamAvatarThemeData? avatarTheme;
|
||||
|
||||
/// Background color for messages with url attachments.
|
||||
final Color? linkBackgroundColor;
|
||||
@Deprecated('Use urlAttachmentBackgroundColor instead')
|
||||
Color? get linkBackgroundColor => urlAttachmentBackgroundColor;
|
||||
|
||||
/// Max number of lines in Url link title
|
||||
/// Background color for messages with url attachments.
|
||||
final Color? urlAttachmentBackgroundColor;
|
||||
|
||||
/// Color for url attachment host.
|
||||
final TextStyle? urlAttachmentHostStyle;
|
||||
|
||||
/// Color for url attachment title.
|
||||
final TextStyle? urlAttachmentTitleStyle;
|
||||
|
||||
/// Color for url attachment text.
|
||||
final TextStyle? urlAttachmentTextStyle;
|
||||
|
||||
/// Max number of lines in Url link title.
|
||||
final int? urlAttachmentTitleMaxLine;
|
||||
|
||||
/// Copy with a theme
|
||||
@@ -76,7 +95,12 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
Color? reactionsBackgroundColor,
|
||||
Color? reactionsBorderColor,
|
||||
Color? reactionsMaskColor,
|
||||
Color? linkBackgroundColor,
|
||||
@Deprecated('Use urlAttachmentBackgroundColor instead')
|
||||
Color? linkBackgroundColor,
|
||||
Color? urlAttachmentBackgroundColor,
|
||||
TextStyle? urlAttachmentHostStyle,
|
||||
TextStyle? urlAttachmentTitleStyle,
|
||||
TextStyle? urlAttachmentTextStyle,
|
||||
int? urlAttachmentTitleMaxLine,
|
||||
}) {
|
||||
return StreamMessageThemeData(
|
||||
@@ -93,7 +117,15 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
reactionsBackgroundColor ?? this.reactionsBackgroundColor,
|
||||
reactionsBorderColor: reactionsBorderColor ?? this.reactionsBorderColor,
|
||||
reactionsMaskColor: reactionsMaskColor ?? this.reactionsMaskColor,
|
||||
linkBackgroundColor: linkBackgroundColor ?? this.linkBackgroundColor,
|
||||
urlAttachmentBackgroundColor: urlAttachmentBackgroundColor ??
|
||||
linkBackgroundColor ??
|
||||
this.urlAttachmentBackgroundColor,
|
||||
urlAttachmentHostStyle:
|
||||
urlAttachmentHostStyle ?? this.urlAttachmentHostStyle,
|
||||
urlAttachmentTitleStyle:
|
||||
urlAttachmentTitleStyle ?? this.urlAttachmentTitleStyle,
|
||||
urlAttachmentTextStyle:
|
||||
urlAttachmentTextStyle ?? this.urlAttachmentTextStyle,
|
||||
urlAttachmentTitleMaxLine:
|
||||
urlAttachmentTitleMaxLine ?? this.urlAttachmentTitleMaxLine,
|
||||
);
|
||||
@@ -129,8 +161,23 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
reactionsMaskColor:
|
||||
Color.lerp(a.reactionsMaskColor, b.reactionsMaskColor, t),
|
||||
repliesStyle: TextStyle.lerp(a.repliesStyle, b.repliesStyle, t),
|
||||
linkBackgroundColor:
|
||||
Color.lerp(a.linkBackgroundColor, b.linkBackgroundColor, t),
|
||||
urlAttachmentBackgroundColor: Color.lerp(
|
||||
a.urlAttachmentBackgroundColor,
|
||||
b.urlAttachmentBackgroundColor,
|
||||
t,
|
||||
),
|
||||
urlAttachmentHostStyle:
|
||||
TextStyle.lerp(a.urlAttachmentHostStyle, b.urlAttachmentHostStyle, t),
|
||||
urlAttachmentTextStyle: TextStyle.lerp(
|
||||
a.urlAttachmentTextStyle,
|
||||
b.urlAttachmentTextStyle,
|
||||
t,
|
||||
),
|
||||
urlAttachmentTitleStyle: TextStyle.lerp(
|
||||
a.urlAttachmentTitleStyle,
|
||||
b.urlAttachmentTitleStyle,
|
||||
t,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -154,7 +201,10 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
reactionsBackgroundColor: other.reactionsBackgroundColor,
|
||||
reactionsBorderColor: other.reactionsBorderColor,
|
||||
reactionsMaskColor: other.reactionsMaskColor,
|
||||
linkBackgroundColor: other.linkBackgroundColor,
|
||||
urlAttachmentBackgroundColor: other.urlAttachmentBackgroundColor,
|
||||
urlAttachmentHostStyle: other.urlAttachmentHostStyle,
|
||||
urlAttachmentTitleStyle: other.urlAttachmentTitleStyle,
|
||||
urlAttachmentTextStyle: other.urlAttachmentTextStyle,
|
||||
urlAttachmentTitleMaxLine: other.urlAttachmentTitleMaxLine,
|
||||
);
|
||||
}
|
||||
@@ -175,7 +225,10 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
reactionsBorderColor == other.reactionsBorderColor &&
|
||||
reactionsMaskColor == other.reactionsMaskColor &&
|
||||
avatarTheme == other.avatarTheme &&
|
||||
linkBackgroundColor == other.linkBackgroundColor &&
|
||||
urlAttachmentBackgroundColor == other.urlAttachmentBackgroundColor &&
|
||||
urlAttachmentHostStyle == other.urlAttachmentHostStyle &&
|
||||
urlAttachmentTitleStyle == other.urlAttachmentTitleStyle &&
|
||||
urlAttachmentTextStyle == other.urlAttachmentTextStyle &&
|
||||
urlAttachmentTitleMaxLine == other.urlAttachmentTitleMaxLine;
|
||||
|
||||
@override
|
||||
@@ -191,7 +244,10 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
reactionsBorderColor.hashCode ^
|
||||
reactionsMaskColor.hashCode ^
|
||||
avatarTheme.hashCode ^
|
||||
linkBackgroundColor.hashCode ^
|
||||
urlAttachmentBackgroundColor.hashCode ^
|
||||
urlAttachmentHostStyle.hashCode ^
|
||||
urlAttachmentTitleStyle.hashCode ^
|
||||
urlAttachmentTextStyle.hashCode ^
|
||||
urlAttachmentTitleMaxLine.hashCode;
|
||||
|
||||
@override
|
||||
@@ -209,7 +265,22 @@ class StreamMessageThemeData with Diagnosticable {
|
||||
..add(ColorProperty('reactionsBackgroundColor', reactionsBackgroundColor))
|
||||
..add(ColorProperty('reactionsBorderColor', reactionsBorderColor))
|
||||
..add(ColorProperty('reactionsMaskColor', reactionsMaskColor))
|
||||
..add(ColorProperty('linkBackgroundColor', linkBackgroundColor))
|
||||
..add(ColorProperty(
|
||||
'urlAttachmentBackgroundColor',
|
||||
urlAttachmentBackgroundColor,
|
||||
))
|
||||
..add(DiagnosticsProperty(
|
||||
'urlAttachmentHostStyle',
|
||||
urlAttachmentHostStyle,
|
||||
))
|
||||
..add(DiagnosticsProperty(
|
||||
'urlAttachmentTitleStyle',
|
||||
urlAttachmentTitleStyle,
|
||||
))
|
||||
..add(DiagnosticsProperty(
|
||||
'urlAttachmentTextStyle',
|
||||
urlAttachmentTextStyle,
|
||||
))
|
||||
..add(DiagnosticsProperty(
|
||||
'urlAttachmentTitleMaxLine',
|
||||
urlAttachmentTitleMaxLine,
|
||||
|
||||
@@ -199,7 +199,12 @@ class StreamChatThemeData {
|
||||
messageLinksStyle: TextStyle(
|
||||
color: accentColor,
|
||||
),
|
||||
linkBackgroundColor: colorTheme.linkBg,
|
||||
urlAttachmentBackgroundColor: colorTheme.linkBg,
|
||||
urlAttachmentHostStyle: textTheme.bodyBold.copyWith(color: accentColor),
|
||||
urlAttachmentTitleStyle:
|
||||
textTheme.body.copyWith(fontWeight: FontWeight.w700),
|
||||
urlAttachmentTextStyle:
|
||||
textTheme.body.copyWith(fontWeight: FontWeight.w400),
|
||||
),
|
||||
otherMessageTheme: StreamMessageThemeData(
|
||||
reactionsBackgroundColor: colorTheme.disabled,
|
||||
@@ -223,7 +228,12 @@ class StreamChatThemeData {
|
||||
width: 32,
|
||||
),
|
||||
),
|
||||
linkBackgroundColor: colorTheme.linkBg,
|
||||
urlAttachmentBackgroundColor: colorTheme.linkBg,
|
||||
urlAttachmentHostStyle: textTheme.bodyBold.copyWith(color: accentColor),
|
||||
urlAttachmentTitleStyle:
|
||||
textTheme.body.copyWith(fontWeight: FontWeight.w700),
|
||||
urlAttachmentTextStyle:
|
||||
textTheme.body.copyWith(fontWeight: FontWeight.w400),
|
||||
),
|
||||
messageInputTheme: StreamMessageInputThemeData(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
|
||||
@@ -60,7 +60,7 @@ final _messageThemeControl = StreamMessageThemeData(
|
||||
messageLinksStyle: TextStyle(
|
||||
color: StreamColorTheme.light().accentPrimary,
|
||||
),
|
||||
linkBackgroundColor: StreamColorTheme.light().linkBg,
|
||||
urlAttachmentBackgroundColor: StreamColorTheme.light().linkBg,
|
||||
);
|
||||
|
||||
final _messageThemeControlDark = StreamMessageThemeData(
|
||||
@@ -89,5 +89,5 @@ final _messageThemeControlDark = StreamMessageThemeData(
|
||||
messageLinksStyle: TextStyle(
|
||||
color: StreamColorTheme.dark().accentPrimary,
|
||||
),
|
||||
linkBackgroundColor: StreamColorTheme.dark().linkBg,
|
||||
urlAttachmentBackgroundColor: StreamColorTheme.dark().linkBg,
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user