♻️ Refactored navigation

This commit is contained in:
LittleSheep 2024-07-12 16:19:54 +08:00
parent 48b76ed574
commit aa43eaa0eb
27 changed files with 115 additions and 197 deletions

View File

@ -17,7 +17,7 @@ import 'package:solian/screens/realms.dart';
import 'package:solian/screens/realms/realm_detail.dart';
import 'package:solian/screens/realms/realm_organize.dart';
import 'package:solian/screens/realms/realm_view.dart';
import 'package:solian/screens/feed.dart';
import 'package:solian/screens/home.dart';
import 'package:solian/screens/posts/post_editor.dart';
import 'package:solian/shells/basic_shell.dart';
import 'package:solian/shells/root_shell.dart';
@ -48,8 +48,8 @@ abstract class AppRouter {
routes: [
GoRoute(
path: '/',
name: 'feed',
builder: (context, state) => const FeedScreen(),
name: 'home',
builder: (context, state) => const HomeScreen(),
),
GoRoute(
path: '/feed/search',

View File

@ -4,7 +4,7 @@ import 'package:solian/exts.dart';
import 'package:solian/models/articles.dart';
import 'package:solian/providers/content/feed.dart';
import 'package:solian/widgets/articles/article_item.dart';
import 'package:solian/widgets/centered_container.dart';
import 'package:solian/widgets/sized_container.dart';
class ArticleDetailScreen extends StatefulWidget {
final String alias;

View File

@ -10,7 +10,6 @@ import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/attachments/attachment_publish.dart';
import 'package:solian/widgets/feed/feed_tags_field.dart';
import 'package:solian/widgets/prev_page.dart';
import 'package:textfield_tags/textfield_tags.dart';
import 'package:badges/badges.dart' as badges;
@ -133,7 +132,6 @@ class _ArticlePublishScreenState extends State<ArticlePublishScreen> {
title: AppBarTitle('articlePublish'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: const PrevPageButton(),
actions: [
TextButton(
onPressed: _isBusy ? null : () => applyPost(),

View File

@ -7,7 +7,6 @@ import 'package:solian/providers/content/call.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/chat/call/call_controls.dart';
import 'package:solian/widgets/chat/call/call_participant.dart';
import 'package:solian/widgets/prev_page.dart';
class CallScreen extends StatefulWidget {
const CallScreen({super.key});
@ -72,7 +71,6 @@ class _CallScreenState extends State<CallScreen> {
),
]),
),
leading: const PrevPageButton(),
),
body: SafeArea(
child: Obx(

View File

@ -9,7 +9,6 @@ import 'package:solian/providers/content/channel.dart';
import 'package:solian/router.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/prev_page.dart';
import 'package:uuid/uuid.dart';
class ChannelOrganizeArguments {
@ -112,7 +111,6 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
title: AppBarTitle('channelOrganizing'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: const PrevPageButton(),
actions: [
TextButton(
onPressed: _isBusy ? null : () => applyChannel(),

View File

@ -12,7 +12,6 @@ import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/channel/channel_list.dart';
import 'package:solian/widgets/chat/call/chat_call_indicator.dart';
import 'package:solian/widgets/current_state_action.dart';
import 'package:solian/widgets/drawer_button.dart' as drawer;
class ChatScreen extends StatefulWidget {
const ChatScreen({super.key});
@ -95,7 +94,6 @@ class _ChatScreenState extends State<ChatScreen> {
title: AppBarTitle('chat'.tr),
centerTitle: false,
floating: true,
leading: const drawer.DrawerButton(),
toolbarHeight: SolianTheme.toolbarHeight(context),
actions: [
const BackgroundStateWidget(),

View File

@ -6,14 +6,13 @@ import 'package:solian/models/feed.dart';
import 'package:solian/models/pagination.dart';
import 'package:solian/models/post.dart';
import 'package:solian/providers/content/feed.dart';
import 'package:solian/screens/feed.dart';
import 'package:solian/screens/home.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/articles/article_action.dart';
import 'package:solian/widgets/articles/article_owned_list.dart';
import 'package:solian/widgets/posts/post_action.dart';
import 'package:solian/widgets/posts/post_owned_list.dart';
import 'package:solian/widgets/prev_page.dart';
class DraftBoxScreen extends StatefulWidget {
const DraftBoxScreen({super.key});
@ -66,7 +65,6 @@ class _DraftBoxScreenState extends State<DraftBoxScreen> {
title: AppBarTitle('draftBox'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: const PrevPageButton(),
actions: [
FeedCreationButton(
hideDraftBox: true,

View File

@ -11,16 +11,15 @@ import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/current_state_action.dart';
import 'package:solian/widgets/feed/feed_list.dart';
import 'package:solian/widgets/drawer_button.dart' as drawer;
class FeedScreen extends StatefulWidget {
const FeedScreen({super.key});
class HomeScreen extends StatefulWidget {
const HomeScreen({super.key});
@override
State<FeedScreen> createState() => _FeedScreenState();
State<HomeScreen> createState() => _HomeScreenState();
}
class _FeedScreenState extends State<FeedScreen> {
class _HomeScreenState extends State<HomeScreen> {
final PagingController<int, FeedRecord> _pagingController =
PagingController(firstPageKey: 0);
@ -60,11 +59,10 @@ class _FeedScreenState extends State<FeedScreen> {
child: CustomScrollView(
slivers: [
SliverAppBar(
title: AppBarTitle('feed'.tr),
title: AppBarTitle('home'.tr),
centerTitle: false,
floating: true,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: const drawer.DrawerButton(),
actions: [
const BackgroundStateWidget(),
const NotificationButton(),

View File

@ -3,7 +3,7 @@ import 'package:get/get.dart';
import 'package:solian/exts.dart';
import 'package:solian/models/post.dart';
import 'package:solian/providers/content/feed.dart';
import 'package:solian/widgets/centered_container.dart';
import 'package:solian/widgets/sized_container.dart';
import 'package:solian/widgets/posts/post_item.dart';
import 'package:solian/widgets/posts/post_replies.dart';

View File

@ -12,7 +12,6 @@ import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/attachments/attachment_publish.dart';
import 'package:solian/widgets/posts/post_item.dart';
import 'package:solian/widgets/feed/feed_tags_field.dart';
import 'package:solian/widgets/prev_page.dart';
import 'package:textfield_tags/textfield_tags.dart';
import 'package:badges/badges.dart' as badges;
@ -137,7 +136,6 @@ class _PostPublishScreenState extends State<PostPublishScreen> {
title: AppBarTitle('postPublish'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: const PrevPageButton(),
actions: [
TextButton(
onPressed: _isBusy ? null : () => applyPost(),

View File

@ -11,7 +11,6 @@ import 'package:solian/theme.dart';
import 'package:solian/widgets/account/signin_required_overlay.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/current_state_action.dart';
import 'package:solian/widgets/drawer_button.dart' as drawer;
class RealmListScreen extends StatefulWidget {
const RealmListScreen({super.key});
@ -80,7 +79,6 @@ class _RealmListScreenState extends State<RealmListScreen> {
title: AppBarTitle('realm'.tr),
centerTitle: false,
floating: true,
leading: const drawer.DrawerButton(),
toolbarHeight: SolianTheme.toolbarHeight(context),
actions: [
const BackgroundStateWidget(),

View File

@ -7,7 +7,6 @@ import 'package:solian/providers/auth.dart';
import 'package:solian/router.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/prev_page.dart';
import 'package:uuid/uuid.dart';
class RealmOrganizeArguments {
@ -102,7 +101,6 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
title: AppBarTitle('realmOrganizing'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: const PrevPageButton(),
actions: [
TextButton(
onPressed: _isBusy ? null : () => applyRealm(),

View File

@ -1,10 +1,8 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:go_router/go_router.dart';
import 'package:solian/router.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/prev_page.dart';
import 'package:solian/widgets/sidebar/sidebar_placeholder.dart';
class BasicShell extends StatelessWidget {
@ -42,16 +40,12 @@ class BasicShell extends StatelessWidget {
@override
Widget build(BuildContext context) {
final canPop = AppRouter.instance.canPop();
return Scaffold(
appBar: showAppBar
? AppBar(
title: AppBarTitle(state.topRoute?.name?.tr ?? 'page'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: canPop ? const PrevPageButton() : null,
automaticallyImplyLeading: false,
)
: null,
body: SolianTheme.isLargeScreen(context)

View File

@ -1,10 +1,8 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:go_router/go_router.dart';
import 'package:solian/router.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/prev_page.dart';
class CenteredShell extends StatelessWidget {
final bool showAppBar;
@ -20,16 +18,12 @@ class CenteredShell extends StatelessWidget {
@override
Widget build(BuildContext context) {
final canPop = AppRouter.instance.canPop();
return Scaffold(
appBar: showAppBar
? AppBar(
title: AppBarTitle(state.topRoute?.name?.tr ?? 'page'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: canPop ? const PrevPageButton() : null,
automaticallyImplyLeading: false,
)
: null,
body: Center(

View File

@ -2,7 +2,6 @@ import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/navigation/app_navigation_drawer.dart';
import 'package:solian/widgets/navigation/app_navigation_rail.dart';
final GlobalKey<ScaffoldState> rootScaffoldKey = GlobalKey<ScaffoldState>();
@ -32,14 +31,16 @@ class RootShell extends StatelessWidget {
return Scaffold(
key: rootScaffoldKey,
drawer: AppNavigationDrawer(
drawer: SolianTheme.isLargeScreen(context)
? null
: AppNavigationDrawer(
key: const ValueKey('navigation-drawer'),
routeName: routeName,
),
body: SolianTheme.isLargeScreen(context)
? Row(
children: [
if (showNavigation) const AppNavigationRail(),
if (showNavigation) AppNavigationDrawer(routeName: routeName),
if (showNavigation)
const VerticalDivider(thickness: 0.3, width: 1),
Expanded(child: child),

View File

@ -1,11 +1,8 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:go_router/go_router.dart';
import 'package:solian/router.dart';
import 'package:solian/theme.dart';
import 'package:solian/widgets/app_bar_title.dart';
import 'package:solian/widgets/prev_page.dart' as prev;
import 'package:solian/widgets/drawer_button.dart' as drawer;
class TitleShell extends StatelessWidget {
final bool showAppBar;
@ -21,18 +18,12 @@ class TitleShell extends StatelessWidget {
@override
Widget build(BuildContext context) {
final canPop = AppRouter.instance.canPop();
return Scaffold(
appBar: showAppBar
? AppBar(
title: AppBarTitle(state.topRoute?.name?.tr ?? 'page'.tr),
centerTitle: false,
toolbarHeight: SolianTheme.toolbarHeight(context),
leading: canPop
? const prev.PrevPageButton()
: const drawer.DrawerButton(),
automaticallyImplyLeading: false,
)
: null,
body: child,

View File

@ -5,6 +5,7 @@ const messagesEnglish = {
'next': 'Next',
'reset': 'Reset',
'page': 'Page',
'home': 'Home',
'draft': 'Draft',
'draftSave': 'Save',
'draftBox': 'Draft Box',

View File

@ -2,6 +2,7 @@ const simplifiedChineseMessages = {
'done': '完成',
'hide': '隐藏',
'okay': '确认',
'home': '首页',
'next': '下一步',
'reset': '重置',
'cancel': '取消',

View File

@ -5,7 +5,7 @@ import 'package:solian/models/articles.dart';
import 'package:solian/router.dart';
import 'package:solian/widgets/articles/article_action.dart';
import 'package:solian/widgets/articles/article_item.dart';
import 'package:solian/widgets/centered_container.dart';
import 'package:solian/widgets/sized_container.dart';
class ArticleListWidget extends StatelessWidget {
final bool isShowEmbed;

View File

@ -1,19 +0,0 @@
import 'package:flutter/material.dart';
import 'package:solian/shells/root_shell.dart';
class DrawerButton extends StatelessWidget {
const DrawerButton({super.key});
void openDrawer() {
rootScaffoldKey.currentState!.openDrawer();
}
@override
Widget build(BuildContext context) {
return IconButton(
icon: const Icon(Icons.menu),
tooltip: MaterialLocalizations.of(context).openAppDrawerTooltip,
onPressed: openDrawer,
);
}
}

View File

@ -4,7 +4,7 @@ import 'package:solian/models/articles.dart';
import 'package:solian/models/feed.dart';
import 'package:solian/models/post.dart';
import 'package:solian/widgets/articles/article_list.dart';
import 'package:solian/widgets/centered_container.dart';
import 'package:solian/widgets/sized_container.dart';
import 'package:solian/widgets/posts/post_list.dart';
class FeedListWidget extends StatelessWidget {
@ -28,7 +28,7 @@ class FeedListWidget extends StatelessWidget {
pagingController: controller,
builderDelegate: PagedChildBuilderDelegate<FeedRecord>(
itemBuilder: (context, item, index) {
return CenteredContainer(
return SizedContainer(
child: Builder(
builder: (context) {
switch (item.type) {

View File

@ -4,9 +4,9 @@ import 'package:get/utils.dart';
abstract class AppNavigation {
static List<AppNavigationDestination> destinations = [
AppNavigationDestination(
icon: const Icon(Icons.feed),
label: 'feed'.tr,
page: 'feed',
icon: const Icon(Icons.home),
label: 'home'.tr,
page: 'home',
),
AppNavigationDestination(
icon: const Icon(Icons.forum),
@ -18,11 +18,6 @@ abstract class AppNavigation {
label: 'realms'.tr,
page: 'realms',
),
AppNavigationDestination(
icon: const Icon(Icons.account_circle),
label: 'account'.tr,
page: 'account',
),
];
static List<String> get destinationPages =>

View File

@ -20,7 +20,7 @@ class AppNavigationDrawer extends StatefulWidget {
}
class _AppNavigationDrawerState extends State<AppNavigationDrawer> {
int _selectedIndex = 0;
int? _selectedIndex = 0;
AccountStatus? _accountStatus;
void getStatus() async {
@ -40,7 +40,11 @@ class _AppNavigationDrawerState extends State<AppNavigationDrawer> {
final nameList = AppNavigation.destinations.map((x) => x.page).toList();
final idx = nameList.indexOf(widget.routeName!);
_selectedIndex = idx != -1 ? idx : 0;
_selectedIndex = idx != -1 ? idx : null;
}
void closeDrawer() {
rootScaffoldKey.currentState!.closeDrawer();
}
@override
@ -65,7 +69,7 @@ class _AppNavigationDrawerState extends State<AppNavigationDrawer> {
onDestinationSelected: (idx) {
setState(() => _selectedIndex = idx);
AppRouter.instance.goNamed(AppNavigation.destinations[idx].page);
rootScaffoldKey.currentState!.closeDrawer();
closeDrawer();
},
children: [
FutureBuilder(
@ -75,9 +79,7 @@ class _AppNavigationDrawerState extends State<AppNavigationDrawer> {
return const SizedBox();
}
return Column(
children: [
ListTile(
return ListTile(
contentPadding: const EdgeInsets.symmetric(horizontal: 24),
title: Text(snapshot.data!.body['nick']),
subtitle: Builder(
@ -110,7 +112,9 @@ class _AppNavigationDrawerState extends State<AppNavigationDrawer> {
),
);
}),
onTap: () {
trailing: IconButton(
icon: const Icon(Icons.face_retouching_natural),
onPressed: () {
showModalBottomSheet(
useRootNavigator: true,
context: context,
@ -122,20 +126,27 @@ class _AppNavigationDrawerState extends State<AppNavigationDrawer> {
});
},
),
const Divider(thickness: 0.3, height: 1).paddingOnly(
bottom: 16,
top: 8,
),
],
);
onTap: () {
AppRouter.instance.goNamed('account');
closeDrawer();
},
).paddingOnly(top: 8);
},
),
const Divider(thickness: 0.3, height: 1).paddingOnly(
bottom: 12,
top: 8,
),
...AppNavigation.destinations.map(
(e) => NavigationDrawerDestination(
icon: e.icon,
label: Text(e.label),
),
)
),
const Divider(thickness: 0.3, height: 1).paddingOnly(
top: 12,
bottom: 8,
),
],
);
}

View File

@ -1,36 +0,0 @@
import 'package:flutter/material.dart';
import 'package:solian/router.dart';
import 'package:solian/widgets/navigation/app_navigation.dart';
class AppNavigationRail extends StatefulWidget {
const AppNavigationRail({super.key});
@override
State<AppNavigationRail> createState() => _AppNavigationRailState();
}
class _AppNavigationRailState extends State<AppNavigationRail> {
int _selectedIndex = 0;
@override
Widget build(BuildContext context) {
return NavigationRail(
destinations: AppNavigation.destinations
.map(
(e) => NavigationRailDestination(
icon: e.icon,
label: Text(e.label),
),
)
.toList(),
groupAlignment: 0,
labelType: NavigationRailLabelType.all,
selectedIndex: _selectedIndex,
onDestinationSelected: (idx) {
setState(() => _selectedIndex = idx);
AppRouter.instance
.pushReplacementNamed(AppNavigation.destinations[idx].page);
},
);
}
}

View File

@ -3,7 +3,7 @@ import 'package:get/get.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
import 'package:solian/models/post.dart';
import 'package:solian/router.dart';
import 'package:solian/widgets/centered_container.dart';
import 'package:solian/widgets/sized_container.dart';
import 'package:solian/widgets/posts/post_action.dart';
import 'package:solian/widgets/posts/post_item.dart';

View File

@ -1,19 +0,0 @@
import 'package:flutter/material.dart';
import 'package:solian/router.dart';
class PrevPageButton extends StatelessWidget {
const PrevPageButton({super.key});
@override
Widget build(BuildContext context) {
return IconButton(
icon: const Icon(Icons.arrow_back),
tooltip: MaterialLocalizations.of(context).backButtonTooltip,
onPressed: () {
if (AppRouter.instance.canPop()) {
AppRouter.instance.pop();
}
},
);
}
}

View File

@ -1,5 +1,27 @@
import 'package:flutter/material.dart';
class SizedContainer extends StatelessWidget {
final Widget child;
final double maxWidth;
const SizedContainer({
super.key,
required this.child,
this.maxWidth = 720,
});
@override
Widget build(BuildContext context) {
return Align(
alignment: Alignment.centerLeft,
child: Container(
constraints: BoxConstraints(maxWidth: maxWidth),
child: child,
),
);
}
}
class CenteredContainer extends StatelessWidget {
final Widget child;
final double maxWidth;