- 投稿日:2021-01-16T23:30:44+09:00
MahAppでカラー設定の保存と利用
はじめに
Windows Template StudioからWPFアプリを作成すると、デフォルトでこんな画面が出来上がります
ちょっと前まで、XAMLIslandの項目なかったと思うのですが、投稿用にTemplateから作ってみたら、新しく追加されていました
で、今回の取り上げるのは、Settingの項目です
Settingにカラー設定を追加する
Templateから作成すると、Dark, Light, Defaultが選択できるようになっていますが、使用するカラーはApp.xamlで指定するようになっています。
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Dark.Blue.xaml" /> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />でも、動的にカラーを選びべるといいなと思い、あれこれと試行錯誤してみました。
ThemeSelectorService
ThemeSelectorServiceを見ると以下のようなコードがありました。
public class ThemeSelectorService : IThemeSelectorService { public void InitializeTheme() { ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcDarkTheme), MahAppsLibraryThemeProvider.DefaultInstance)); ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcLightTheme), MahAppsLibraryThemeProvider.DefaultInstance)); var theme = GetCurrentTheme(); SetTheme(theme); } public void SetTheme(AppTheme theme) { if (theme == AppTheme.Default) { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncAll; ThemeManager.Current.SyncTheme(); } else { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncWithHighContrast; ThemeManager.Current.SyncTheme(); ThemeManager.Current.ChangeTheme(Application.Current, $"{theme}.Blue", SystemParameters.HighContrast); } App.Current.Properties["Theme"] = theme.ToString(); } public AppTheme GetCurrentTheme() { if (App.Current.Properties.Contains("Theme")) { var themeName = App.Current.Properties["Theme"].ToString(); Enum.TryParse(themeName, out AppTheme theme); return theme; } return AppTheme.Default; } }GetCurrentTheme()で設定ファイルから"Theme"を呼び出し、SetTheme()で適用・保存をしているようです。
ということは、これをカラー設定もできるようにしてしまえばいいということでは?ThemeSelectorService の変更
RuntimeThemeGeneratorを使用してなんとかなりました
public void InitializeTheme() { ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcDarkTheme), MahAppsLibraryThemeProvider.DefaultInstance)); ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcLightTheme), MahAppsLibraryThemeProvider.DefaultInstance)); var theme = GetCurrentTheme(); // colorを設定ファイルから呼び出します var color = GetCurrentColor(); // SetTheme(theme); // SetThemeの代わりにcolorも設定できるようにしたSetThemeAndColorを呼び出します SetThemeAndColor(theme, color); } // カラー設定を呼び出す public Color GetCurrentColor() { if (App.Current.Properties.Contains("Color")) { Color color = (Color)ColorConverter.ConvertFromString(App.Current.Properties["Color"].ToString()); return color; } else { return Colors.Blue; } } // テーマ・カラーの両方を設定する public void SetThemeAndColor(AppTheme theme, Color color) { if (theme == AppTheme.Default) { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncAll; ThemeManager.Current.SyncTheme(); ThemeManager.Current.ChangeTheme(Application.Current, ThemeManager.Current.AddTheme(RuntimeThemeGenerator.Current.GenerateRuntimeTheme("Light", color))); } else { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncWithHighContrast; ThemeManager.Current.SyncTheme(); ThemeManager.Current.ChangeTheme(Application.Current, ThemeManager.Current.AddTheme(RuntimeThemeGenerator.Current.GenerateRuntimeTheme(theme.ToString(), color))); } App.Current.Properties["Theme"] = theme.ToString(); App.Current.Properties["Color"] = color.ToString(); }
- 投稿日:2021-01-16T23:30:44+09:00
MahAppsでカラー設定の保存と利用
はじめに
Windows Template StudioからWPFアプリを作成すると、デフォルトでこんな画面が出来上がります
ちょっと前まで、XAMLIslandの項目なかったと思うのですが、投稿用にTemplateから作ってみたら、新しく追加されていました
で、今回の取り上げるのは、Settingの項目です
Settingにカラー設定を追加する
Templateから作成すると、Dark, Light, Defaultが選択できるようになっていますが、使用するカラーはApp.xamlで指定するようになっています。
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Dark.Blue.xaml" /> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />でも、動的にカラーを選びべるといいなと思い、あれこれと試行錯誤してみました。
ThemeSelectorService
ThemeSelectorServiceを見ると以下のようなコードがありました。
public class ThemeSelectorService : IThemeSelectorService { public void InitializeTheme() { ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcDarkTheme), MahAppsLibraryThemeProvider.DefaultInstance)); ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcLightTheme), MahAppsLibraryThemeProvider.DefaultInstance)); var theme = GetCurrentTheme(); SetTheme(theme); } public void SetTheme(AppTheme theme) { if (theme == AppTheme.Default) { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncAll; ThemeManager.Current.SyncTheme(); } else { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncWithHighContrast; ThemeManager.Current.SyncTheme(); ThemeManager.Current.ChangeTheme(Application.Current, $"{theme}.Blue", SystemParameters.HighContrast); } App.Current.Properties["Theme"] = theme.ToString(); } public AppTheme GetCurrentTheme() { if (App.Current.Properties.Contains("Theme")) { var themeName = App.Current.Properties["Theme"].ToString(); Enum.TryParse(themeName, out AppTheme theme); return theme; } return AppTheme.Default; } }GetCurrentTheme()で設定ファイルから"Theme"を呼び出し、SetTheme()で適用・保存をしているようです。
ということは、これをカラー設定もできるようにしてしまえばいいということでは?ThemeSelectorService の変更
RuntimeThemeGeneratorを使用してなんとかなりました
public void InitializeTheme() { ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcDarkTheme), MahAppsLibraryThemeProvider.DefaultInstance)); ThemeManager.Current.AddLibraryTheme(new LibraryTheme(new Uri(HcLightTheme), MahAppsLibraryThemeProvider.DefaultInstance)); var theme = GetCurrentTheme(); // colorを設定ファイルから呼び出します var color = GetCurrentColor(); // SetTheme(theme); // SetThemeの代わりにcolorも設定できるようにしたSetThemeAndColorを呼び出します SetThemeAndColor(theme, color); } // カラー設定を呼び出す public Color GetCurrentColor() { if (App.Current.Properties.Contains("Color")) { Color color = (Color)ColorConverter.ConvertFromString(App.Current.Properties["Color"].ToString()); return color; } else { return Colors.Blue; } } // テーマ・カラーの両方を設定する public void SetThemeAndColor(AppTheme theme, Color color) { if (theme == AppTheme.Default) { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncAll; ThemeManager.Current.SyncTheme(); ThemeManager.Current.ChangeTheme(Application.Current, ThemeManager.Current.AddTheme(RuntimeThemeGenerator.Current.GenerateRuntimeTheme("Light", color))); } else { ThemeManager.Current.ThemeSyncMode = ThemeSyncMode.SyncWithHighContrast; ThemeManager.Current.SyncTheme(); ThemeManager.Current.ChangeTheme(Application.Current, ThemeManager.Current.AddTheme(RuntimeThemeGenerator.Current.GenerateRuntimeTheme(theme.ToString(), color))); } App.Current.Properties["Theme"] = theme.ToString(); App.Current.Properties["Color"] = color.ToString(); }