diff --git a/src/Files.App/ServicesImplementation/Settings/AppearanceSettingsService.cs b/src/Files.App/ServicesImplementation/Settings/AppearanceSettingsService.cs index 0f5767e5a664..96b127492d21 100644 --- a/src/Files.App/ServicesImplementation/Settings/AppearanceSettingsService.cs +++ b/src/Files.App/ServicesImplementation/Settings/AppearanceSettingsService.cs @@ -48,21 +48,21 @@ public String AppThemeBackgroundColor /// public String AppThemeAddressBarBackgroundColor { - get => Get("#00000000"); + get => Get(""); set => Set(value); } /// public String AppThemeSidebarBackgroundColor { - get => Get("#00000000"); + get => Get(""); set => Set(value); } /// public String AppThemeFileAreaBackgroundColor { - get => Get("#00000000"); + get => Get(""); set => Set(value); } diff --git a/src/Files.App/ValueConverters/ColorToSolidColorBrushValueConverter.cs b/src/Files.App/ValueConverters/ColorToSolidColorBrushValueConverter.cs new file mode 100644 index 000000000000..305a21f0ee13 --- /dev/null +++ b/src/Files.App/ValueConverters/ColorToSolidColorBrushValueConverter.cs @@ -0,0 +1,30 @@ +using Microsoft.UI.Xaml.Data; +using Microsoft.UI.Xaml.Media; +using System; +using Windows.UI; + +namespace Files.App.ValueConverters +{ + public class ColorToSolidColorBrushValueConverter : IValueConverter + { + public object? Convert(object value, Type targetType, object parameter, string language) + { + if (null == value) + return null; + + if (value is Color) + { + Color color = (Color)value; + return new SolidColorBrush(color); + } + + Type type = value.GetType(); + throw new InvalidOperationException("Unsupported type [" + type.Name + "]"); + } + + public object ConvertBack(object value, Type targetType, object parameter, string language) + { + throw new NotImplementedException(); + } + } +} diff --git a/src/Files.App/ViewModels/SettingsViewModels/AppearanceViewModel.cs b/src/Files.App/ViewModels/SettingsViewModels/AppearanceViewModel.cs index 7dfb5a7746bf..f123d634bba1 100644 --- a/src/Files.App/ViewModels/SettingsViewModels/AppearanceViewModel.cs +++ b/src/Files.App/ViewModels/SettingsViewModels/AppearanceViewModel.cs @@ -49,29 +49,28 @@ private void UpdateSelectedBackground() var appThemeBackgroundColor = new AppThemeResource { BackgroundColor = backgroundColor, - PreviewColor = new SolidColorBrush(Color.FromArgb(255, backgroundColor.R, backgroundColor.G, backgroundColor.B)), Name = "Custom" }; - AppThemeResources.Insert(1, appThemeBackgroundColor); + AppThemeResources.Add(appThemeBackgroundColor); } - SelectedAppBackgroundColor = AppThemeResources - .Where(p => p.BackgroundColor == AppThemeBackgroundColor) - .FirstOrDefault() ?? AppThemeResources[0]; + SelectedAppThemeResources = AppThemeResources + .Where(p => p.BackgroundColor == AppThemeBackgroundColor) + .FirstOrDefault() ?? AppThemeResources[0]; } - private AppThemeResource selectedAppBackgroundColor; - public AppThemeResource SelectedAppBackgroundColor + private AppThemeResource selectedAppThemeResources; + public AppThemeResource SelectedAppThemeResources { - get => selectedAppBackgroundColor; + get => selectedAppThemeResources; set { - if (SetProperty(ref selectedAppBackgroundColor, value)) + if (SetProperty(ref selectedAppThemeResources, value)) { - AppThemeBackgroundColor = SelectedAppBackgroundColor.BackgroundColor; - OnPropertyChanged(nameof(selectedAppBackgroundColor)); + AppThemeBackgroundColor = SelectedAppThemeResources.BackgroundColor; + OnPropertyChanged(nameof(selectedAppThemeResources)); } } } diff --git a/src/Files.App/Views/MainPage.xaml.cs b/src/Files.App/Views/MainPage.xaml.cs index c2a23f03593d..ae275da2ab2a 100644 --- a/src/Files.App/Views/MainPage.xaml.cs +++ b/src/Files.App/Views/MainPage.xaml.cs @@ -27,7 +27,6 @@ using Windows.Graphics; using Windows.Services.Store; using Windows.Storage; -using Windows.UI; using ColorHelper = CommunityToolkit.WinUI.Helpers.ColorHelper; namespace Files.App.Views @@ -62,7 +61,6 @@ public MainPage() { InitializeComponent(); - // TODO LayoutDirection is empty, might be an issue with WinAppSdk var flowDirectionSetting = new Microsoft.Windows.ApplicationModel.Resources.ResourceManager().CreateResourceContext().QualifierValues["LayoutDirection"]; if (flowDirectionSetting == "RTL") FlowDirection = FlowDirection.RightToLeft; @@ -79,26 +77,34 @@ public MainPage() LoadAppResources(); } + + private void LoadAppResources() { var useCompactStyles = UserSettingsService.AppearanceSettingsService.UseCompactStyles; var appThemeBackgroundColor = ColorHelper.ToColor(UserSettingsService.AppearanceSettingsService.AppThemeBackgroundColor); - var appThemeAddressBarBackgroundColor = ColorHelper.ToColor(UserSettingsService.AppearanceSettingsService.AppThemeAddressBarBackgroundColor); - var appThemeSidebarBackgroundColor = ColorHelper.ToColor(UserSettingsService.AppearanceSettingsService.AppThemeSidebarBackgroundColor); - var appThemeFileAreaBackgroundColor = ColorHelper.ToColor(UserSettingsService.AppearanceSettingsService.AppThemeFileAreaBackgroundColor); + var appThemeAddressBarBackgroundColor = UserSettingsService.AppearanceSettingsService.AppThemeAddressBarBackgroundColor; + var appThemeSidebarBackgroundColor = UserSettingsService.AppearanceSettingsService.AppThemeSidebarBackgroundColor; + var appThemeFileAreaBackgroundColor = UserSettingsService.AppearanceSettingsService.AppThemeFileAreaBackgroundColor; var appThemeFontFamily = UserSettingsService.AppearanceSettingsService.AppThemeFontFamily; App.AppThemeResourcesHelper.SetCompactSpacing(useCompactStyles); App.AppThemeResourcesHelper.SetAppThemeBackgroundColor(appThemeBackgroundColor); - if (appThemeAddressBarBackgroundColor != Color.FromArgb(0,0,0,0)) - App.AppThemeResourcesHelper.SetAppThemeAddressBarBackgroundColor(appThemeAddressBarBackgroundColor); - - if (appThemeSidebarBackgroundColor != Color.FromArgb(0,0,0,0)) - App.AppThemeResourcesHelper.SetAppThemeSidebarBackgroundColor(appThemeSidebarBackgroundColor); + if (!String.IsNullOrWhiteSpace(appThemeAddressBarBackgroundColor) && appThemeAddressBarBackgroundColor != "#00000000") + App.AppThemeResourcesHelper.SetAppThemeAddressBarBackgroundColor(ColorHelper.ToColor(appThemeAddressBarBackgroundColor)); + else + UserSettingsService.AppearanceSettingsService.AppThemeAddressBarBackgroundColor = ""; //migrate to new default + + if (!String.IsNullOrWhiteSpace(appThemeSidebarBackgroundColor) && appThemeAddressBarBackgroundColor != "#00000000") + App.AppThemeResourcesHelper.SetAppThemeSidebarBackgroundColor(ColorHelper.ToColor(appThemeSidebarBackgroundColor)); + else + UserSettingsService.AppearanceSettingsService.AppThemeSidebarBackgroundColor = ""; //migrate to new default - if (appThemeFileAreaBackgroundColor != Color.FromArgb(0,0,0,0)) - App.AppThemeResourcesHelper.SetAppThemeFileAreaBackgroundColor(appThemeFileAreaBackgroundColor); + if (!String.IsNullOrWhiteSpace(appThemeFileAreaBackgroundColor) && appThemeAddressBarBackgroundColor != "#00000000") + App.AppThemeResourcesHelper.SetAppThemeFileAreaBackgroundColor(ColorHelper.ToColor(appThemeFileAreaBackgroundColor)); + else + UserSettingsService.AppearanceSettingsService.AppThemeFileAreaBackgroundColor = ""; //migrate to new default if (appThemeFontFamily != "Segoe UI Variable") App.AppThemeResourcesHelper.SetAppThemeFontFamily(appThemeFontFamily); diff --git a/src/Files.App/Views/SettingsPages/Appearance.xaml b/src/Files.App/Views/SettingsPages/Appearance.xaml index 458b2c718692..321b39cf9ccc 100644 --- a/src/Files.App/Views/SettingsPages/Appearance.xaml +++ b/src/Files.App/Views/SettingsPages/Appearance.xaml @@ -5,6 +5,7 @@ xmlns:appearance="using:Files.App.Views.SettingsPages.Appearance" xmlns:controls="using:CommunityToolkit.WinUI.UI.Controls" xmlns:converters="using:CommunityToolkit.WinUI.UI.Converters" + xmlns:converters1="using:Files.App.ValueConverters" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:helpers="using:Files.App.Helpers" xmlns:local="using:Files.App.UserControls.Settings" @@ -18,27 +19,66 @@ + - - + + + + + + + + Grid.RowSpan="2" + Height="66" + Background="{x:Bind BackgroundColor, Converter={StaticResource ColorToSolidColorBrushConverter}, Mode=OneWay}" + CornerRadius="4,4,0,0" /> + + + + + + + + + - + Grid.Row="1" + Height="50" + VerticalAlignment="Bottom" + Background="{ThemeResource LayerOnMicaBaseAltFillColorDefault}" + BorderBrush="{ThemeResource ControlElevationBorderBrush}" + BorderThickness="0,0,0,.5" /> + + + @@ -57,14 +97,14 @@ - + - - + + @@ -76,7 +116,7 @@ SelectedIndex="{x:Bind ViewModel.SelectedThemeIndex, Mode=TwoWay}" /> - + + ItemTemplate="{StaticResource AppThemeResourcesItemTemplate}" + ItemsSource="{x:Bind ViewModel.AppThemeResources, Mode=OneWay}" + SelectedItem="{x:Bind ViewModel.SelectedAppThemeResources, Mode=TwoWay}" /> - + @@ -127,15 +167,15 @@ Style="{StaticResource RightAlignedToggleSwitchStyle}" /> - - + + - + diff --git a/src/Files.App/Views/SettingsPages/Appearance/AppThemeResource.cs b/src/Files.App/Views/SettingsPages/Appearance/AppThemeResource.cs index f95eaa62712e..66edd7035fb2 100644 --- a/src/Files.App/Views/SettingsPages/Appearance/AppThemeResource.cs +++ b/src/Files.App/Views/SettingsPages/Appearance/AppThemeResource.cs @@ -5,8 +5,7 @@ namespace Files.App.Views.SettingsPages.Appearance { public class AppThemeResource { - public string Name { get; set; } - public Brush PreviewColor { get; set; } + public string? Name { get; set; } public Color BackgroundColor { get; set; } } } diff --git a/src/Files.App/Views/SettingsPages/Appearance/AppThemeResourcesFactory.cs b/src/Files.App/Views/SettingsPages/Appearance/AppThemeResourcesFactory.cs index c065afd6c03e..119eade42489 100644 --- a/src/Files.App/Views/SettingsPages/Appearance/AppThemeResourcesFactory.cs +++ b/src/Files.App/Views/SettingsPages/Appearance/AppThemeResourcesFactory.cs @@ -11,295 +11,101 @@ public static class AppThemeResourceFactory new AppThemeResource { BackgroundColor = Color.FromArgb(0, 0, 0, 0), /* Transparent */ - PreviewColor = new SolidColorBrush(Color.FromArgb(0, 0, 0, 0)), /* Transparent */ Name = "Default" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 255, 185, 0), /* #FFB900 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 255, 185, 0)), /* #FFB900 */ Name = "Yellow Gold" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 255, 140, 0), /* #FF8C00 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 255, 140, 0)), /* #FF8C00 */ - Name = "Gold" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 247, 99, 12), /* #F7630C */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 247, 99, 12)), /* #F7630C */ Name = "Orange Bright" }, - //new AppThemeResource - //{ - // BackgroundColor = Color.FromArgb(50, 202, 80, 16), /* #CA5010 */ - // PreviewColor = new SolidColorBrush(Color.FromArgb(255, 202, 80, 16)), /* #CA5010 */ - // Name = "Orange Dark" - //}, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 218, 59, 1), /* #DA3B01 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 218, 59, 1)), /* #DA3B01 */ - Name = "Rust", - }, - //new AppThemeResource - //{ - // BackgroundColor = Color.FromArgb(50, 239, 105, 80), /* #EF6950 */ - // PreviewColor = new SolidColorBrush(Color.FromArgb(255, 239, 105, 80)), /* #EF6950 */ - // Name = "Pale Rust" - //}, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 209, 52, 56), /* #D13438 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 209, 52, 56)), /* #D13438 */ Name = "Brick Red" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 255, 67, 67), /* #FF4343 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 255, 67, 67)), /* #FF4343 */ Name = "Mod Red" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 231, 72, 86), /* #E74856 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 231, 72, 86)), /* #E74856 */ - Name = "Pale Red" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 232, 17, 35), /* #E81123 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(100, 232, 17, 35)), /* #E81123 */ Name = "Red" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 234, 0, 94), /* #EA005E */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 234, 0, 94)), /* #EA005E */ Name = "Rose Bright" }, - //new AppThemeResource - //{ - // BackgroundColor = Color.FromArgb(50, 195, 0, 82), /* #C30052 */ - // PreviewColor = new SolidColorBrush(Color.FromArgb(255, 195, 0, 82)), /* #C30052 */ - // Name = "Rose" - //}, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 227, 0, 140), /* #E3008C */ - PreviewColor = new SolidColorBrush(Color.FromArgb(100, 227, 0, 140)), /* #E3008C */ - Name = "Plum Light" - }, - //new AppThemeResource - //{ - // BackgroundColor = Color.FromArgb(50, 191, 0, 119), /* #BF0077 */ - // PreviewColor = new SolidColorBrush(Color.FromArgb(100, 191, 0, 119)), /* #BF0077 */ - // Name = "Plum" - //}, - //new AppThemeResource - //{ - // BackgroundColor = Color.FromArgb(50, 194, 57, 179), /* #C239B3 */ - // PreviewColor = new SolidColorBrush(Color.FromArgb(255, 194, 57, 179)), /* #C239B3 */ - // Name = "Orchid Light" - //}, - //new AppThemeResource - //{ - // BackgroundColor = Color.FromArgb(50, 154, 0, 137), /* #9A0089 */ - // PreviewColor = new SolidColorBrush(Color.FromArgb(255, 154, 0, 137)), /* #9A0089 */ - // Name = "Orchid" - //}, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 0, 120, 215), /* #0078D7 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 0, 120, 215)), /* #0078D7 */ Name = "Blue" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 0, 99, 177), /* #0063B1 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 0, 99, 177)), /* #0063B1 */ - Name = "Navy Blue" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 142, 140, 216), /* #8E8CD8 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 142, 140, 216)), /* #8E8CD8 */ - Name = "Purple Shaddow" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 107, 105, 214), /* #6B69D6 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 107, 105, 214)), /* #6B69D6 */ - Name = "Purple Shaddow Dark" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 135, 100, 184), /* #8764B8 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 135, 100, 184)), /* #8764B8 */ Name = "Iris Pastel" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 116, 77, 169), /* #744DA9 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 116, 77, 169)), /* #744DA9 */ - Name = "Iris Spring" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 177, 70, 194), /* #B146C2 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 177, 70, 194)), /* #B146C2 */ Name = "Violet Red Light" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 136, 23, 152), /* #881798 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 136, 23, 152)), /* #881798 */ - Name = "Violet Red" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 0, 153, 188), /* #0099BC */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 0, 153, 188)), /* #0099BC */ Name = "Cool Blue Bright" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 45, 125, 154), /* #2D7D9A */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 45, 125, 154)), /* #2D7D9A */ - Name = "Cool Blue" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 0, 183, 195), /* #00B7C3 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 0, 183, 195)), /* #00B7C3 */ Name = "Seafoam" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 3, 131, 135), /* #038387 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 3, 131, 135)), /* #038387 */ - Name = "Seafoam Teal" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 0, 178, 148), /* #00B294 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 0, 178, 148)), /* #00B294 */ Name = "Mint Light" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 1, 133, 116), /* #018574 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 1, 133, 116)), /* #018574 */ - Name = "Mint Dark" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 0, 204, 106), /* #00CC6A */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 0, 204, 106)), /* #00CC6A */ - Name = "Turf Green" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 16, 137, 62), /* #10893E */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 16, 137, 62)), /* #10893E */ - Name = "Sport Green" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 122, 117, 116), /* #7A7574 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 122, 117, 116)), /* #7A7574 */ Name = "Gray" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 93, 90, 80), /* #5D5A58 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 93, 90, 80)), /* #5D5A58 */ - Name = "Gray Brown" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 104, 118, 138), /* #68768A */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 104, 118, 138)), /* #68768A */ - Name = "Steel Blue" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 81, 92, 107), /* #515C6B */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 81, 92, 107)), /* #515C6B */ - Name = "Metal Blue" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 86, 124, 115), /* #567C73 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 86, 124, 115)), /* #567C73 */ - Name = "Pale Moss" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 72, 104, 96), /* #486860 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 72, 104, 96)), /* #486860 */ - Name = "Moss" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 73, 130, 5), /* #498205 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 73, 130, 5)), /* #498205 */ - Name = "Meadow Green" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 16, 124, 16), /* #107C10 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 16, 124, 16)), /* #107C10 */ Name = "Green" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 118, 118, 118), /* #767676 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 118, 118, 118)), /* #767676 */ Name = "Overcast" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 76, 74, 72), /* #4C4A48 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 76, 74, 72)), /* #4C4A48 */ Name = "Storm" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 105, 121, 126), /* #69797E */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 105, 121, 126)), /* #69797E */ Name = "Blue Gray" }, new AppThemeResource { BackgroundColor = Color.FromArgb(50, 74, 84, 89), /* #4A5459 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 74, 84, 89)), /* #4A5459 */ Name = "Gray Dark" }, new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 100, 124, 100), /* #647C64 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 100, 124, 100)), /* #647C64 */ - Name = "Liddy Green" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 82, 94, 84), /* #525E54 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 82, 94, 84)), /* #525E54 */ - Name = "Sage" - }, - new AppThemeResource - { - BackgroundColor = Color.FromArgb(50, 132, 117, 69), /* #847545 */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 132, 117, 69)), /* #847545 */ - Name = "Camouflage Desert" - }, - new AppThemeResource { BackgroundColor = Color.FromArgb(50, 126, 115, 95), /* #7E735F */ - PreviewColor = new SolidColorBrush(Color.FromArgb(255, 126, 115, 95)), /* #7E735F */ Name = "Camouflage" } };