/ src / modules / cmdpal / Microsoft.CmdPal.UI / Settings / AppearancePage.xaml
AppearancePage.xaml
  1  <?xml version="1.0" encoding="utf-8" ?>
  2  <Page
  3      x:Class="Microsoft.CmdPal.UI.Settings.AppearancePage"
  4      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  5      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  6      xmlns:controls="using:CommunityToolkit.WinUI.Controls"
  7      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  8      xmlns:helpers="using:Microsoft.CmdPal.UI.Helpers"
  9      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 10      xmlns:ptControls="using:Microsoft.CmdPal.UI.Controls"
 11      xmlns:ui="using:CommunityToolkit.WinUI"
 12      mc:Ignorable="d">
 13      <Grid>
 14          <Grid.RowDefinitions>
 15              <RowDefinition Height="Auto" />
 16              <RowDefinition Height="*" />
 17          </Grid.RowDefinitions>
 18          <ScrollViewer Grid.Row="1">
 19              <Grid Padding="16">
 20                  <StackPanel
 21                      MaxWidth="1000"
 22                      HorizontalAlignment="Stretch"
 23                      Spacing="{StaticResource SettingsCardSpacing}">
 24  
 25                      <ptControls:ScreenPreview Margin="0,0,0,16" HorizontalAlignment="Left">
 26                          <ptControls:CommandPalettePreview
 27                              PreviewBackgroundColor="{x:Bind ViewModel.Appearance.EffectiveBackdrop.TintColor, Mode=OneWay}"
 28                              PreviewBackgroundImageBlurAmount="{x:Bind ViewModel.Appearance.EffectiveBackgroundImageBlurAmount, Mode=OneWay}"
 29                              PreviewBackgroundImageBrightness="{x:Bind ViewModel.Appearance.EffectiveBackgroundImageBrightness, Mode=OneWay}"
 30                              PreviewBackgroundImageFit="{x:Bind ViewModel.Appearance.BackgroundImageFit, Mode=OneWay}"
 31                              PreviewBackgroundImageSource="{x:Bind ViewModel.Appearance.EffectiveBackgroundImageSource, Mode=OneWay}"
 32                              PreviewBackgroundImageTint="{x:Bind ViewModel.Appearance.EffectiveThemeColor, Mode=OneWay}"
 33                              PreviewBackgroundImageTintIntensity="{x:Bind ViewModel.Appearance.ColorIntensity, Mode=OneWay}"
 34                              PreviewBackgroundOpacity="{x:Bind ViewModel.Appearance.EffectiveBackdrop.TintOpacity, Mode=OneWay}"
 35                              RequestedTheme="{x:Bind ViewModel.Appearance.EffectiveTheme, Mode=OneWay}" />
 36                      </ptControls:ScreenPreview>
 37  
 38                      <controls:SettingsCard x:Uid="Settings_GeneralPage_AppTheme_SettingsCard" HeaderIcon="{ui:FontIcon Glyph=&#xE793;}">
 39                          <ComboBox MinWidth="{StaticResource SettingActionControlMinWidth}" SelectedIndex="{x:Bind ViewModel.Appearance.ThemeIndex, Mode=TwoWay}">
 40  
 41                              <ComboBoxItem x:Uid="Settings_GeneralPage_AppTheme_Mode_System_Automation" Tag="Default">
 42                                  <StackPanel Orientation="Horizontal" Spacing="8">
 43                                      <FontIcon FontSize="16" Glyph="&#xE770;" />
 44                                      <TextBlock x:Uid="Settings_GeneralPage_AppTheme_Mode_System" />
 45                                  </StackPanel>
 46                              </ComboBoxItem>
 47  
 48                              <ComboBoxItem x:Uid="Settings_GeneralPage_AppTheme_Mode_Light_Automation" Tag="Light">
 49                                  <StackPanel Orientation="Horizontal" Spacing="8">
 50                                      <FontIcon FontSize="16" Glyph="&#xE706;" />
 51                                      <TextBlock x:Uid="Settings_GeneralPage_AppTheme_Mode_Light" />
 52                                  </StackPanel>
 53                              </ComboBoxItem>
 54  
 55                              <ComboBoxItem x:Uid="Settings_GeneralPage_AppTheme_Mode_Dark_Automation" Tag="Dark">
 56                                  <StackPanel Orientation="Horizontal" Spacing="8">
 57                                      <FontIcon FontSize="16" Glyph="&#xE708;" />
 58                                      <TextBlock x:Uid="Settings_GeneralPage_AppTheme_Mode_Dark" />
 59                                  </StackPanel>
 60                              </ComboBoxItem>
 61  
 62                          </ComboBox>
 63                      </controls:SettingsCard>
 64  
 65                      <controls:SettingsExpander
 66                          x:Uid="Settings_GeneralPage_Background_SettingsExpander"
 67                          HeaderIcon="{ui:FontIcon Glyph=&#xE790;}"
 68                          IsExpanded="{x:Bind ViewModel.Appearance.IsColorizationDetailsExpanded, Mode=TwoWay}">
 69                          <ComboBox
 70                              x:Uid="Settings_GeneralPage_ColorizationMode"
 71                              MinWidth="{StaticResource SettingActionControlMinWidth}"
 72                              SelectedIndex="{x:Bind ViewModel.Appearance.ColorizationModeIndex, Mode=TwoWay}">
 73                              <ComboBoxItem x:Uid="Settings_GeneralPage_ColorizationMode_None" />
 74                              <ComboBoxItem x:Uid="Settings_GeneralPage_ColorizationMode_WindowsAccent" />
 75                              <ComboBoxItem x:Uid="Settings_GeneralPage_ColorizationMode_CustomColor" />
 76                              <ComboBoxItem x:Uid="Settings_GeneralPage_ColorizationMode_Image" />
 77                          </ComboBox>
 78                          <controls:SettingsExpander.Items>
 79                              <!--  none  -->
 80                              <controls:SettingsCard
 81                                  x:Uid="Settings_GeneralPage_NoBackground_SettingsCard"
 82                                  HorizontalContentAlignment="Stretch"
 83                                  ContentAlignment="Vertical"
 84                                  Visibility="{x:Bind ViewModel.Appearance.IsNoBackgroundVisible, Mode=OneWay}">
 85                                  <TextBlock
 86                                      x:Uid="Settings_GeneralPage_NoBackground_DescriptionTextBlock"
 87                                      Margin="24"
 88                                      HorizontalAlignment="Stretch"
 89                                      Foreground="{ThemeResource TextFillColorSecondaryBrush}"
 90                                      HorizontalTextAlignment="Center"
 91                                      TextAlignment="Center"
 92                                      TextWrapping="WrapWholeWords" />
 93                              </controls:SettingsCard>
 94  
 95                              <!--  system accent color  -->
 96                              <controls:SettingsCard x:Uid="Settings_GeneralPage_WindowsAccentColor_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsAccentColorControlsVisible, Mode=OneWay}">
 97                                  <controls:SettingsCard.Description>
 98                                      <TextBlock>
 99                                          <Run x:Uid="Settings_GeneralPage_WindowsAccentColor_SettingsCard_Description1" />
