Fix inconsistent theme colors (#30)

* Increment version number * Fix theme not syncing together when changed * Fix buttons not changing theme * Fix font missing Co-authored-by: sabihoshi <[email protected]>
sabihoshi · Sep 21, 2022 · 90fac19 · 90fac19
1 parent 72b2115
commit 90fac19
Show file tree

Hide file tree

Showing 7 changed files with 46 additions and 32 deletions.
diff --git a/GenshinLyreMidiPlayer.WPF/App.xaml b/GenshinLyreMidiPlayer.WPF/App.xaml
@@ -44,8 +44,8 @@
                     </Style>
                 </Style.Resources>
             </Style>
-
-            <Style TargetType="modern:NumberBox">
+            
+	        <Style TargetType="modern:NumberBox">
                 <Setter Property="Minimum" Value="0" />
                 <Setter Property="SpinButtonPlacementMode" Value="Compact" />
             </Style>

diff --git a/GenshinLyreMidiPlayer.WPF/GenshinLyreMidiPlayer.WPF.csproj b/GenshinLyreMidiPlayer.WPF/GenshinLyreMidiPlayer.WPF.csproj
@@ -6,7 +6,7 @@
         <UseWPF>true</UseWPF>
         <StartupObject>GenshinLyreMidiPlayer.WPF.App</StartupObject>
         <ApplicationManifest>app.manifest</ApplicationManifest>
-        <Version>4.0.2</Version>
+        <Version>4.0.4</Version>
         <ApplicationIcon>item_windsong_lyre.ico</ApplicationIcon>
         <Nullable>enable</Nullable>
         <RepositoryUrl>https://github.com/sabihoshi/GenshinLyreMidiPlayer</RepositoryUrl>

diff --git a/GenshinLyreMidiPlayer.WPF/ViewModels/MainWindowViewModel.cs b/GenshinLyreMidiPlayer.WPF/ViewModels/MainWindowViewModel.cs
@@ -60,10 +60,14 @@ public void Navigate(INavigation sender, RoutedNavigationEventArgs args)
 
     public void ToggleTheme()
     {
-        ThemeManager.Current.ApplicationTheme
-            = _theme.GetTheme() is ThemeType.Dark
-                ? ApplicationTheme.Light
-                : ApplicationTheme.Dark;
+        ThemeManager.Current.ApplicationTheme = _theme.GetTheme() switch
+        {
+            ThemeType.Unknown => ApplicationTheme.Dark,
+            ThemeType.Dark => ApplicationTheme.Light,
+            ThemeType.Light => ApplicationTheme.Dark,
+            ThemeType.HighContrast => ApplicationTheme.Dark,
+            _ => ApplicationTheme.Dark
+        };
 
         SettingsView.OnThemeChanged();
     }
@@ -87,7 +91,7 @@ public void SearchSong(AutoSuggestBox sender, TextChangedEventArgs e)
     protected override async void OnViewLoaded()
     {
         Navigation = ((MainWindowView) View).RootNavigation;
-        _theme.SetTheme(_theme.GetSystemTheme());
+        SettingsView.OnThemeChanged();
 
         if (!await SettingsView.TryGetLocationAsync()) _ = SettingsView.LocationMissing();
         if (SettingsView.AutoCheckUpdates)

diff --git a/GenshinLyreMidiPlayer.WPF/ViewModels/SettingsPageViewModel.cs b/GenshinLyreMidiPlayer.WPF/ViewModels/SettingsPageViewModel.cs
@@ -319,11 +319,20 @@ await Task.Delay(start, PlayTimerToken.Token)
     [UsedImplicitly]
     public void OnThemeChanged()
     {
+        ThemeManager.Current.ApplicationTheme ??= _theme.GetSystemTheme() switch
+        {
+            ThemeType.Unknown      => ApplicationTheme.Light,
+            ThemeType.Dark         => ApplicationTheme.Dark,
+            ThemeType.Light        => ApplicationTheme.Light,
+            ThemeType.HighContrast => ApplicationTheme.Dark,
+            _                      => ApplicationTheme.Light
+        };
+
         _theme.SetTheme(ThemeManager.Current.ApplicationTheme switch
         {
             ApplicationTheme.Light => ThemeType.Light,
             ApplicationTheme.Dark  => ThemeType.Dark,
-            _                      => _theme.GetSystemTheme()
+            _                      => ThemeType.Light
         });
 
         Settings.Modify(s => s.AppTheme = (int?) ThemeManager.Current.ApplicationTheme ?? -1);

diff --git a/GenshinLyreMidiPlayer.WPF/Views/LyrePlayerView.xaml b/GenshinLyreMidiPlayer.WPF/Views/LyrePlayerView.xaml
@@ -25,7 +25,7 @@
 
 		<modern:SimpleStackPanel Orientation="Horizontal" Grid.Row="0">
 			<Button Command="{s:Action OpenFile}" Background="Transparent">
-                <modern:FontIcon Glyph="&#xE8E5;"  />
+                <ui:FontIcon Glyph="&#xE8E5;" FontFamily="Segoe MDL2 Assets" />
 			</Button>
 			<TextBlock VerticalAlignment="Center" Text="{Binding Playlist.OpenedFile.Title, Mode=OneWay, FallbackValue=Open...}" />
 		</modern:SimpleStackPanel>
@@ -36,24 +36,25 @@
 			HorizontalAlignment="Center">
 
 			<Button s:View.ActionTarget="{Binding Playlist}" Command="{s:Action ToggleShuffle}">
-                <modern:FontIcon Glyph="&#xE14B;" Foreground="{Binding Playlist.ShuffleStateColor}" />
+                <ui:FontIcon Glyph="&#xE14B;" FontFamily="Segoe MDL2 Assets"
+                             Foreground="{Binding Playlist.ShuffleStateColor}" />
 			</Button>
 
 			<Button Command="{s:Action Previous}"
 			        IsHitTestVisible="{Binding CanHitPrevious}">
-                <modern:FontIcon Glyph="&#xE892;"  />
+                <ui:FontIcon Glyph="&#xE892;" FontFamily="Segoe MDL2 Assets" />
 			</Button>
 			<Button Command="{s:Action PlayPause}"
 			        IsHitTestVisible="{Binding CanHitPlayPause}">
-                <modern:FontIcon Glyph="{Binding PlayPauseIcon}"  />
+                <ui:FontIcon Glyph="{Binding PlayPauseIcon}" FontFamily="Segoe MDL2 Assets" />
 			</Button>
 			<Button Command="{s:Action Next}"
 			        IsHitTestVisible="{Binding CanHitNext}">
-                <modern:FontIcon Glyph="&#xE893;"  />
+                <ui:FontIcon Glyph="&#xE893;" FontFamily="Segoe MDL2 Assets" />
 			</Button>
 
 			<Button s:View.ActionTarget="{Binding Playlist}" Command="{s:Action ToggleLoop}">
-                <modern:FontIcon Glyph="{Binding Playlist.LoopStateString}"  />
+                <ui:FontIcon Glyph="{Binding Playlist.LoopStateString}" FontFamily="Segoe MDL2 Assets" />
 			</Button>
 		</modern:SimpleStackPanel>
 
@@ -120,7 +121,7 @@
 					SelectedItem="{Binding SelectedMidiInput}"
 					DisplayMemberPath="DeviceName" />
 				<Button Command="{s:Action RefreshDevices}">
-                    <modern:FontIcon Glyph="&#xE72C;"  />
+                    <ui:FontIcon Glyph="&#xE72C;" FontFamily="Segoe MDL2 Assets" />
 				</Button>
 			</modern:SimpleStackPanel>
 		</GroupBox>

diff --git a/GenshinLyreMidiPlayer.WPF/Views/PlaylistView.xaml b/GenshinLyreMidiPlayer.WPF/Views/PlaylistView.xaml
@@ -16,7 +16,7 @@
     xmlns:viewModels="clr-namespace:GenshinLyreMidiPlayer.WPF.ViewModels"
     xmlns:midi="clr-namespace:GenshinLyreMidiPlayer.Data.Midi;assembly=GenshinLyreMidiPlayer.Data"
 
-    d:DataContext="{d:DesignInstance viewModels:PlaylistViewModel}">
+    d:DataContext="{d:DesignInstance Type=viewModels:PlaylistViewModel}">
     <UserControl.Resources>
         <modernWpf:TrackGroupKeyConverter x:Key="TrackGroupKeyConverter" />
         <CollectionViewSource x:Key="Tracks" Source="{Binding FilteredTracks}">
@@ -39,11 +39,11 @@
                     <ColumnDefinition Width="*" />
                 </Grid.ColumnDefinitions>
 
-                <modern:FontIcon
+                <ui:FontIcon
                     Grid.Column="0" Grid.Row="0"
                     Grid.RowSpan="2" Margin="5"
                     VerticalAlignment="Center" HorizontalAlignment="Center"
-                    Glyph="&#xEC4F;" />
+                    Glyph="&#xEC4F;" FontFamily="Segoe MDL2 Assets" />
 
                 <TextBlock
                     Grid.Column="0" Grid.Row="0" Grid.RowSpan="2"
@@ -82,10 +82,10 @@
             </Grid.ColumnDefinitions>
 
             <Button Command="{s:Action OpenFile}" Background="Transparent">
-                <modern:FontIcon Glyph="&#xE8E5;" />
+                <ui:FontIcon Glyph="&#xE8E5;" FontFamily="Segoe MDL2 Assets" />
             </Button>
 
-            <TextBlock Grid.Column="1" Margin="10,0" VerticalAlignment="Center">
+	        <TextBlock Grid.Column="1" Margin="10,0" VerticalAlignment="Center">
                 Current song: <Run Text="{Binding OpenedFile.Title, Mode=OneWay, FallbackValue=Open...}" />
             </TextBlock>
 
@@ -124,10 +124,11 @@
             Grid.Row="2" Orientation="Horizontal"
             HorizontalAlignment="Center">
             <Button Command="{s:Action ToggleShuffle}">
-                <modern:FontIcon Glyph="&#xE14B;" Foreground="{Binding ShuffleStateColor}" />
+	            <ui:FontIcon Glyph="&#xE14B;" FontFamily="Segoe MDL2 Assets"
+	                         Foreground="{Binding Playlist.ShuffleStateColor}" />
             </Button>
             <Button Command="{s:Action ToggleLoop}">
-                <modern:FontIcon Glyph="{Binding LoopStateString}" />
+                <ui:FontIcon Glyph="{Binding LoopStateString}" FontFamily="Segoe MDL2 Assets" />
             </Button>
         </modern:SimpleStackPanel>
     </Grid>

diff --git a/GenshinLyreMidiPlayer.WPF/Views/SettingsPageView.xaml b/GenshinLyreMidiPlayer.WPF/Views/SettingsPageView.xaml
@@ -103,7 +103,7 @@
             <GroupBox Header="Location">
                 <modern:SimpleStackPanel Orientation="Horizontal">
                     <Button Command="{s:Action SetLocation}" Background="Transparent">
-                        <modern:FontIcon Glyph="&#xE8E5;" />
+                        <ui:FontIcon Glyph="&#xE8E5;" FontFamily="Segoe MDL2 Assets" />
                     </Button>
                     <TextBlock Text="{x:Static viewModels:SettingsPageViewModel.GenshinLocation}"
                                VerticalAlignment="Center" />
@@ -112,16 +112,15 @@
 
             <GroupBox Header="Version">
                 <modern:SimpleStackPanel>
-                    <TextBlock x:Name="VersionText" VerticalAlignment="Center" Style="{DynamicResource SubtitleTextBlockStyle}">
-                            You are running version
-                            v<Run Text="{Binding ProgramVersion, Mode=OneTime}" />
-                        </TextBlock>
                     <modern:SimpleStackPanel Orientation="Horizontal">
+	                    <TextBlock x:Name="VersionText" VerticalAlignment="Center"
+	                               Style="{DynamicResource SubtitleTextBlockStyle}">
+		                    You are running version
+		                    v<Run Text="{Binding ProgramVersion, Mode=OneTime}" />
+	                    </TextBlock>
                         <Button Command="{s:Action CheckForUpdate}"
-                                Visibility="{Binding IsCheckingUpdate, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}}">
-                            <modern:FontIcon
-                                Glyph="&#xE72C;"
-                                FontSize="{Binding ElementName=VersionText, Path=FontSize}" />
+	                            Visibility="{Binding IsCheckingUpdate, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}}">
+                            <ui:FontIcon Glyph="&#xE72C;" FontFamily="Segoe MDL2 Assets" />
                         </Button>
                         <ui:ProgressRing 
 	                        IsIndeterminate="True" IsEnabled="{Binding IsCheckingUpdate}"