mirror of
https://github.com/krille-chan/fluffychat
synced 2024-09-10 07:45:10 +00:00
design: Improve story header design
This commit is contained in:
Krille Fear
parent
97066eed0f
commit
0e2506cd2b
2 changed files with 42 additions and 38 deletions
|
|
@ -14,7 +14,6 @@ import 'package:fluffychat/pages/chat_list/chat_list_item.dart';
|
|||
import 'package:fluffychat/pages/chat_list/client_chooser_button.dart';
|
||||
import 'package:fluffychat/pages/chat_list/spaces_bottom_bar.dart';
|
||||
import 'package:fluffychat/pages/chat_list/stories_header.dart';
|
||||
import 'package:fluffychat/utils/matrix_sdk_extensions.dart/client_stories_extension.dart';
|
||||
import 'package:fluffychat/widgets/connection_status_header.dart';
|
||||
import '../../utils/stream_extension.dart';
|
||||
import '../../widgets/matrix.dart';
|
||||
|
|
@ -100,8 +99,7 @@ class ChatListView extends StatelessWidget {
|
|||
onPressed: () =>
|
||||
VRouter.of(context).to('/search'),
|
||||
),
|
||||
if (selectMode == SelectMode.normal &&
|
||||
Matrix.of(context).client.storiesRooms.isEmpty)
|
||||
if (selectMode == SelectMode.normal)
|
||||
IconButton(
|
||||
icon: const Icon(Icons.camera_alt_outlined),
|
||||
tooltip: L10n.of(context)!.addToStory,
|
||||
|
|
@ -331,7 +329,7 @@ class _ChatListViewBodyState extends State<_ChatListViewBody> {
|
|||
);
|
||||
}
|
||||
} else {
|
||||
const dummyChatCount = 8;
|
||||
const dummyChatCount = 5;
|
||||
final titleColor =
|
||||
Theme.of(context).textTheme.bodyText1!.color!.withAlpha(100);
|
||||
final subtitleColor =
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ import 'package:future_loading_dialog/future_loading_dialog.dart';
|
|||
import 'package:matrix/matrix.dart';
|
||||
import 'package:vrouter/vrouter.dart';
|
||||
|
||||
import 'package:fluffychat/config/app_config.dart';
|
||||
import 'package:fluffychat/utils/matrix_sdk_extensions.dart/client_stories_extension.dart';
|
||||
import 'package:fluffychat/widgets/avatar.dart';
|
||||
import 'package:fluffychat/widgets/matrix.dart';
|
||||
|
|
@ -99,7 +98,7 @@ class StoriesHeader extends StatelessWidget {
|
|||
radius: Avatar.defaultSize / 2,
|
||||
backgroundColor: Theme.of(context).colorScheme.surface,
|
||||
foregroundColor: Theme.of(context).textTheme.bodyText1?.color,
|
||||
child: const Icon(Icons.add),
|
||||
child: const Icon(Icons.camera_alt_outlined),
|
||||
),
|
||||
title: Text(L10n.of(context)!.addToStory),
|
||||
onTap: () => _addToStoryAction(context),
|
||||
|
|
@ -109,7 +108,7 @@ class StoriesHeader extends StatelessWidget {
|
|||
return Container();
|
||||
}
|
||||
return SizedBox(
|
||||
height: 98,
|
||||
height: 106,
|
||||
child: ListView(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 2),
|
||||
scrollDirection: Axis.horizontal,
|
||||
|
|
@ -117,11 +116,11 @@ class StoriesHeader extends StatelessWidget {
|
|||
_StoryButton(
|
||||
label: L10n.of(context)!.yourStory,
|
||||
onPressed: () => _addToStoryAction(context),
|
||||
child: const Icon(Icons.add),
|
||||
child: const Icon(Icons.camera_alt_outlined),
|
||||
),
|
||||
...client.storiesRooms.map(
|
||||
(room) => Opacity(
|
||||
opacity: room.hasPosts ? 1 : 0.5,
|
||||
opacity: room.hasPosts ? 1 : 0.75,
|
||||
child: _StoryButton(
|
||||
label: room.creatorDisplayname,
|
||||
child: Avatar(
|
||||
|
|
@ -131,6 +130,7 @@ class StoriesHeader extends StatelessWidget {
|
|||
.avatarUrl,
|
||||
name: room.creatorDisplayname,
|
||||
size: 100,
|
||||
fontSize: 24,
|
||||
),
|
||||
unread: room.notificationCount > 0 ||
|
||||
room.membership == Membership.invite,
|
||||
|
|
@ -185,7 +185,7 @@ class _StoryButton extends StatelessWidget {
|
|||
return SizedBox(
|
||||
width: 78,
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||
borderRadius: BorderRadius.circular(7),
|
||||
onTap: onPressed,
|
||||
onLongPress: onLongPressed,
|
||||
child: Padding(
|
||||
|
|
@ -193,34 +193,39 @@ class _StoryButton extends StatelessWidget {
|
|||
child: Column(
|
||||
children: [
|
||||
const SizedBox(height: 8),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(2),
|
||||
decoration: BoxDecoration(
|
||||
gradient: unread
|
||||
? const LinearGradient(
|
||||
colors: [
|
||||
Colors.red,
|
||||
Colors.purple,
|
||||
Colors.orange,
|
||||
],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
)
|
||||
: null,
|
||||
color: unread ? null : Theme.of(context).dividerColor,
|
||||
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
||||
),
|
||||
child: Material(
|
||||
color: Theme.of(context).colorScheme.surface,
|
||||
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(2.0),
|
||||
child: CircleAvatar(
|
||||
radius: 30,
|
||||
backgroundColor: Theme.of(context).colorScheme.surface,
|
||||
foregroundColor:
|
||||
Theme.of(context).textTheme.bodyText1?.color,
|
||||
child: child,
|
||||
Material(
|
||||
elevation: Theme.of(context).appBarTheme.elevation ?? 7,
|
||||
shadowColor: Theme.of(context).appBarTheme.shadowColor,
|
||||
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(2),
|
||||
decoration: BoxDecoration(
|
||||
gradient: unread
|
||||
? const LinearGradient(
|
||||
colors: [
|
||||
Colors.red,
|
||||
Colors.purple,
|
||||
Colors.orange,
|
||||
],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
)
|
||||
: null,
|
||||
color: unread ? null : Theme.of(context).dividerColor,
|
||||
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
||||
),
|
||||
child: Material(
|
||||
color: Theme.of(context).colorScheme.surface,
|
||||
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(2.0),
|
||||
child: CircleAvatar(
|
||||
radius: 30,
|
||||
backgroundColor: Theme.of(context).colorScheme.surface,
|
||||
foregroundColor:
|
||||
Theme.of(context).textTheme.bodyText1?.color,
|
||||
child: child,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -235,6 +240,7 @@ class _StoryButton extends StatelessWidget {
|
|||
fontWeight: unread ? FontWeight.bold : null,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
|
|
|||
Loading…
Reference in a new issue