From 3bfc0b8181f9ccbf0d06b0b5f209f2a28fbf46b0 Mon Sep 17 00:00:00 2001 From: LittleSheep Date: Wed, 1 Oct 2025 16:35:41 +0800 Subject: [PATCH] :recycle: Refactor the bottom nav display --- lib/pods/theme.dart | 4 - lib/screens/account.dart | 1 - lib/screens/account/leveling.dart | 5 +- lib/screens/chat/chat.dart | 7 +- lib/screens/creators/publishers.dart | 3 +- lib/screens/explore.dart | 4 - lib/screens/realm/realms.dart | 5 +- lib/screens/tabs.dart | 78 ++++++++----------- lib/services/responsive.dart | 29 ------- .../account/restore_purchase_sheet.dart | 2 - lib/widgets/app_scaffold.dart | 3 +- lib/widgets/post/compose_dialog.dart | 9 ++- 12 files changed, 47 insertions(+), 103 deletions(-) diff --git a/lib/pods/theme.dart b/lib/pods/theme.dart index 016029fb..f6fceec6 100644 --- a/lib/pods/theme.dart +++ b/lib/pods/theme.dart @@ -100,10 +100,6 @@ Future createAppTheme( opticalSize: 20, color: colorScheme.onSurface, ), - snackBarTheme: SnackBarThemeData( - behavior: useM3 ? SnackBarBehavior.floating : SnackBarBehavior.fixed, - width: 480, - ), appBarTheme: AppBarTheme( centerTitle: true, elevation: hasAppBarTransparent ? 0 : null, diff --git a/lib/screens/account.dart b/lib/screens/account.dart index 6ccdb969..6c54acf5 100644 --- a/lib/screens/account.dart +++ b/lib/screens/account.dart @@ -66,7 +66,6 @@ class AccountScreen extends HookConsumerWidget { isNoBackground: isWide, appBar: AppBar(backgroundColor: Colors.transparent, toolbarHeight: 0), body: SingleChildScrollView( - padding: getTabbedPadding(context), child: Column( spacing: 4, children: [ diff --git a/lib/screens/account/leveling.dart b/lib/screens/account/leveling.dart index dd1dc37d..f6a984e8 100644 --- a/lib/screens/account/leveling.dart +++ b/lib/screens/account/leveling.dart @@ -10,7 +10,6 @@ import 'package:island/models/wallet.dart'; import 'package:island/pods/network.dart'; import 'package:island/pods/userinfo.dart'; import 'package:island/screens/account/credits.dart'; -import 'package:island/services/responsive.dart'; import 'package:island/services/time.dart'; import 'package:island/widgets/account/leveling_progress.dart'; import 'package:island/widgets/account/restore_purchase_sheet.dart'; @@ -259,7 +258,7 @@ class LevelingScreen extends HookConsumerWidget { ), ), - SliverGap(getTabbedPadding(context, vertical: 20).vertical), + SliverGap(20), ], ), ), @@ -270,7 +269,7 @@ class LevelingScreen extends HookConsumerWidget { final stellarSubscription = ref.watch(accountStellarSubscriptionProvider); return SingleChildScrollView( - padding: getTabbedPadding(context, horizontal: 20, vertical: 20), + padding: EdgeInsets.symmetric(horizontal: 20, vertical: 20), child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ diff --git a/lib/screens/chat/chat.dart b/lib/screens/chat/chat.dart index c4236641..35b684dd 100644 --- a/lib/screens/chat/chat.dart +++ b/lib/screens/chat/chat.dart @@ -25,7 +25,6 @@ import 'package:island/widgets/content/cloud_files.dart'; import 'package:island/widgets/content/sheet.dart'; import 'package:island/widgets/realm/realm_selection_dropdown.dart'; import 'package:island/widgets/response.dart'; -import 'package:island/screens/tabs.dart'; import 'package:material_symbols_icons/symbols.dart'; import 'package:relative_time/relative_time.dart'; import 'package:riverpod_annotation/riverpod_annotation.dart'; @@ -219,9 +218,8 @@ class ChatListBodyWidget extends HookConsumerWidget { ref.invalidate(chatroomsJoinedProvider); }), child: ListView.builder( - padding: getTabbedPadding( - context, - bottom: callState.isConnected ? 96 : null, + padding: EdgeInsets.only( + bottom: callState.isConnected ? 96 : 0, ), itemCount: items @@ -531,7 +529,6 @@ class ChatListScreen extends HookConsumerWidget { }, child: const Icon(Symbols.add), ), - floatingActionButtonLocation: TabbedFabLocation(context), body: ChatListBodyWidget( isFloating: false, tabController: tabController, diff --git a/lib/screens/creators/publishers.dart b/lib/screens/creators/publishers.dart index a5b155d6..890b369d 100644 --- a/lib/screens/creators/publishers.dart +++ b/lib/screens/creators/publishers.dart @@ -15,7 +15,6 @@ import 'package:island/pods/network.dart'; import 'package:island/pods/userinfo.dart'; import 'package:island/screens/realm/realms.dart'; import 'package:island/services/file.dart'; -import 'package:island/services/responsive.dart'; import 'package:island/widgets/alert.dart'; import 'package:island/widgets/app_scaffold.dart'; import 'package:island/widgets/content/cloud_files.dart'; @@ -191,7 +190,7 @@ class EditPublisherScreen extends HookConsumerWidget { leading: const PageBackButton(), ), body: SingleChildScrollView( - padding: getTabbedPadding(context, bottom: 16), + padding: EdgeInsets.only(bottom: 16), child: Column( children: [ RealmSelectionDropdown( diff --git a/lib/screens/explore.dart b/lib/screens/explore.dart index d83078b8..1c6d9d11 100644 --- a/lib/screens/explore.dart +++ b/lib/screens/explore.dart @@ -13,7 +13,6 @@ import 'package:island/pods/event_calendar.dart'; import 'package:island/pods/userinfo.dart'; import 'package:island/screens/notification.dart'; import 'package:island/services/responsive.dart'; - import 'package:island/widgets/app_scaffold.dart'; import 'package:island/models/post.dart'; import 'package:island/widgets/check_in.dart'; @@ -21,7 +20,6 @@ import 'package:island/widgets/post/post_featured.dart'; import 'package:island/widgets/post/post_item.dart'; import 'package:island/widgets/post/compose_card.dart'; import 'package:island/widgets/post/compose_dialog.dart'; -import 'package:island/screens/tabs.dart'; import 'package:material_symbols_icons/symbols.dart'; import 'package:riverpod_annotation/riverpod_annotation.dart'; import 'package:riverpod_paging_utils/riverpod_paging_utils.dart'; @@ -231,7 +229,6 @@ class ExploreScreen extends HookConsumerWidget { child: const Icon(Symbols.edit), ), ), - floatingActionButtonLocation: isWide ? null : TabbedFabLocation(context), body: isWide ? _buildWideBody( @@ -415,7 +412,6 @@ class ExploreScreen extends HookConsumerWidget { ), ), bodyView, - SliverGap(getTabbedPadding(context).bottom), ], ), ).padding(horizontal: 8), diff --git a/lib/screens/realm/realms.dart b/lib/screens/realm/realms.dart index d421e593..96a0372b 100644 --- a/lib/screens/realm/realms.dart +++ b/lib/screens/realm/realms.dart @@ -12,13 +12,11 @@ import 'package:island/models/realm.dart'; import 'package:island/pods/config.dart'; import 'package:island/pods/network.dart'; import 'package:island/services/file.dart'; -import 'package:island/services/responsive.dart'; import 'package:island/widgets/alert.dart'; import 'package:island/widgets/app_scaffold.dart'; import 'package:island/widgets/content/cloud_files.dart'; import 'package:island/widgets/content/sheet.dart'; import 'package:island/widgets/response.dart'; -import 'package:island/screens/tabs.dart'; import 'package:material_symbols_icons/symbols.dart'; import 'package:riverpod_annotation/riverpod_annotation.dart'; import 'package:styled_widget/styled_widget.dart'; @@ -90,7 +88,6 @@ class RealmListScreen extends HookConsumerWidget { }); }, ), - floatingActionButtonLocation: TabbedFabLocation(context), body: ExtendedRefreshIndicator( child: realms.when( data: @@ -100,7 +97,7 @@ class RealmListScreen extends HookConsumerWidget { child: ListView.separated( padding: EdgeInsets.only( top: 8, - bottom: getTabbedPadding(context).bottom + 8, + bottom: MediaQuery.of(context).padding.bottom + 8, ), itemCount: value.length, itemBuilder: (context, item) { diff --git a/lib/screens/tabs.dart b/lib/screens/tabs.dart index dfe05320..f86b6608 100644 --- a/lib/screens/tabs.dart +++ b/lib/screens/tabs.dart @@ -99,57 +99,44 @@ class TabsScreen extends HookConsumerWidget { ); } - return Container( - color: Theme.of(context).colorScheme.surfaceContainer, - child: Stack( - children: [ - Positioned.fill( - child: ClipRRect( - borderRadius: const BorderRadius.only( - topLeft: Radius.circular(16), - topRight: Radius.circular(16), + return Scaffold( + backgroundColor: Colors.transparent, + extendBody: true, + body: ClipRRect( + borderRadius: const BorderRadius.only( + topLeft: Radius.circular(16), + topRight: Radius.circular(16), + ), + child: child ?? const SizedBox.shrink(), + ), + bottomNavigationBar: ConditionalBottomNav( + child: ClipRRect( + child: BackdropFilter( + filter: ImageFilter.blur(sigmaX: 1, sigmaY: 1), + child: Container( + decoration: BoxDecoration( + color: Theme.of(context).colorScheme.surface.withOpacity(0.8), ), - child: child ?? const SizedBox.shrink(), - ), - ), - Positioned( - left: 0, - right: 0, - bottom: 0, - child: ConditionalBottomNav( - child: ClipRRect( - child: BackdropFilter( - filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10), - child: Container( - decoration: BoxDecoration( - color: Theme.of( - context, - ).colorScheme.surface.withOpacity(0.8), - ), - child: MediaQuery.removePadding( - context: context, - removeTop: true, - child: NavigationBar( - backgroundColor: Colors.transparent, - shadowColor: Colors.transparent, - overlayColor: const WidgetStatePropertyAll( - Colors.transparent, - ), - surfaceTintColor: Colors.transparent, - height: 56, - labelBehavior: - NavigationDestinationLabelBehavior.alwaysHide, - selectedIndex: currentIndex, - onDestinationSelected: onDestinationSelected, - destinations: destinations, - ), - ), + child: MediaQuery.removePadding( + context: context, + removeTop: true, + child: NavigationBar( + backgroundColor: Colors.transparent, + shadowColor: Colors.transparent, + overlayColor: const WidgetStatePropertyAll( + Colors.transparent, ), + surfaceTintColor: Colors.transparent, + height: 56, + labelBehavior: NavigationDestinationLabelBehavior.alwaysHide, + selectedIndex: currentIndex, + onDestinationSelected: onDestinationSelected, + destinations: destinations, ), ), ), ), - ], + ), ), ); } @@ -178,7 +165,6 @@ class TabbedFabLocation extends FloatingActionButtonLocation { scaffoldGeometry.floatingActionButtonSize.height - scaffoldGeometry.bottomSheetSize.height - safeAreaPadding.bottom - - (isWideScreen(context) ? 32 : 80) + 16; return Offset(fabX, fabY); diff --git a/lib/services/responsive.dart b/lib/services/responsive.dart index 7f55b30e..12fbb2fe 100644 --- a/lib/services/responsive.dart +++ b/lib/services/responsive.dart @@ -15,32 +15,3 @@ bool isWiderScreen(BuildContext context) { bool isWidestScreen(BuildContext context) { return MediaQuery.of(context).size.width > kWidescreenWidth; } - -EdgeInsets getTabbedPadding( - BuildContext context, { - double? horizontal, - double? vertical, - double? left, - double? right, - double? top, - double? bottom, -}) { - if (isWideScreen(context)) { - return EdgeInsets.only( - left: left ?? horizontal ?? 0, - right: right ?? horizontal ?? 0, - top: top ?? vertical ?? 0, - bottom: bottom ?? vertical ?? 0, - ); - } - final effectiveBottom = bottom ?? vertical; - return EdgeInsets.only( - left: left ?? horizontal ?? 0, - right: right ?? horizontal ?? 0, - top: top ?? vertical ?? 0, - bottom: - effectiveBottom != null - ? effectiveBottom + MediaQuery.of(context).padding.bottom + 56 - : MediaQuery.of(context).padding.bottom + 56, - ); -} diff --git a/lib/widgets/account/restore_purchase_sheet.dart b/lib/widgets/account/restore_purchase_sheet.dart index eb514dfb..e67a7ada 100644 --- a/lib/widgets/account/restore_purchase_sheet.dart +++ b/lib/widgets/account/restore_purchase_sheet.dart @@ -4,7 +4,6 @@ import 'package:gap/gap.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:island/pods/network.dart'; import 'package:island/screens/account/me/settings_connections.dart'; -import 'package:island/services/responsive.dart'; import 'package:island/widgets/alert.dart'; import 'package:island/widgets/content/sheet.dart'; import 'package:easy_localization/easy_localization.dart'; @@ -50,7 +49,6 @@ class RestorePurchaseSheet extends HookConsumerWidget { return SheetScaffold( titleText: 'restorePurchase'.tr(), child: SingleChildScrollView( - padding: getTabbedPadding(context), child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ diff --git a/lib/widgets/app_scaffold.dart b/lib/widgets/app_scaffold.dart index 92c00c38..8cc5e036 100644 --- a/lib/widgets/app_scaffold.dart +++ b/lib/widgets/app_scaffold.dart @@ -10,6 +10,7 @@ import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:island/pods/config.dart'; import 'package:island/pods/userinfo.dart'; import 'package:island/pods/websocket.dart'; +import 'package:island/screens/tabs.dart'; import 'package:island/services/responsive.dart'; import 'package:material_symbols_icons/material_symbols_icons.dart'; import 'package:path_provider/path_provider.dart'; @@ -292,7 +293,7 @@ class AppScaffold extends HookConsumerWidget { endDrawer: endDrawer, floatingActionButton: floatingActionButton, floatingActionButtonAnimator: floatingActionButtonAnimator, - floatingActionButtonLocation: floatingActionButtonLocation, + floatingActionButtonLocation: TabbedFabLocation(context), onDrawerChanged: onDrawerChanged, onEndDrawerChanged: onEndDrawerChanged, ), diff --git a/lib/widgets/post/compose_dialog.dart b/lib/widgets/post/compose_dialog.dart index 8b5a41ab..0f198acb 100644 --- a/lib/widgets/post/compose_dialog.dart +++ b/lib/widgets/post/compose_dialog.dart @@ -5,6 +5,7 @@ import 'package:island/models/file.dart'; import 'package:island/models/post.dart'; import 'package:island/screens/posts/compose.dart'; import 'package:island/services/compose_storage_db.dart'; +import 'package:island/services/responsive.dart'; import 'package:island/widgets/post/compose_card.dart'; /// A dialog that wraps PostComposeCard for easy use in dialogs. @@ -36,6 +37,7 @@ class PostComposeDialog extends HookConsumerWidget { final drafts = ref.watch(composeStorageNotifierProvider); final restoredInitialState = useState(null); final prompted = useState(false); + final isWide = isWideScreen(context); useEffect(() { if (!prompted.value && originalPost == null && drafts.isNotEmpty) { @@ -48,9 +50,12 @@ class PostComposeDialog extends HookConsumerWidget { }, [drafts, prompted.value]); return Dialog( - insetPadding: const EdgeInsets.all(16), + insetPadding: isWide ? const EdgeInsets.all(16) : EdgeInsets.zero, child: ConstrainedBox( - constraints: const BoxConstraints(maxWidth: 600, maxHeight: 700), + constraints: + isWide + ? const BoxConstraints(maxWidth: 600) + : const BoxConstraints.expand(), child: PostComposeCard( originalPost: originalPost, initialState: restoredInitialState.value ?? initialState,