Solar/App
2
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

💫 Optimize nav transition

Browse Source
This commit is contained in:
LittleSheep
2024-11-15 23:08:29 +08:00
parent 37c61a0406
commit ee2cb0c989
5 changed files with 150 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
lib/widgets/navigation/app_background.dart
View File

@ -6,12 +6,72 @@ import 'package:path_provider/path_provider.dart';
class AppBackground extends StatelessWidget {
final Widget child;
const AppBackground({super.key, required this.child});
final bool isLessOptimization;
const AppBackground({
super.key,
required this.child,
this.isLessOptimization = false,
});
Widget _buildWithBackgroundImage(
BuildContext context,
File imageFile,
Widget child,
) {
final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
if (isLessOptimization) {
final size = MediaQuery.of(context).size;
return Container(
color: Theme.of(context).colorScheme.surface,
child: Container(
decoration: BoxDecoration(
backgroundBlendMode: BlendMode.darken,
color: Theme.of(context).colorScheme.surface,
image: DecorationImage(
opacity: 0.2,
image: ResizeImage(
FileImage(imageFile),
width: (size.width * devicePixelRatio).round(),
height: (size.height * devicePixelRatio).round(),
policy: ResizeImagePolicy.fit,
),
fit: BoxFit.cover,
),
),
child: child,
),
);
}
return Container(
color: Theme.of(context).colorScheme.surface,
child: LayoutBuilder(
builder: (context, constraints) {
return Container(
decoration: BoxDecoration(
backgroundBlendMode: BlendMode.darken,
color: Theme.of(context).colorScheme.surface,
image: DecorationImage(
opacity: 0.2,
image: ResizeImage(
FileImage(imageFile),
width: (constraints.maxWidth * devicePixelRatio).round(),
height: (constraints.maxHeight * devicePixelRatio).round(),
policy: ResizeImagePolicy.fit,
),
fit: BoxFit.cover,
),
),
child: child,
);
},
),
);
}
@override
Widget build(BuildContext context) {
final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
return ScaffoldMessenger(
child: FutureBuilder(
future:
@ -21,32 +81,7 @@ class AppBackground extends StatelessWidget {
final path = '${snapshot.data!.path}/app_background_image';
final file = File(path);
if (file.existsSync()) {
return Container(
color: Theme.of(context).colorScheme.surface,
child: LayoutBuilder(
builder: (context, constraints) {
return Container(
decoration: BoxDecoration(
backgroundBlendMode: BlendMode.darken,
color: Theme.of(context).colorScheme.surface,
image: DecorationImage(
opacity: 0.2,
image: ResizeImage(
FileImage(file),
width: (constraints.maxWidth * devicePixelRatio)
.round(),
height: (constraints.maxHeight * devicePixelRatio)
.round(),
policy: ResizeImagePolicy.fit,
),
fit: BoxFit.cover,
),
),
child: child,
);
},
),
);
return _buildWithBackgroundImage(context, file, child);
}
}

32
lib/widgets/navigation/app_scaffold.dart
View File

@ -2,6 +2,7 @@ import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:responsive_framework/responsive_framework.dart';
import 'package:surface/providers/navigation.dart';
import 'package:surface/widgets/connection_indicator.dart';
import 'package:surface/widgets/dialog.dart';
import 'package:surface/widgets/navigation/app_background.dart';
@ -9,12 +10,12 @@ import 'package:surface/widgets/navigation/app_bottom_navigation.dart';
import 'package:surface/widgets/navigation/app_drawer_navigation.dart';
import 'package:surface/widgets/navigation/app_rail_navigation.dart';
class AppScaffold extends StatelessWidget {
class AppPageScaffold extends StatelessWidget {
final String? title;
final Widget? body;
final bool showAppBar;
final bool showBottomNavigation;
const AppScaffold({
const AppPageScaffold({
super.key,
this.title,
this.body,
@ -24,14 +25,12 @@ class AppScaffold extends StatelessWidget {
@override
Widget build(BuildContext context) {
final isShowBottomNavigation = (showBottomNavigation)
? ResponsiveBreakpoints.of(context).smallerOrEqualTo(MOBILE)
: false;
final state = GoRouter.maybeOf(context);
final autoTitle = state != null
? 'screen${state.routerDelegate.currentConfiguration.last.route.name?.capitalize()}'
: 'screen';
final routeName =
state?.routerDelegate.currentConfiguration.last.route.name;
final autoTitle =
state != null ? 'screen${routeName?.capitalize()}' : 'screen';
return Scaffold(
appBar: showAppBar
@ -40,8 +39,6 @@ class AppScaffold extends StatelessWidget {
)
: null,
body: body,
bottomNavigationBar:
isShowBottomNavigation ? AppBottomNavigationBar() : null,
);
}
}
@ -58,6 +55,17 @@ class AppRootScaffold extends StatelessWidget {
ResponsiveBreakpoints.of(context).smallerOrEqualTo(MOBILE);
final isExpandDrawer = ResponsiveBreakpoints.of(context).largerThan(TABLET);
final routeName = GoRouter.of(context)
.routerDelegate
.currentConfiguration
.last
.route
.name;
final isShowBottomNavigation =
NavigationProvider.kShowBottomNavScreen.contains(routeName)
? ResponsiveBreakpoints.of(context).smallerOrEqualTo(MOBILE)
: false;
final innerWidget = isCollapseDrawer
? body
: Row(
@ -88,6 +96,8 @@ class AppRootScaffold extends StatelessWidget {
],
),
drawer: !isExpandDrawer ? AppNavigationDrawer() : null,
bottomNavigationBar:
isShowBottomNavigation ? AppBottomNavigationBar() : null,
),
);
}