[Settings]Adding a Dashboard Panel (#29023)

* Dashboard: modifying page content + adding SW version button.

* Visual tweaks and minor viewmodel changes

* Updated spacing

* Adding Settings icon

* Settiing the Dashboard page as the default one. Adding functionality to switch to settings pages from the Dashboard page. Localizing texts.

* fixing csproj file

* Reimplementing Active modules handling, showing only the active modules (and not having invisible inactive modules).

* Removing unneccessary binding

* Fix text wrapping

* Adding Registry previewer launch, adding activation mode for FindMyMouse and QuickAccent, modify File Locksmith description.

* Spell checker fix typo

* Adding GPO-blocked state, modifying buttons: adding description, icon.

* Modifying dashboard button layout

* Use SettingsCard instead of button

* Restructuring the dashboard panel

* Removing togglebuttons from the left panel. Showing only active modules. Adding key remappings (to KBM)

* Removing settings buttons, removing descriptions, icons from buttons. Add update of remapped keys, shortcuts.

* Refactoring dashboard

* Making list always visible and fixing scrolling behavior

* Adding background gradient to cards

* Removing keyboard manager's key mappings, minor changes in texts, fixing enabled state when GPO-enabled.

* Use ListView instead of ItemsRepeater

* Updates

* removing right panel with all modules. Extending "left" panel with toggleswitches, showing all modules.

* Separate lists

* Adding Flyout with key remappings for KBM module, adding IsLocked property, icons

* Visual tweaks

* Tweaks

* Fixing lock icon margin

* Minor fixes.

* Removing unused resources

* Make Dashboard default when coming from the OOBE General

* Removed the Previous, Next Layout buttons from FancyZones. Added activation information

---------

Co-authored-by: Niels Laute <niels.laute@live.nl>

src/settings-ui/Settings.UI/SettingsXAML/Controls/KeyVisual/KeyVisual.cs

@@ -116,7 +116,7 @@ namespace Microsoft.PowerToys.Settings.UI.Controls
 
                         case 91: // The left Windows key
                         case 92: // The right Windows key
-                            PathIcon winIcon = XamlReader.Load(@"<PathIcon xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" Data=""M9,17V9h8v8ZM0,17V9H8v8ZM9,8V0h8V8ZM0,8V0H8V8Z"" />") as PathIcon;
+                            PathIcon winIcon = XamlReader.Load(@"<PathIcon xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" Data=""M683 1229H0V546h683v683zm819 0H819V546h683v683zm-819 819H0v-683h683v683zm819 0H819v-683h683v683z"" />") as PathIcon;
                             Viewbox winIconContainer = new Viewbox();
                             winIconContainer.Child = winIcon;
                             winIconContainer.HorizontalAlignment = HorizontalAlignment.Center;
@@ -143,6 +143,10 @@ namespace Microsoft.PowerToys.Settings.UI.Controls
             {
                 return (Style)App.Current.Resources["SmallOutline" + styleName];
             }
+            else if (VisualType == VisualType.TextOnly)
+            {
+                return (Style)App.Current.Resources["Only" + styleName];
+            }
             else
             {
                 return (Style)App.Current.Resources["Default" + styleName];
@@ -181,6 +185,7 @@ namespace Microsoft.PowerToys.Settings.UI.Controls
     {
         Small,
         SmallOutline,
+        TextOnly,
         Large,
     }
 }

src/settings-ui/Settings.UI/SettingsXAML/Controls/KeyVisual/KeyVisual.xaml

@@ -5,9 +5,7 @@
 
     <x:Double x:Key="DefaultIconSize">16</x:Double>
     <x:Double x:Key="SmallIconSize">12</x:Double>
-    <Style
-        x:Key="DefaultTextKeyVisualStyle"
-        TargetType="local:KeyVisual">
+    <Style x:Key="DefaultTextKeyVisualStyle" TargetType="local:KeyVisual">
         <Setter Property="MinWidth" Value="56" />
         <Setter Property="MinHeight" Value="48" />
         <Setter Property="Background" Value="{ThemeResource AccentButtonBackground}" />
@@ -23,26 +21,6 @@
             <Setter.Value>
                 <ControlTemplate TargetType="local:KeyVisual">
                     <Grid>
-                        <Grid>
-                            <Rectangle
-                                x:Name="ContentHolder"
-                                Height="{TemplateBinding Height}"
-                                MinWidth="{TemplateBinding MinWidth}"
-                                Fill="{TemplateBinding Background}"
-                                RadiusX="4"
-                                RadiusY="4"
-                                Stroke="{TemplateBinding BorderBrush}"
-                                StrokeThickness="{TemplateBinding BorderThickness}" />
-                            <ContentPresenter
-                                x:Name="KeyPresenter"
-                                Margin="{TemplateBinding Padding}"
-                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                VerticalAlignment="Center"
-                                Content="{TemplateBinding Content}"
-                                FontSize="{TemplateBinding FontSize}"
-                                FontWeight="{TemplateBinding FontWeight}"
-                                Foreground="{TemplateBinding Foreground}" />
-                        </Grid>
                         <VisualStateManager.VisualStateGroups>
                             <VisualStateGroup x:Name="CommonStates">
                                 <VisualState x:Name="Normal" />
@@ -67,6 +45,26 @@
                                 </VisualState>
                             </VisualStateGroup>
                         </VisualStateManager.VisualStateGroups>
+                        <Grid>
+                            <Rectangle
+                                x:Name="ContentHolder"
+                                Height="{TemplateBinding Height}"
+                                MinWidth="{TemplateBinding MinWidth}"
+                                Fill="{TemplateBinding Background}"
+                                RadiusX="4"
+                                RadiusY="4"
+                                Stroke="{TemplateBinding BorderBrush}"
+                                StrokeThickness="{TemplateBinding BorderThickness}" />
+                            <ContentPresenter
+                                x:Name="KeyPresenter"
+                                Margin="{TemplateBinding Padding}"
+                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalAlignment="Center"
+                                Content="{TemplateBinding Content}"
+                                FontSize="{TemplateBinding FontSize}"
+                                FontWeight="{TemplateBinding FontWeight}"
+                                Foreground="{TemplateBinding Foreground}" />
+                        </Grid>
                     </Grid>
                 </ControlTemplate>
             </Setter.Value>
@@ -101,6 +99,7 @@
     </Style>
 
 
+
     <Style
         x:Key="DefaultIconKeyVisualStyle"
         BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
@@ -141,4 +140,35 @@
         <Setter Property="FontSize" Value="9" />
         <Setter Property="HorizontalContentAlignment" Value="Center" />
     </Style>
+
+    <Style
+        x:Key="OnlyTextKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
+        <Setter Property="MinHeight" Value="12" />
+        <Setter Property="MinWidth" Value="12" />
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" />
+        <Setter Property="BorderBrush" Value="Transparent" />
+        <Setter Property="FontWeight" Value="Normal" />
+        <Setter Property="Padding" Value="0" />
+        <Setter Property="FontSize" Value="12" />
+        <Setter Property="HorizontalContentAlignment" Value="Center" />
+    </Style>
+
+    <Style
+        x:Key="OnlyIconKeyVisualStyle"
+        BasedOn="{StaticResource DefaultTextKeyVisualStyle}"
+        TargetType="local:KeyVisual">
+        <Setter Property="MinHeight" Value="10" />
+        <Setter Property="MinWidth" Value="10" />
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" />
+        <Setter Property="BorderBrush" Value="Transparent" />
+        <Setter Property="FontFamily" Value="{ThemeResource SymbolThemeFontFamily}" />
+        <Setter Property="FontWeight" Value="Normal" />
+        <Setter Property="Padding" Value="0,0,0,3" />
+        <!--<Setter Property="FontSize" Value="9" />-->
+        <Setter Property="HorizontalContentAlignment" Value="Center" />
+    </Style>
 </ResourceDictionary>

src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutWithTextLabelControl.xaml

@@ -23,9 +23,7 @@
             ItemsSource="{x:Bind Keys}">
             <ItemsControl.ItemsPanel>
                 <ItemsPanelTemplate>
-                    <StackPanel
-                        Orientation="Horizontal"
-                        Spacing="4" />
+                    <StackPanel Orientation="Horizontal" Spacing="4" />
                 </ItemsPanelTemplate>
             </ItemsControl.ItemsPanel>
             <ItemsControl.ItemTemplate>
@@ -41,7 +39,6 @@
         </ItemsControl>
         <toolkitcontrols:MarkdownTextBlock
             Grid.Column="1"
-            Margin="8,0,0,0"
             VerticalAlignment="Center"
             Background="Transparent"
             Text="{x:Bind Text}" />