Improve theming (#366)

* Improve theming

* Move headerbar to splashscreen

Author: Feichtmeier

lib/main.dart

@@ -79,7 +79,11 @@ Future<void> main(List<String> args) async {
 
   registerService<RadioService>(() => RadioService());
 
-  runApp(
-    const MusicPod(),
-  );
+  if (Platform.isLinux) {
+    runApp(const GtkApplication(child: YaruMusicPodApp()));
+  } else {
+    runApp(
+      const MusicPodApp(),
+    );
+  }
 }

lib/src/app/musicpod.dart

@@ -1,45 +1,43 @@
 import 'dart:ui';
 
 import 'package:flutter/material.dart';
-import 'package:gtk/gtk.dart';
 import 'package:ubuntu_service/ubuntu_service.dart';
 import 'package:yaru/yaru.dart';
 
 import '../../app.dart';
-import '../../common.dart';
 import '../../library.dart';
 import '../../theme.dart';
 import '../l10n/l10n.dart';
 import 'app.dart';
 
-class MusicPod extends StatelessWidget {
-  const MusicPod({super.key});
+class YaruMusicPodApp extends StatelessWidget {
+  const YaruMusicPodApp({
+    super.key,
+  });
 
   @override
   Widget build(BuildContext context) {
-    if (yaruStyled) {
-      return YaruTheme(
-        builder: (context, yaruThemeData, child) {
-          return GtkApplication(
-            child: MusicPodApp(
-              lightTheme: yaruThemeData.theme,
-              darkTheme: yaruThemeData.darkTheme?.copyWith(
-                scaffoldBackgroundColor: const Color(0xFF1e1e1e),
-              ),
+    return YaruTheme(
+      builder: (context, yaru, child) {
+        return MusicPodApp(
+          lightTheme: yaru.theme,
+          darkTheme: yaru.darkTheme?.copyWith(
+            scaffoldBackgroundColor: const Color(0xFF1e1e1e),
+            dividerColor: darkDividerColor,
+            dividerTheme: const DividerThemeData(
+              color: darkDividerColor,
+              space: 1.0,
+              thickness: 0.0,
             ),
-          );
-        },
-      );
-    } else {
-      return MusicPodApp(
-        lightTheme: m3Theme(),
-        darkTheme: m3Theme(brightness: Brightness.dark),
-      );
-    }
+          ),
+        );
+      },
+      child: const MusicPodApp(),
+    );
   }
 }
 
-class MusicPodApp extends StatelessWidget {
+class MusicPodApp extends StatefulWidget {
   const MusicPodApp({
     super.key,
     this.lightTheme,
@@ -48,32 +46,35 @@ class MusicPodApp extends StatelessWidget {
 
   final ThemeData? lightTheme, darkTheme;
 
+  @override
+  State<MusicPodApp> createState() => _MusicPodAppState();
+}
+
+class _MusicPodAppState extends State<MusicPodApp> {
+  bool initialized = false;
+
+  @override
+  void initState() {
+    super.initState();
+    getService<LibraryService>().init().then(
+      (value) {
+        if (!initialized) {
+          setState(() => initialized = value);
+        }
+      },
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
-    const dividerColor = Color.fromARGB(19, 255, 255, 255);
     return MaterialApp(
       debugShowCheckedModeBanner: false,
-      theme: lightTheme,
-      darkTheme: darkTheme?.copyWith(
-        dividerColor: dividerColor,
-        dividerTheme: const DividerThemeData(
-          color: dividerColor,
-          space: 1.0,
-          thickness: 0.0,
-        ),
-      ),
+      theme: widget.lightTheme ?? m3Theme(),
+      darkTheme: widget.darkTheme ?? m3Theme(brightness: Brightness.dark),
       localizationsDelegates: AppLocalizations.localizationsDelegates,
       supportedLocales: supportedLocales,
       onGenerateTitle: (context) => 'MusicPod',
-      home: FutureBuilder(
-        future: getService<LibraryService>().init(),
-        builder: (context, snapshot) {
-          if (snapshot.connectionState == ConnectionState.done) {
-            return App.create();
-          }
-          return const Scaffold(appBar: HeaderBar(), body: SplashScreen());
-        },
-      ),
+      home: initialized ? App.create() : const SplashScreen(),
       scrollBehavior: const MaterialScrollBehavior().copyWith(
         dragDevices: {
           PointerDeviceKind.mouse,

lib/src/app/splash_screen.dart

@@ -1,16 +1,14 @@
 import 'package:flutter/material.dart';
 
 import '../../build_context_x.dart';
+import '../common/common_widgets.dart';
 import '../common/icons.dart';
 
 class SplashScreen extends StatefulWidget {
   const SplashScreen({
     super.key,
-    this.color,
   });
 
-  final Color? color;
-
   @override
   State<SplashScreen> createState() => _SplashScreenState();
 }
@@ -42,9 +40,10 @@ class _SplashScreenState extends State<SplashScreen>
   @override
   Widget build(BuildContext context) {
     final theme = context.t;
-    return Material(
-      color: widget.color ?? theme.scaffoldBackgroundColor,
-      child: Center(
+    return Scaffold(
+      appBar: const HeaderBar(),
+      backgroundColor: theme.scaffoldBackgroundColor,
+      body: Center(
         child: AnimatedOpacity(
           duration: const Duration(milliseconds: 100),
           curve: Curves.bounceIn,

lib/src/library/library_service.dart

@@ -389,12 +389,13 @@ class LibraryService {
     _neverShowFailedImportsController.add(true);
   }
 
-  Future<void> init() async {
+  bool _libraryInitialized = false;
+  Future<bool> init() async {
     await _initSettings();
     await _initLibrary();
+    return _libraryInitialized;
   }
 
-  bool _libraryInitialized = false;
   Future<void> _initLibrary() async {
     if (_libraryInitialized) return;
     if (_useLocalAudioCache == true) {

lib/src/theme.dart

@@ -4,13 +4,15 @@ import 'package:flutter/material.dart';
 
 import 'color_scheme_x.dart';
 
+const darkDividerColor = Color.fromARGB(19, 255, 255, 255);
+
 ThemeData m3Theme({
   Brightness brightness = Brightness.light,
   Color color = Colors.greenAccent,
 }) {
   final dividerColor = brightness == Brightness.light
       ? const Color.fromARGB(48, 0, 0, 0)
-      : const Color.fromARGB(18, 255, 255, 255);
+      : darkDividerColor;
   final colorScheme = ColorScheme.fromSeed(
     surfaceTint: Colors.transparent,
     seedColor: color,