design: Style bottom navigation bar in backgroundcolor

This commit is contained in:
krille-chan 2023-07-23 06:45:13 +02:00
parent b798b6dd39
commit ee12843d65
No known key found for this signature in database
2 changed files with 72 additions and 60 deletions

View file

@ -60,71 +60,78 @@ abstract class FluffyThemes {
static const Duration animationDuration = Duration(milliseconds: 250);
static const Curve animationCurve = Curves.easeInOut;
static ThemeData buildTheme(Brightness brightness, [Color? seed]) =>
ThemeData(
visualDensity: VisualDensity.standard,
useMaterial3: true,
brightness: brightness,
colorSchemeSeed: seed ?? AppConfig.colorSchemeSeed,
textTheme: PlatformInfos.isDesktop || PlatformInfos.isWeb
? brightness == Brightness.light
? Typography.material2018().black.merge(fallbackTextTheme)
: Typography.material2018().white.merge(fallbackTextTheme)
: null,
snackBarTheme: const SnackBarThemeData(
behavior: SnackBarBehavior.floating,
static ThemeData buildTheme(Brightness brightness, [Color? seed]) {
final colorScheme = ColorScheme.fromSeed(
brightness: brightness,
seedColor: seed ?? AppConfig.colorSchemeSeed ?? AppConfig.primaryColor,
);
return ThemeData(
visualDensity: VisualDensity.standard,
useMaterial3: true,
brightness: brightness,
colorScheme: colorScheme,
textTheme: PlatformInfos.isDesktop || PlatformInfos.isWeb
? brightness == Brightness.light
? Typography.material2018().black.merge(fallbackTextTheme)
: Typography.material2018().white.merge(fallbackTextTheme)
: null,
snackBarTheme: const SnackBarThemeData(
behavior: SnackBarBehavior.floating,
),
dividerColor: brightness == Brightness.light
? Colors.blueGrey.shade50
: Colors.blueGrey.shade900,
popupMenuTheme: PopupMenuThemeData(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
),
dividerColor: brightness == Brightness.light
? Colors.blueGrey.shade50
: Colors.blueGrey.shade900,
popupMenuTheme: PopupMenuThemeData(
),
inputDecorationTheme: InputDecorationTheme(
border: UnderlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
filled: true,
),
appBarTheme: AppBarTheme(
systemOverlayStyle: SystemUiOverlayStyle(
statusBarColor: Colors.transparent,
statusBarIconBrightness: brightness.reversed,
statusBarBrightness: brightness,
systemNavigationBarIconBrightness: brightness.reversed,
systemNavigationBarColor: colorScheme.background,
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
),
),
dialogTheme: DialogTheme(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.all(16),
textStyle: const TextStyle(fontSize: 16),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
),
),
inputDecorationTheme: InputDecorationTheme(
border: UnderlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
filled: true,
),
appBarTheme: AppBarTheme(
systemOverlayStyle: SystemUiOverlayStyle(
statusBarColor: Colors.transparent,
statusBarIconBrightness: brightness.reversed,
statusBarBrightness: brightness,
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
),
),
dialogTheme: DialogTheme(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.all(16),
textStyle: const TextStyle(fontSize: 16),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
),
),
),
);
),
);
}
}
extension on Brightness {

View file

@ -176,7 +176,12 @@ class ChatListView extends StatelessWidget {
body: ChatListViewBody(controller),
bottomNavigationBar: controller.displayNavigationBar
? NavigationBar(
elevation: 4,
height: 64,
shadowColor:
Theme.of(context).colorScheme.onBackground,
surfaceTintColor:
Theme.of(context).colorScheme.background,
selectedIndex: controller.selectedIndex,
onDestinationSelected:
controller.onDestinationSelected,