mirror of
https://github.com/dstark5/Openlib.git
synced 2025-09-19 13:33:35 +08:00
added material dynamic color
This commit is contained in:
143
lib/main.dart
143
lib/main.dart
@ -1,4 +1,6 @@
|
|||||||
|
import 'package:dynamic_color/dynamic_color.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter/services.dart';
|
||||||
import 'dart:io' show Platform;
|
import 'dart:io' show Platform;
|
||||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||||
import 'package:google_nav_bar/google_nav_bar.dart';
|
import 'package:google_nav_bar/google_nav_bar.dart';
|
||||||
@ -34,45 +36,30 @@ class MyApp extends StatelessWidget {
|
|||||||
const MyApp({super.key});
|
const MyApp({super.key});
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return MaterialApp(
|
return DynamicColorBuilder(
|
||||||
builder: (BuildContext context, Widget? child) {
|
builder: (ColorScheme? lightDynamic, ColorScheme? darkDynamic) {
|
||||||
return MediaQuery(
|
return MaterialApp(
|
||||||
data: MediaQuery.of(context).copyWith(
|
builder: (BuildContext context, Widget? child) {
|
||||||
textScaleFactor: 1.0,
|
return MediaQuery(
|
||||||
),
|
data: MediaQuery.of(context).copyWith(
|
||||||
child: child!,
|
textScaleFactor: 1.0,
|
||||||
);
|
|
||||||
},
|
|
||||||
debugShowCheckedModeBanner: false,
|
|
||||||
title: 'Openlib',
|
|
||||||
theme: ThemeData(
|
|
||||||
primaryColor: Colors.white,
|
|
||||||
colorScheme: ColorScheme.light(
|
|
||||||
primary: Colors.white,
|
|
||||||
secondary: '#FB0101'.toColor(),
|
|
||||||
tertiary: Colors.black,
|
|
||||||
tertiaryContainer: '#F2F2F2'.toColor(),
|
|
||||||
),
|
|
||||||
textTheme: const TextTheme(
|
|
||||||
displayLarge: TextStyle(
|
|
||||||
color: Colors.black,
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
fontSize: 21,
|
|
||||||
),
|
),
|
||||||
displayMedium: TextStyle(
|
child: child!,
|
||||||
fontSize: 13,
|
);
|
||||||
fontWeight: FontWeight.bold,
|
},
|
||||||
color: Colors.black,
|
debugShowCheckedModeBanner: false,
|
||||||
overflow: TextOverflow.ellipsis,
|
title: 'Openlib',
|
||||||
),
|
theme: ThemeData(
|
||||||
),
|
|
||||||
fontFamily: GoogleFonts.nunito().fontFamily,
|
|
||||||
useMaterial3: true,
|
useMaterial3: true,
|
||||||
textSelectionTheme: TextSelectionThemeData(
|
colorScheme: lightDynamic,
|
||||||
selectionColor: '#FB0101'.toColor(),
|
),
|
||||||
selectionHandleColor: '#FB0101'.toColor())),
|
darkTheme: ThemeData(
|
||||||
home: const HomePage(),
|
useMaterial3: true,
|
||||||
);
|
colorScheme: darkDynamic,
|
||||||
|
),
|
||||||
|
home: const HomePage(),
|
||||||
|
);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -94,67 +81,37 @@ class _HomePageState extends ConsumerState<HomePage> {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final selectedIndex = ref.watch(selectedIndexProvider);
|
final selectedIndex = ref.watch(selectedIndexProvider);
|
||||||
|
|
||||||
return Scaffold(
|
return AnnotatedRegion<SystemUiOverlayStyle>(
|
||||||
appBar: AppBar(
|
value: SystemUiOverlayStyle(
|
||||||
backgroundColor: Theme.of(context).colorScheme.primary,
|
systemNavigationBarColor: ElevationOverlay.applySurfaceTint(
|
||||||
title: const Text("Openlib"),
|
Theme.of(context).colorScheme.surface,
|
||||||
titleTextStyle: Theme.of(context).textTheme.displayLarge,
|
Theme.of(context).colorScheme.surfaceTint,
|
||||||
),
|
3)),
|
||||||
body: _widgetOptions.elementAt(selectedIndex),
|
child: Scaffold(
|
||||||
bottomNavigationBar: SafeArea(
|
backgroundColor: Theme.of(context).colorScheme.background,
|
||||||
child: GNav(
|
appBar: AppBar(
|
||||||
rippleColor: Colors.redAccent,
|
leading:
|
||||||
backgroundColor: Colors.black,
|
Icon(Icons.book, color: Theme.of(context).colorScheme.primary),
|
||||||
haptic: true,
|
title: const Text(
|
||||||
tabBorderRadius: 50,
|
"Openlib",
|
||||||
tabActiveBorder: Border.all(
|
style: TextStyle(fontWeight: FontWeight.w600),
|
||||||
color: Theme.of(context).colorScheme.secondary,
|
|
||||||
),
|
),
|
||||||
tabMargin: const EdgeInsets.fromLTRB(13, 6, 13, 2.5),
|
titleSpacing: 1,
|
||||||
curve: Curves.easeInOut, // tab animation curves
|
),
|
||||||
duration: const Duration(milliseconds: 150),
|
body: _widgetOptions.elementAt(selectedIndex),
|
||||||
gap: 5,
|
bottomNavigationBar: NavigationBar(
|
||||||
color: const Color.fromARGB(255, 255, 255, 255),
|
destinations: const [
|
||||||
activeColor: const Color.fromARGB(255, 255, 255, 255),
|
NavigationDestination(
|
||||||
iconSize: 21, // tab button icon size
|
icon: Icon(Icons.trending_up), label: "Trending"),
|
||||||
tabBackgroundColor: Theme.of(context).colorScheme.secondary,
|
NavigationDestination(icon: Icon(Icons.search), label: "Search"),
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 6.5),
|
NavigationDestination(
|
||||||
tabs: const [
|
icon: Icon(Icons.collections_bookmark), label: "My Library"),
|
||||||
GButton(
|
|
||||||
icon: Icons.trending_up,
|
|
||||||
text: 'Trending',
|
|
||||||
iconColor: Colors.white,
|
|
||||||
textStyle: TextStyle(
|
|
||||||
fontWeight: FontWeight.w900,
|
|
||||||
color: Colors.white,
|
|
||||||
fontSize: 13,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
GButton(
|
|
||||||
icon: Icons.search,
|
|
||||||
text: 'Search',
|
|
||||||
iconColor: Colors.white,
|
|
||||||
textStyle: TextStyle(
|
|
||||||
fontWeight: FontWeight.w900,
|
|
||||||
color: Colors.white,
|
|
||||||
fontSize: 13,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
GButton(
|
|
||||||
icon: Icons.collections_bookmark,
|
|
||||||
text: 'My Library',
|
|
||||||
iconColor: Colors.white,
|
|
||||||
textStyle: TextStyle(
|
|
||||||
fontWeight: FontWeight.w900,
|
|
||||||
color: Colors.white,
|
|
||||||
fontSize: 13,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
selectedIndex: selectedIndex,
|
selectedIndex: selectedIndex,
|
||||||
onTabChange: (index) async {
|
onDestinationSelected: (index) async {
|
||||||
ref.read(selectedIndexProvider.notifier).state = index;
|
ref.read(selectedIndexProvider.notifier).state = index;
|
||||||
},
|
},
|
||||||
|
labelBehavior: NavigationDestinationLabelBehavior.onlyShowSelected,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
@ -56,6 +56,7 @@ dependencies:
|
|||||||
# Use with the CupertinoIcons class for iOS style icons.
|
# Use with the CupertinoIcons class for iOS style icons.
|
||||||
cupertino_icons: ^1.0.2
|
cupertino_icons: ^1.0.2
|
||||||
dev: ^1.0.0
|
dev: ^1.0.0
|
||||||
|
dynamic_color: ^1.6.6
|
||||||
|
|
||||||
dev_dependencies:
|
dev_dependencies:
|
||||||
flutter_test:
|
flutter_test:
|
||||||
|
Reference in New Issue
Block a user