feature: Rework responsive layout (#217)

Co-authored-by: PartyDonut <PartyDonut@users.noreply.github.com>
This commit is contained in:
PartyDonut 2025-02-07 15:55:01 +01:00 committed by GitHub
parent e07f280124
commit 8012fdcea8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
48 changed files with 1468 additions and 1040 deletions

View file

@ -1,8 +1,10 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fladder/models/settings/home_settings_model.dart';
import 'package:fladder/providers/user_provider.dart';
import 'package:fladder/screens/shared/user_icon.dart';
import 'package:fladder/util/adaptive_layout.dart';
@ -10,26 +12,29 @@ import 'package:fladder/util/router_extension.dart';
class SettingsScaffold extends ConsumerWidget {
final String label;
final bool showUserIcon;
final ScrollController? scrollController;
final List<Widget> items;
final List<Widget> bottomActions;
final bool showUserIcon;
final bool showBackButtonNested;
final Widget? floatingActionButton;
const SettingsScaffold({
required this.label,
this.showUserIcon = false,
this.scrollController,
required this.items,
this.bottomActions = const [],
this.floatingActionButton,
this.showUserIcon = false,
this.showBackButtonNested = false,
super.key,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
final padding = MediaQuery.of(context).padding;
final singleLayout = AdaptiveLayout.layoutModeOf(context) == LayoutMode.single;
return Scaffold(
backgroundColor: AdaptiveLayout.of(context).size == ScreenLayout.dual ? Colors.transparent : null,
backgroundColor: AdaptiveLayout.layoutModeOf(context) == LayoutMode.dual ? Colors.transparent : null,
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
floatingActionButton: floatingActionButton,
body: Column(
@ -38,10 +43,11 @@ class SettingsScaffold extends ConsumerWidget {
child: CustomScrollView(
controller: scrollController,
slivers: [
if (AdaptiveLayout.of(context).size == ScreenLayout.single)
if (singleLayout)
SliverAppBar.large(
backgroundColor: Theme.of(context).scaffoldBackgroundColor,
leading: context.router.backButton(),
leading: BackButton(
onPressed: () => backAction(context),
),
flexibleSpace: FlexibleSpaceBar(
titlePadding: const EdgeInsets.symmetric(horizontal: 16)
.add(EdgeInsets.only(left: padding.left, right: padding.right, bottom: 4)),
@ -51,11 +57,12 @@ class SettingsScaffold extends ConsumerWidget {
const Spacer(),
if (showUserIcon)
SizedBox.fromSize(
size: const Size.fromRadius(14),
child: UserIcon(
user: ref.watch(userProvider),
cornerRadius: 200,
))
size: const Size.fromRadius(14),
child: UserIcon(
user: ref.watch(userProvider),
cornerRadius: 200,
),
)
],
),
expandedTitleScale: 1.2,
@ -68,9 +75,15 @@ class SettingsScaffold extends ConsumerWidget {
else
SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 32),
child: Text(AdaptiveLayout.of(context).size == ScreenLayout.single ? label : "",
style: Theme.of(context).textTheme.headlineLarge),
padding: MediaQuery.paddingOf(context),
child: Row(
children: [
if (showBackButtonNested)
BackButton(
onPressed: () => backAction(context),
)
],
),
),
),
SliverPadding(
@ -99,4 +112,16 @@ class SettingsScaffold extends ConsumerWidget {
),
);
}
void backAction(BuildContext context) {
if (kIsWeb) {
if (AdaptiveLayout.layoutModeOf(context) == LayoutMode.single && context.tabsRouter.activeIndex != 0) {
context.tabsRouter.setActiveIndex(0);
} else {
context.router.popForced();
}
} else {
context.router.popBack();
}
}
}