This commit is contained in:
Salvatore Giordano
2020-12-02 13:19:31 +01:00
parent ac0fc427ae
commit 06b2929c37
16 changed files with 203 additions and 97 deletions
+2 -7
View File
@@ -144,13 +144,8 @@ class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget {
Widget _buildConnectedTitleState(BuildContext context) => Text(
'Stream Chat',
style: StreamChatTheme.of(context)
.channelTheme
.channelHeaderTheme
.title
.copyWith(
fontSize: 16,
fontWeight: FontWeight.bold,
style: StreamChatTheme.of(context).textTheme.headlineBold.copyWith(
color: Colors.black,
),
);
+16 -12
View File
@@ -210,9 +210,9 @@ class _ChannelListViewState extends State<ChannelListView>
padding: const EdgeInsets.all(8.0),
child: Text(
'Lets start chatting!',
style: TextStyle(
fontSize: 16,
),
style: StreamChatTheme.of(context)
.textTheme
.headline,
),
),
Padding(
@@ -223,10 +223,12 @@ class _ChannelListViewState extends State<ChannelListView>
child: Text(
'How about sending your first message to a friend?',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 14,
color: Color(0xff7A7A7A),
),
style: StreamChatTheme.of(context)
.textTheme
.body
.copyWith(
color: Color(0xff7A7A7A),
),
),
),
],
@@ -242,11 +244,13 @@ class _ChannelListViewState extends State<ChannelListView>
onPressed: widget.onStartChatPressed,
child: Text(
'Start a chat',
style: TextStyle(
color:
StreamChatTheme.of(context).accentColor,
fontWeight: FontWeight.bold,
),
style: StreamChatTheme.of(context)
.textTheme
.bodyBold
.copyWith(
color: StreamChatTheme.of(context)
.accentColor,
),
),
),
),
+3
View File
@@ -49,6 +49,9 @@ class ChannelPreview extends StatelessWidget {
return Opacity(
opacity: snapshot.data ? 0.5 : 1,
child: ListTile(
contentPadding: const EdgeInsets.symmetric(
horizontal: 8,
),
onTap: () {
if (onTap != null) {
onTap(channel);
+4 -4
View File
@@ -195,10 +195,10 @@ class _MessageListViewState extends State<MessageListView> {
return Center(
child: Text(
'No chats here yet...',
style: TextStyle(
fontSize: 12,
color: Colors.black.withOpacity(.5),
),
style: StreamChatTheme.of(context)
.textTheme
.footnote
.copyWith(color: Colors.black.withOpacity(.5)),
),
);
}
-2
View File
@@ -126,8 +126,6 @@ class MessageSearchItem extends StatelessWidget {
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: StreamChatTheme.of(context).channelPreviewTheme.subtitle.copyWith(
color:
StreamChatTheme.of(context).channelPreviewTheme.subtitle.color,
fontStyle: (message.isSystem || message.isDeleted)
? FontStyle.italic
: FontStyle.normal,
+95 -23
View File
@@ -42,6 +42,9 @@ class StreamChatTheme extends InheritedWidget {
/// Theme data
class StreamChatThemeData {
/// The text themes used in the widgets
final TextTheme textTheme;
/// Primary color of the chat widgets
final Color primaryColor;
@@ -80,6 +83,7 @@ class StreamChatThemeData {
/// Create a theme from scratch
StreamChatThemeData({
this.textTheme,
this.primaryColor,
this.secondaryColor,
this.accentColor,
@@ -131,6 +135,7 @@ class StreamChatThemeData {
/// Creates a copy of [StreamChatThemeData] with specified attributes overridden.
StreamChatThemeData copyWith({
TextTheme textTheme,
Color primaryColor,
Color secondaryColor,
Color accentColor,
@@ -145,6 +150,16 @@ class StreamChatThemeData {
List<ReactionIcon> reactionIcons,
}) =>
StreamChatThemeData(
textTheme: this.textTheme?.copyWith(
title: textTheme?.title,
body: textTheme?.body,
bodyBold: textTheme?.bodyBold,
captionBold: textTheme?.captionBold,
footnote: textTheme?.footnote,
footnoteBold: textTheme?.footnoteBold,
headline: textTheme?.headline,
headlineBold: textTheme?.headlineBold,
),
primaryColor: primaryColor ?? this.primaryColor,
secondaryColor: secondaryColor ?? this.secondaryColor,
primaryIconTheme: primaryIconTheme ?? this.primaryIconTheme,
@@ -152,17 +167,12 @@ class StreamChatThemeData {
defaultChannelImage: defaultChannelImage ?? this.defaultChannelImage,
defaultUserImage: defaultUserImage ?? this.defaultUserImage,
backgroundColor: backgroundColor ?? this.backgroundColor,
channelPreviewTheme: channelPreviewTheme?.copyWith(
title:
channelPreviewTheme.title ?? this.channelPreviewTheme.title,
subtitle: channelPreviewTheme.subtitle ??
this.channelPreviewTheme.subtitle,
lastMessageAt: channelPreviewTheme.lastMessageAt ??
this.channelPreviewTheme.lastMessageAt,
avatarTheme: channelPreviewTheme.avatarTheme ??
this.channelPreviewTheme.avatarTheme,
) ??
this.channelPreviewTheme,
channelPreviewTheme: this.channelPreviewTheme?.copyWith(
title: channelPreviewTheme.title,
subtitle: channelPreviewTheme.subtitle,
lastMessageAt: channelPreviewTheme.lastMessageAt,
avatarTheme: channelPreviewTheme.avatarTheme,
),
channelTheme: channelTheme?.copyWith(
channelHeaderTheme: channelTheme.channelHeaderTheme ??
this.channelTheme.channelHeaderTheme,
@@ -218,7 +228,9 @@ class StreamChatThemeData {
static StreamChatThemeData getDefaultTheme(ThemeData theme) {
final accentColor = Color(0xff006cff);
final isDark = theme.brightness == Brightness.dark;
final textTheme = TextTheme();
return StreamChatThemeData(
textTheme: textTheme,
secondaryColor: Color(0xffEAEAEA),
accentColor: accentColor,
primaryColor: isDark ? Colors.black : Colors.white,
@@ -242,19 +254,12 @@ class StreamChatThemeData {
width: 40,
),
),
title: TextStyle(
fontSize: 14,
color: isDark ? Colors.white : Colors.black,
fontWeight: FontWeight.bold),
subtitle: TextStyle(
fontSize: 12.5,
color: (isDark ? Colors.white : Colors.black).withOpacity(0.5),
title: textTheme.bodyBold,
subtitle: textTheme.footnote.copyWith(
color: Color(0xff7A7A7A),
),
lastMessageAt: TextStyle(
fontSize: 11,
color: isDark
? Colors.white.withOpacity(.5)
: Colors.black.withOpacity(.5),
lastMessageAt: textTheme.footnote.copyWith(
color: Colors.black.withOpacity(.5),
),
),
channelTheme: ChannelTheme(
@@ -375,6 +380,73 @@ class StreamChatThemeData {
}
}
class TextTheme {
final TextStyle title;
final TextStyle headlineBold;
final TextStyle headline;
final TextStyle bodyBold;
final TextStyle body;
final TextStyle footnoteBold;
final TextStyle footnote;
final TextStyle captionBold;
TextTheme({
this.title = const TextStyle(
fontSize: 22,
fontWeight: FontWeight.bold,
),
this.headlineBold = const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
this.headline = const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
),
this.bodyBold = const TextStyle(
fontSize: 14,
fontWeight: FontWeight.bold,
),
this.body = const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
),
this.footnoteBold = const TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
),
this.footnote = const TextStyle(
fontSize: 12,
),
this.captionBold = const TextStyle(
fontSize: 10,
fontWeight: FontWeight.bold,
),
});
TextTheme copyWith({
TextStyle body,
TextStyle title,
TextStyle headlineBold,
TextStyle headline,
TextStyle bodyBold,
TextStyle footnoteBold,
TextStyle footnote,
TextStyle captionBold,
}) {
return TextTheme(
body: body ?? this.body,
title: title ?? this.title,
headlineBold: headlineBold ?? this.headlineBold,
headline: headline ?? this.headline,
bodyBold: bodyBold ?? this.bodyBold,
footnoteBold: footnoteBold ?? this.footnoteBold,
footnote: footnote ?? this.footnote,
captionBold: captionBold ?? this.captionBold,
);
}
}
/// Channel theme data
class ChannelTheme {
/// Theme of the [ChannelHeader] widget
+8 -2
View File
@@ -83,13 +83,19 @@ class UserItem extends StatelessWidget {
: null,
title: Text(
user.name,
style: TextStyle(fontWeight: FontWeight.bold),
style: StreamChatTheme.of(context).textTheme.bodyBold,
),
subtitle: showLastOnline ? _buildLastActive(context) : null,
);
}
Widget _buildLastActive(context) {
return Text('Last online ${Jiffy(user.lastActive).fromNow()}');
return Text(
'Last online ${Jiffy(user.lastActive).fromNow()}',
style: StreamChatTheme.of(context)
.textTheme
.footnote
.copyWith(color: Colors.black.withOpacity(.5)),
);
}
}
+1 -1
View File
@@ -361,7 +361,7 @@ class _UserListViewState extends State<UserListView>
header,
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 12,
fontSize: 14.5,
color: Colors.black.withOpacity(0.3)),
),
),