💄 Optimize chat appbar
This commit is contained in:
@@ -468,70 +468,84 @@ class ChatListScreen extends HookConsumerWidget {
|
|||||||
return const EmptyPageHolder();
|
return const EmptyPageHolder();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
final appbarFeColor = Theme.of(context).appBarTheme.foregroundColor;
|
||||||
|
|
||||||
return AppScaffold(
|
return AppScaffold(
|
||||||
extendBody: false, // Prevent conflicts with tabs navigation
|
extendBody: false, // Prevent conflicts with tabs navigation
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
title: const Text('chat').tr(),
|
flexibleSpace: Container(
|
||||||
bottom: TabBar(
|
height: 48,
|
||||||
controller: tabController,
|
margin: EdgeInsets.only(
|
||||||
tabs: [
|
left: 8,
|
||||||
Tab(
|
right: 8,
|
||||||
child: Text(
|
top: 4 + MediaQuery.of(context).padding.top,
|
||||||
'chatTabAll'.tr(),
|
bottom: 4,
|
||||||
textAlign: TextAlign.center,
|
|
||||||
style: TextStyle(
|
|
||||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Tab(
|
|
||||||
child: Text(
|
|
||||||
'chatTabDirect'.tr(),
|
|
||||||
textAlign: TextAlign.center,
|
|
||||||
style: TextStyle(
|
|
||||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Tab(
|
|
||||||
child: Text(
|
|
||||||
'chatTabGroup'.tr(),
|
|
||||||
textAlign: TextAlign.center,
|
|
||||||
style: TextStyle(
|
|
||||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
actions: [
|
|
||||||
IconButton(
|
|
||||||
icon: Badge(
|
|
||||||
label: Text(
|
|
||||||
chatInvites.when(
|
|
||||||
data: (invites) => invites.length.toString(),
|
|
||||||
error: (_, _) => '0',
|
|
||||||
loading: () => '0',
|
|
||||||
),
|
|
||||||
),
|
|
||||||
isLabelVisible: chatInvites.when(
|
|
||||||
data: (invites) => invites.isNotEmpty,
|
|
||||||
error: (_, _) => false,
|
|
||||||
loading: () => false,
|
|
||||||
),
|
|
||||||
child: const Icon(Symbols.email),
|
|
||||||
),
|
|
||||||
onPressed: () {
|
|
||||||
showModalBottomSheet(
|
|
||||||
useRootNavigator: true,
|
|
||||||
isScrollControlled: true,
|
|
||||||
context: context,
|
|
||||||
builder: (context) => const _ChatInvitesSheet(),
|
|
||||||
);
|
|
||||||
},
|
|
||||||
),
|
),
|
||||||
const Gap(8),
|
child: Padding(
|
||||||
],
|
padding: const EdgeInsets.symmetric(horizontal: 8),
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
Expanded(
|
||||||
|
child: Row(
|
||||||
|
spacing: 8,
|
||||||
|
children: [
|
||||||
|
IconButton(
|
||||||
|
icon: Icon(
|
||||||
|
Symbols.inbox,
|
||||||
|
fill: tabController.index == 0 ? 1 : 0,
|
||||||
|
),
|
||||||
|
color: appbarFeColor,
|
||||||
|
onPressed: () => tabController.animateTo(0),
|
||||||
|
),
|
||||||
|
IconButton(
|
||||||
|
icon: Icon(
|
||||||
|
Symbols.person,
|
||||||
|
fill: tabController.index == 1 ? 1 : 0,
|
||||||
|
),
|
||||||
|
color: appbarFeColor,
|
||||||
|
onPressed: () => tabController.animateTo(1),
|
||||||
|
),
|
||||||
|
IconButton(
|
||||||
|
icon: Icon(
|
||||||
|
Symbols.group,
|
||||||
|
fill: tabController.index == 2 ? 1 : 0,
|
||||||
|
),
|
||||||
|
color: appbarFeColor,
|
||||||
|
onPressed: () => tabController.animateTo(2),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
IconButton(
|
||||||
|
icon: Badge(
|
||||||
|
label: Text(
|
||||||
|
chatInvites.when(
|
||||||
|
data: (invites) => invites.length.toString(),
|
||||||
|
error: (_, _) => '0',
|
||||||
|
loading: () => '0',
|
||||||
|
),
|
||||||
|
),
|
||||||
|
isLabelVisible: chatInvites.when(
|
||||||
|
data: (invites) => invites.isNotEmpty,
|
||||||
|
error: (_, _) => false,
|
||||||
|
loading: () => false,
|
||||||
|
),
|
||||||
|
child: const Icon(Symbols.email),
|
||||||
|
),
|
||||||
|
color: appbarFeColor,
|
||||||
|
onPressed: () {
|
||||||
|
showModalBottomSheet(
|
||||||
|
useRootNavigator: true,
|
||||||
|
isScrollControlled: true,
|
||||||
|
context: context,
|
||||||
|
builder: (context) => const _ChatInvitesSheet(),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
body: ChatListBodyWidget(
|
body: ChatListBodyWidget(
|
||||||
isFloating: false,
|
isFloating: false,
|
||||||
|
|||||||
@@ -362,7 +362,6 @@ class ExploreScreen extends HookConsumerWidget {
|
|||||||
final foregroundColor = Theme.of(context).appBarTheme.foregroundColor;
|
final foregroundColor = Theme.of(context).appBarTheme.foregroundColor;
|
||||||
|
|
||||||
return AppBar(
|
return AppBar(
|
||||||
toolbarHeight: 48,
|
|
||||||
flexibleSpace: Container(
|
flexibleSpace: Container(
|
||||||
height: 48,
|
height: 48,
|
||||||
margin: EdgeInsets.only(
|
margin: EdgeInsets.only(
|
||||||
@@ -371,91 +370,94 @@ class ExploreScreen extends HookConsumerWidget {
|
|||||||
top: 4 + MediaQuery.of(context).padding.top,
|
top: 4 + MediaQuery.of(context).padding.top,
|
||||||
bottom: 4,
|
bottom: 4,
|
||||||
),
|
),
|
||||||
child: Row(
|
child: Padding(
|
||||||
spacing: 8,
|
padding: const EdgeInsets.symmetric(horizontal: 8),
|
||||||
children: [
|
child: Row(
|
||||||
IconButton(
|
spacing: 8,
|
||||||
onPressed: () => handleFilterChange(null),
|
children: [
|
||||||
icon: Icon(
|
IconButton(
|
||||||
Symbols.explore,
|
onPressed: () => handleFilterChange(null),
|
||||||
color: foregroundColor,
|
icon: Icon(
|
||||||
fill: currentFilter == null ? 1 : null,
|
Symbols.explore,
|
||||||
),
|
color: foregroundColor,
|
||||||
tooltip: 'explore'.tr(),
|
fill: currentFilter == null ? 1 : null,
|
||||||
isSelected: currentFilter == null,
|
|
||||||
color: currentFilter == null ? foregroundColor : null,
|
|
||||||
),
|
|
||||||
IconButton(
|
|
||||||
onPressed: () => handleFilterChange('subscriptions'),
|
|
||||||
icon: Icon(
|
|
||||||
Symbols.subscriptions,
|
|
||||||
color: foregroundColor,
|
|
||||||
fill: currentFilter == 'subscription' ? 1 : null,
|
|
||||||
),
|
|
||||||
tooltip: 'exploreFilterSubscriptions'.tr(),
|
|
||||||
isSelected: currentFilter == 'subscriptions',
|
|
||||||
),
|
|
||||||
IconButton(
|
|
||||||
onPressed: () => handleFilterChange('friends'),
|
|
||||||
icon: Icon(
|
|
||||||
Symbols.people,
|
|
||||||
color: foregroundColor,
|
|
||||||
fill: currentFilter == 'friends' ? 1 : null,
|
|
||||||
),
|
|
||||||
tooltip: 'exploreFilterFriends'.tr(),
|
|
||||||
isSelected: currentFilter == 'friends',
|
|
||||||
),
|
|
||||||
const Spacer(),
|
|
||||||
IconButton(
|
|
||||||
onPressed: () {
|
|
||||||
context.pushNamed('articles');
|
|
||||||
},
|
|
||||||
icon: Icon(Symbols.auto_stories, color: foregroundColor),
|
|
||||||
tooltip: 'webArticlesStand'.tr(),
|
|
||||||
),
|
|
||||||
PopupMenuButton(
|
|
||||||
itemBuilder: (context) => [
|
|
||||||
PopupMenuItem(
|
|
||||||
child: Row(
|
|
||||||
children: [
|
|
||||||
const Icon(Symbols.category),
|
|
||||||
const Gap(12),
|
|
||||||
Text('categoriesAndTags').tr(),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
onTap: () {
|
|
||||||
context.pushNamed('postCategories');
|
|
||||||
},
|
|
||||||
),
|
),
|
||||||
PopupMenuItem(
|
tooltip: 'explore'.tr(),
|
||||||
child: Row(
|
isSelected: currentFilter == null,
|
||||||
children: [
|
color: currentFilter == null ? foregroundColor : null,
|
||||||
const Icon(Symbols.shuffle),
|
),
|
||||||
const Gap(12),
|
IconButton(
|
||||||
Text('postShuffle').tr(),
|
onPressed: () => handleFilterChange('subscriptions'),
|
||||||
],
|
icon: Icon(
|
||||||
),
|
Symbols.subscriptions,
|
||||||
onTap: () {
|
color: foregroundColor,
|
||||||
context.pushNamed('postShuffle');
|
fill: currentFilter == 'subscription' ? 1 : null,
|
||||||
},
|
|
||||||
),
|
),
|
||||||
PopupMenuItem(
|
tooltip: 'exploreFilterSubscriptions'.tr(),
|
||||||
child: Row(
|
isSelected: currentFilter == 'subscriptions',
|
||||||
children: [
|
),
|
||||||
const Icon(Symbols.search),
|
IconButton(
|
||||||
const Gap(12),
|
onPressed: () => handleFilterChange('friends'),
|
||||||
Text('search').tr(),
|
icon: Icon(
|
||||||
],
|
Symbols.people,
|
||||||
),
|
color: foregroundColor,
|
||||||
onTap: () {
|
fill: currentFilter == 'friends' ? 1 : null,
|
||||||
context.pushNamed('postSearch');
|
|
||||||
},
|
|
||||||
),
|
),
|
||||||
],
|
tooltip: 'exploreFilterFriends'.tr(),
|
||||||
icon: Icon(Symbols.action_key, color: foregroundColor),
|
isSelected: currentFilter == 'friends',
|
||||||
tooltip: 'search'.tr(),
|
),
|
||||||
),
|
const Spacer(),
|
||||||
],
|
IconButton(
|
||||||
|
onPressed: () {
|
||||||
|
context.pushNamed('articles');
|
||||||
|
},
|
||||||
|
icon: Icon(Symbols.auto_stories, color: foregroundColor),
|
||||||
|
tooltip: 'webArticlesStand'.tr(),
|
||||||
|
),
|
||||||
|
PopupMenuButton(
|
||||||
|
itemBuilder: (context) => [
|
||||||
|
PopupMenuItem(
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
const Icon(Symbols.category),
|
||||||
|
const Gap(12),
|
||||||
|
Text('categoriesAndTags').tr(),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
onTap: () {
|
||||||
|
context.pushNamed('postCategories');
|
||||||
|
},
|
||||||
|
),
|
||||||
|
PopupMenuItem(
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
const Icon(Symbols.shuffle),
|
||||||
|
const Gap(12),
|
||||||
|
Text('postShuffle').tr(),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
onTap: () {
|
||||||
|
context.pushNamed('postShuffle');
|
||||||
|
},
|
||||||
|
),
|
||||||
|
PopupMenuItem(
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
const Icon(Symbols.search),
|
||||||
|
const Gap(12),
|
||||||
|
Text('search').tr(),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
onTap: () {
|
||||||
|
context.pushNamed('postSearch');
|
||||||
|
},
|
||||||
|
),
|
||||||
|
],
|
||||||
|
icon: Icon(Symbols.action_key, color: foregroundColor),
|
||||||
|
tooltip: 'search'.tr(),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user