2ndbeam/fluffychat-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: Nicer empty chat list placeholder

Browse source
This commit is contained in:
krille-chan 2024-08-11 09:40:08 +02:00
commit 664548d937
No known key found for this signature in database
3 changed files with 114 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

1
assets/l10n/intl_en.arb
View file

@ -205,6 +205,7 @@
} }
}, },
"noMoreChatsFound": "No more chats found...", "noMoreChatsFound": "No more chats found...",
"noChatsFoundHere": "No chats found here yet. Start a new chat with someone by using the button below. ⤵️",
"joinedChats": "Joined chats", "joinedChats": "Joined chats",
"unread": "Unread", "unread": "Unread",
"space": "Space", "space": "Space",

99
lib/pages/chat_list/chat_list_body.dart
View file

@ -7,6 +7,7 @@ import 'package:matrix/matrix.dart';
import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/pages/chat_list/chat_list.dart'; import 'package:fluffychat/pages/chat_list/chat_list.dart';
import 'package:fluffychat/pages/chat_list/chat_list_item.dart'; import 'package:fluffychat/pages/chat_list/chat_list_item.dart';
import 'package:fluffychat/pages/chat_list/dummy_chat_list_item.dart';
import 'package:fluffychat/pages/chat_list/search_title.dart'; import 'package:fluffychat/pages/chat_list/search_title.dart';
import 'package:fluffychat/pages/chat_list/space_view.dart'; import 'package:fluffychat/pages/chat_list/space_view.dart';
import 'package:fluffychat/pages/chat_list/status_msg_list.dart'; import 'package:fluffychat/pages/chat_list/status_msg_list.dart';
@ -61,8 +62,6 @@ class ChatListViewBody extends StatelessWidget {
.toList(); .toList();
final userSearchResult = controller.userSearchResult; final userSearchResult = controller.userSearchResult;
const dummyChatCount = 4; const dummyChatCount = 4;
final titleColor = theme.textTheme.bodyLarge!.color!.withAlpha(100);
final subtitleColor = theme.textTheme.bodyLarge!.color!.withAlpha(50);
final filter = controller.searchController.text.toLowerCase(); final filter = controller.searchController.text.toLowerCase();
return StreamBuilder( return StreamBuilder(
key: ValueKey( key: ValueKey(
@ -238,13 +237,44 @@ class ChatListViewBody extends StatelessWidget {
if (client.prevBatch != null && if (client.prevBatch != null &&
rooms.isEmpty && rooms.isEmpty &&
!controller.isSearchMode) ...[ !controller.isSearchMode) ...[
Padding( Column(
padding: const EdgeInsets.all(32.0), mainAxisAlignment: MainAxisAlignment.center,
child: Icon( children: [
CupertinoIcons.chat_bubble_2, Stack(
size: 128, alignment: Alignment.center,
color: theme.colorScheme.secondary, children: [
), const Column(
mainAxisSize: MainAxisSize.min,
children: [
DummyChatListItem(
opacity: 0.5,
animate: false,
),
DummyChatListItem(
opacity: 0.3,
animate: false,
),
],
),
Icon(
CupertinoIcons.chat_bubble_text_fill,
size: 128,
color: theme.colorScheme.secondary,
),
],
),
Padding(
padding: const EdgeInsets.all(16.0),
child: Text(
L10n.of(context)!.noChatsFoundHere,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18,
color: theme.colorScheme.secondary,
),
),
),
],
), ),
], ],
], ],
@ -253,56 +283,9 @@ class ChatListViewBody extends StatelessWidget {
if (client.prevBatch == null) if (client.prevBatch == null)
SliverList( SliverList(
delegate: SliverChildBuilderDelegate( delegate: SliverChildBuilderDelegate(
(context, i) => Opacity( (context, i) => DummyChatListItem(
opacity: (dummyChatCount - i) / dummyChatCount, opacity: (dummyChatCount - i) / dummyChatCount,
child: ListTile( animate: true,
leading: CircleAvatar(
backgroundColor: titleColor,
child: CircularProgressIndicator(
strokeWidth: 1,
color: theme.textTheme.bodyLarge!.color,
),
),
title: Row(
children: [
Expanded(
child: Container(
height: 14,
decoration: BoxDecoration(
color: titleColor,
borderRadius: BorderRadius.circular(3),
),
),
),
const SizedBox(width: 36),
Container(
height: 14,
width: 14,
decoration: BoxDecoration(
color: subtitleColor,
borderRadius: BorderRadius.circular(14),
),
),
const SizedBox(width: 12),
Container(
height: 14,
width: 14,
decoration: BoxDecoration(
color: subtitleColor,
borderRadius: BorderRadius.circular(14),
),
),
],
),
subtitle: Container(
decoration: BoxDecoration(
color: subtitleColor,
borderRadius: BorderRadius.circular(3),
),
height: 12,
margin: const EdgeInsets.only(right: 22),
),
),
), ),
childCount: dummyChatCount, childCount: dummyChatCount,
), ),

72
lib/pages/chat_list/dummy_chat_list_item.dart Normal file
View file

@ -0,0 +1,72 @@
import 'package:flutter/material.dart';
class DummyChatListItem extends StatelessWidget {
final double opacity;
final bool animate;
const DummyChatListItem({
required this.opacity,
required this.animate,
super.key,
});
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final titleColor = theme.textTheme.bodyLarge!.color!.withAlpha(100);
final subtitleColor = theme.textTheme.bodyLarge!.color!.withAlpha(50);
return Opacity(
opacity: opacity,
child: ListTile(
leading: CircleAvatar(
backgroundColor: titleColor,
child: animate
? CircularProgressIndicator(
strokeWidth: 1,
color: theme.textTheme.bodyLarge!.color,
)
: const SizedBox.shrink(),
),
title: Row(
children: [
Expanded(
child: Container(
height: 14,
decoration: BoxDecoration(
color: titleColor,
borderRadius: BorderRadius.circular(3),
),
),
),
const SizedBox(width: 36),
Container(
height: 14,
width: 14,
decoration: BoxDecoration(
color: subtitleColor,
borderRadius: BorderRadius.circular(14),
),
),
const SizedBox(width: 12),
Container(
height: 14,
width: 14,
decoration: BoxDecoration(
color: subtitleColor,
borderRadius: BorderRadius.circular(14),
),
),
],
),
subtitle: Container(
decoration: BoxDecoration(
color: subtitleColor,
borderRadius: BorderRadius.circular(3),
),
height: 12,
margin: const EdgeInsets.only(right: 22),
),
),
);
}
}