100                                          <Hyperlink
101                                              Click="OpenWindowsColorsSettings_Click"
102                                              TextDecorations="None"
103                                              UnderlineStyle="None">
104                                              <Run x:Uid="Settings_GeneralPage_WindowsAccentColor_OpenWindowsColorsLinkText" />
105                                          </Hyperlink>
106                                      </TextBlock>
107                                  </controls:SettingsCard.Description>
108                                  <controls:SettingsCard.Content>
109                                      <Border
110                                          MinWidth="32"
111                                          MinHeight="32"
112                                          CornerRadius="{ThemeResource ControlCornerRadius}">
113                                          <Border.Background>
114                                              <SolidColorBrush Color="{x:Bind ViewModel.Appearance.EffectiveThemeColor, Mode=OneWay}" />
115                                          </Border.Background>
116                                      </Border>
117                                  </controls:SettingsCard.Content>
118                              </controls:SettingsCard>
119  
120                              <!--  background  -->
121                              <controls:SettingsCard
122                                  x:Uid="Settings_GeneralPage_BackgroundImage_SettingsCard"
123                                  Description="{x:Bind ViewModel.Appearance.BackgroundImagePath, Mode=OneWay}"
124                                  Visibility="{x:Bind ViewModel.Appearance.IsBackgroundControlsVisible, Mode=OneWay}">
125                                  <Button x:Uid="Settings_GeneralPage_BackgroundImage_ChooseImageButton" Click="PickBackgroundImage_Click" />
126                              </controls:SettingsCard>
127                              <controls:SettingsCard x:Uid="Settings_GeneralPage_BackgroundImageBrightness_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsBackgroundControlsVisible, Mode=OneWay}">
128                                  <Slider
129                                      MinWidth="{StaticResource SettingActionControlMinWidth}"
130                                      Maximum="100"
131                                      Minimum="-100"
132                                      StepFrequency="1"
133                                      Value="{x:Bind ViewModel.Appearance.BackgroundImageBrightness, Mode=TwoWay}" />
134                              </controls:SettingsCard>
135                              <controls:SettingsCard x:Uid="Settings_GeneralPage_BackgroundImageBlur_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsBackgroundControlsVisible, Mode=OneWay}">
136                                  <Slider
137                                      MinWidth="{StaticResource SettingActionControlMinWidth}"
138                                      Maximum="50"
139                                      Minimum="0"
140                                      StepFrequency="1"
141                                      Value="{x:Bind ViewModel.Appearance.BackgroundImageBlurAmount, Mode=TwoWay}" />
142                              </controls:SettingsCard>
143                              <controls:SettingsCard x:Uid="Settings_GeneralPage_BackgroundImageFit_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsBackgroundControlsVisible, Mode=OneWay}">
144                                  <ComboBox SelectedIndex="{x:Bind ViewModel.Appearance.BackgroundImageFitIndex, Mode=TwoWay}">
145                                      <ComboBoxItem x:Uid="BackgroundImageFit_ComboBoxItem_Fill" />
146                                      <ComboBoxItem x:Uid="BackgroundImageFit_ComboBoxItem_Stretch" />
147                                  </ComboBox>
148                              </controls:SettingsCard>
149  
150                              <!--  Background tint color and intensity  -->
151                              <controls:SettingsCard x:Uid="Settings_GeneralPage_BackgroundTint_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsCustomTintVisible, Mode=OneWay}">
152                                  <ptControls:ColorPickerButton
153                                      HasSelectedColor="True"
154                                      IsAlphaEnabled="False"
155                                      PaletteColors="{x:Bind ViewModel.Appearance.Swatches}"
156                                      SelectedColor="{x:Bind ViewModel.Appearance.ThemeColor, Mode=TwoWay}" />
157                              </controls:SettingsCard>
158                              <controls:SettingsCard x:Uid="Settings_GeneralPage_BackgroundTintIntensity_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsCustomTintIntensityVisible, Mode=OneWay}">
159                                  <Slider
160                                      MinWidth="{StaticResource SettingActionControlMinWidth}"
161                                      Maximum="100"
162                                      Minimum="1"
163                                      StepFrequency="1"
164                                      Value="{x:Bind ViewModel.Appearance.ColorIntensity, Mode=TwoWay}" />
165                              </controls:SettingsCard>
166  
167                              <!--  Reset background image properties  -->
168                              <controls:SettingsCard x:Uid="Settings_GeneralPage_BackgroundImage_ResetProperties_SettingsCard" Visibility="{x:Bind ViewModel.Appearance.IsBackgroundControlsVisible, Mode=OneWay}">
169                                  <StackPanel Orientation="Horizontal" Spacing="8">
170                                      <Button x:Uid="Settings_GeneralPage_Background_ResetImagePropertiesButton" Command="{x:Bind ViewModel.Appearance.ResetBackgroundImagePropertiesCommand}" />
171                                  </StackPanel>
172                              </controls:SettingsCard>
173  
174                          </controls:SettingsExpander.Items>
175                      </controls:SettingsExpander>
176  
177                      <!--  'Behavior' section  -->
178  
179                      <TextBlock x:Uid="BehaviorSettingsHeader" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
180  
181                      <controls:SettingsCard x:Uid="Settings_GeneralPage_ShowAppDetails_SettingsCard" HeaderIcon="{ui:FontIcon Glyph=&#xE8A0;}">
182                          <ToggleSwitch IsOn="{x:Bind ViewModel.ShowAppDetails, Mode=TwoWay}" />
183                      </controls:SettingsCard>
184  
185                      <controls:SettingsCard x:Uid="Settings_GeneralPage_BackspaceGoesBack_SettingsCard" HeaderIcon="{ui:FontIcon Glyph=&#xE750;}">
186                          <ToggleSwitch IsOn="{x:Bind ViewModel.BackspaceGoesBack, Mode=TwoWay}" />
187                      </controls:SettingsCard>
188  
189                      <controls:SettingsCard x:Uid="Settings_GeneralPage_EscapeKeyBehavior_SettingsCard" HeaderIcon="{ui:FontIcon Glyph=&#xE845;}">
190                          <ComboBox MinWidth="{StaticResource SettingActionControlMinWidth}" SelectedIndex="{x:Bind ViewModel.EscapeKeyBehaviorIndex, Mode=TwoWay}">
191                              <ComboBoxItem x:Uid="Settings_GeneralPage_EscapeKeyBehavior_Option_DismissEmptySearchOrGoBack" />
192                              <ComboBoxItem x:Uid="Settings_GeneralPage_EscapeKeyBehavior_Option_AlwaysGoBack" />
193                              <ComboBoxItem x:Uid="Settings_GeneralPage_EscapeKeyBehavior_Option_AlwaysDismiss" />
194                              <ComboBoxItem x:Uid="Settings_GeneralPage_EscapeKeyBehavior_Option_AlwaysHide" />
195                          </ComboBox>
196                      </controls:SettingsCard>
197  
198                      <controls:SettingsCard x:Uid="Settings_GeneralPage_SingleClickActivation_SettingsCard" HeaderIcon="{ui:FontIcon Glyph=&#xE962;}">
199                          <ToggleSwitch IsOn="{x:Bind ViewModel.SingleClickActivates, Mode=TwoWay}" />
200                      </controls:SettingsCard>
201  
202                      <controls:SettingsCard x:Uid="Settings_GeneralPage_DisableAnimations_SettingsCard" HeaderIcon="{ui:FontIcon Glyph=&#xE945;}">
203                          <ToggleSwitch IsOn="{x:Bind ViewModel.DisableAnimations, Mode=TwoWay}" />
204                      </controls:SettingsCard>
205                  </StackPanel>
206              </Grid>
207          </ScrollViewer>
208      </Grid>
209  </Page>