RomanNum3ral
/
quickgui
mirror of https://github.com/quickemu-project/quickgui.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Make proper use of Material3 colour schemes. 

This is a big improvement over what we had before and relies on the
theme to provide dark mode rather than manually checking brightness each
time we pick a colour.

The buttons in the primary container aren't quite right, I'm not sure
why.
This commit is contained in:
Mark Johnson 2024-06-13 22:57:53 +01:00 committed by Martin Wimpress
parent 920b8488c7
commit d3fe2c8c4f
9 changed files with 72 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
lib/src/app.dart
View File

@ -22,6 +22,26 @@ class App extends StatefulWidget {
}
class _AppState extends State<App> with PreferencesMixin {
// Define the primary dark grey color.
static const int _darkGreyPrimaryValue = 0xFF424242;
// Create a map of shades for the dark grey color.
static const MaterialColor darkGrey = MaterialColor(
_darkGreyPrimaryValue,
<int, Color>{
50: Color(0xFFE0E0E0),
100: Color(0xFFBDBDBD),
200: Color(0xFF9E9E9E),
300: Color(0xFF757575),
400: Color(0xFF616161),
500: Color(_darkGreyPrimaryValue),
600: Color(0xFF3D3D3D),
700: Color(0xFF333333),
800: Color(0xFF2B2B2B),
900: Color(0xFF1C1C1C),
},
);
@override
Widget build(BuildContext context) {
return FutureBuilder<SharedPreferences>(
@ -39,8 +59,21 @@ class _AppState extends State<App> with PreferencesMixin {
}
return Consumer<AppSettings>(
builder: (context, appSettings, _) => MaterialApp(
theme: ThemeData(primarySwatch: Colors.pink),
darkTheme: ThemeData.dark(),
theme: ThemeData(
useMaterial3: true,
colorScheme: ColorScheme.fromSwatch(
primarySwatch: Colors.pink,
backgroundColor: Colors.white,
)
),
darkTheme: ThemeData(
useMaterial3: true,
colorScheme: ColorScheme.fromSwatch(
primarySwatch: darkGrey,
backgroundColor: darkGrey.shade700,
brightness: Brightness.dark,
),
),
themeMode: appSettings.themeMode,
home: AppVersion.packageInfo == null
? const DebgetNotFoundPage()

2
lib/src/pages/main_page.dart
View File

@ -26,6 +26,8 @@ class _MainPageState extends State<MainPage> {
return Scaffold(
appBar: AppBar(
title: Text(context.t('Main menu')),
backgroundColor: Theme.of(context).colorScheme.primary,
foregroundColor: Theme.of(context).colorScheme.onPrimary,
),
drawer: const LeftMenu(),
body: const Column(

32
lib/src/pages/manager.dart
View File

@ -174,9 +174,7 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
Widget _buildVmList() {
List<Widget> widgetList = [];
final Color buttonColor = Theme.of(context).brightness == Brightness.dark
? Colors.white70
: Theme.of(context).colorScheme.primary;
final Color buttonColor = Theme.of(context).colorScheme.primary;
widgetList.addAll(
[
Padding(
@ -186,30 +184,30 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
children: [
Text(
"${context.t('Directory where the machines are stored')}:",
style: TextStyle(
color: Theme.of(context).colorScheme.onSurface,
),
),
const SizedBox(
width: 8,
),
Text.rich(
TextSpan(
recognizer: TapGestureRecognizer()
..onTap = () async {
String? result =
await FilePicker.platform.getDirectoryPath();
if (result != null) {
ElevatedButton(
style: ElevatedButton.styleFrom(
foregroundColor: Theme.of(context).colorScheme.onSurface,
backgroundColor: Theme.of(context).colorScheme.surface,
),
onPressed: () async {
var folder = await FilePicker.platform
.getDirectoryPath(dialogTitle: "Pick a folder");
if (folder != null) {
setState(() {
Directory.current = result;
Directory.current = folder;
});
savePreference(
prefWorkingDirectory, Directory.current.path);
_getVms(context);
}
},
text: Directory.current.path,
style:
TextStyle(color: Theme.of(context).colorScheme.primary),
),
child: Text(Directory.current.path),
),
],
),

4
lib/src/widgets/downloader/cancel_dismiss_button.dart
View File

@ -21,9 +21,7 @@ class CancelDismissButton extends StatelessWidget {
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context).colorScheme.surface,
foregroundColor: Theme.of(context).brightness == Brightness.dark
? Colors.white70
: Theme.of(context).colorScheme.primary,
foregroundColor: Theme.of(context).colorScheme.onSurface,
),
onPressed: !downloadFinished
? onCancel

14
lib/src/widgets/home_page/downloader_menu.dart
View File

@ -31,9 +31,7 @@ class _DownloaderMenuState extends State<DownloaderMenu> with PreferencesMixin {
Widget build(BuildContext context) {
return Expanded(
child: Container(
color: Theme.of(context).brightness == Brightness.dark
? Theme.of(context).colorScheme.surface
: Theme.of(context).colorScheme.primary,
color: Theme.of(context).colorScheme.primaryContainer,
child: Column(
children: [
Padding(
@ -44,9 +42,7 @@ class _DownloaderMenuState extends State<DownloaderMenu> with PreferencesMixin {
Text(
"${context.t('Directory where the machines are stored')}:",
style: TextStyle(
color: Theme.of(context).brightness == Brightness.dark
? Theme.of(context).colorScheme.onSurface
: Theme.of(context).colorScheme.onPrimary,
color: Theme.of(context).colorScheme.onPrimaryContainer,
),
),
const SizedBox(
@ -54,10 +50,8 @@ class _DownloaderMenuState extends State<DownloaderMenu> with PreferencesMixin {
),
ElevatedButton(
style: ElevatedButton.styleFrom(
foregroundColor: Theme.of(context).brightness == Brightness.dark
? Colors.white70
: Theme.of(context).colorScheme.primary,
backgroundColor: Theme.of(context).canvasColor,
foregroundColor: Theme.of(context).colorScheme.onSurface,
backgroundColor: Theme.of(context).colorScheme.surface,
),
onPressed: () async {
var folder = await FilePicker.platform

6
lib/src/widgets/home_page/downloader_page_button.dart
View File

@ -35,10 +35,8 @@ class DownloaderPageButton extends StatelessWidget {
),
ElevatedButton(
style: ElevatedButton.styleFrom(
foregroundColor: Theme.of(context).brightness == Brightness.dark
? Colors.white70
: Theme.of(context).colorScheme.primary,
backgroundColor: Theme.of(context).canvasColor,
foregroundColor: Theme.of(context).colorScheme.onSurface,
backgroundColor: Theme.of(context).colorScheme.surface,
),
onPressed: onPressed,
child: Padding(

6
lib/src/widgets/home_page/home_page_button.dart
View File

@ -32,10 +32,8 @@ class HomePageButton extends StatelessWidget {
),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context).canvasColor,
foregroundColor: Theme.of(context).brightness == Brightness.dark
? Colors.white70
: Theme.of(context).colorScheme.primary,
backgroundColor: Theme.of(context).colorScheme.surface,
foregroundColor: Theme.of(context).colorScheme.onSurface,
),
onPressed: onPressed,
child: Padding(

4
lib/src/widgets/home_page/main_menu.dart
View File

@ -12,9 +12,7 @@ class MainMenu extends StatelessWidget {
Widget build(BuildContext context) {
return Expanded(
child: Container(
color: Theme.of(context).brightness == Brightness.dark
? Theme.of(context).colorScheme.surface
: Theme.of(context).colorScheme.primary,
color: Theme.of(context).colorScheme.primaryContainer,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(

6
lib/src/widgets/left_menu.dart
View File

@ -58,11 +58,15 @@ class _LeftMenuState extends State<LeftMenu> with PreferencesMixin {
child: Container(),
),
Switch(
value: Theme.of(context).brightness == Brightness.dark,
value: Theme.of(context).colorScheme.brightness == Brightness.dark,
onChanged: (value) {
appSettings.useDarkMode = value;
savePreference(prefThemeMode, value);
},
activeColor: Colors.white,
activeTrackColor: Colors.black26,
inactiveThumbColor: Theme.of(context).colorScheme.onPrimary,
inactiveTrackColor: Theme.of(context).colorScheme.primary,
),
],
),