[CmdPal] Settings UI polishing (#38094)

<!-- Enter a brief description/summary of your PR here. What does it fix/what does it change/how was it tested (even manually, if necessary)? -->
## Summary of the Pull Request

Settings window UI polishing:
- Make the navigation view toggle button move in the title bar when navigation view mode is compact or minimal
- Center settings card in the window
- Properly set windows icon in order to make it visible in task manager and task view

_main branch_
![image](https://github.com/user-attachments/assets/792f0779-016a-4056-81b0-04244d903909)

![image](https://github.com/user-attachments/assets/81ac2761-2a9c-4fe7-a122-2f69f900e656)

_PR_
![image](https://github.com/user-attachments/assets/029b95a0-9629-4732-9f0c-bf586954e887)

![image](https://github.com/user-attachments/assets/81bb2beb-9a07-42cf-8594-16ba5a9cda1b)

<!-- Please review the items on the PR checklist before submitting-->
## PR Checklist

- [ ] **Closes:**: https://github.com/zadjii-msft/PowerToys/issues/581

---------

Co-authored-by: Niels Laute <niels.laute@live.nl>
This commit is contained in:
Davide Giacometti
2025-03-24 15:32:59 +01:00
committed by GitHub
parent 4e7bd34c4d
commit a9a41ca1a2
8 changed files with 88 additions and 36 deletions

View File

@@ -20,11 +20,21 @@
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!-- TO DO: Replace this with WinUI TitleBar once that ships. -->
<StackPanel Height="48" Orientation="Horizontal">
<Button
x:Name="PaneToggleBtn"
Width="48"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Click="PaneToggleBtn_Click"
Style="{StaticResource PaneToggleButtonStyle}" />
<StackPanel
x:Name="AppTitleBar"
Grid.Row="0"
Height="48"
Orientation="Horizontal">
<Image
Width="16"
Height="16"
Margin="16,0,0,0"
Source="ms-appx:///Assets/StoreLogo.png" />
<TextBlock
Margin="12,0,0,0"
@@ -35,6 +45,7 @@
<NavigationView
x:Name="NavView"
Grid.Row="1"
DisplayModeChanged="NavView_DisplayModeChanged"
IsBackButtonVisible="Collapsed"
IsSettingsVisible="False"
ItemInvoked="NavView_ItemInvoked"
@@ -46,28 +57,6 @@
<Thickness x:Key="NavigationViewHeaderMargin">15,0,0,0</Thickness>
</NavigationView.Resources>
<NavigationView.Header>
<BreadcrumbBar
x:Name="NavigationBreadcrumbBar"
MaxWidth="1000"
ItemClicked="NavigationBreadcrumbBar_ItemClicked"
ItemsSource="{x:Bind BreadCrumbs, Mode=OneWay}">
<BreadcrumbBar.ItemTemplate>
<DataTemplate x:DataType="local:Crumb">
<TextBlock Text="{x:Bind Label, Mode=OneWay}" />
</DataTemplate>
</BreadcrumbBar.ItemTemplate>
<BreadcrumbBar.Resources>
<ResourceDictionary>
<x:Double x:Key="BreadcrumbBarItemThemeFontSize">28</x:Double>
<Thickness x:Key="BreadcrumbBarChevronPadding">7,4,8,0</Thickness>
<FontWeight x:Key="BreadcrumbBarItemFontWeight">SemiBold</FontWeight>
<x:Double x:Key="BreadcrumbBarChevronFontSize">16</x:Double>
</ResourceDictionary>
</BreadcrumbBar.Resources>
</BreadcrumbBar>
</NavigationView.Header>
<NavigationView.MenuItems>
<NavigationViewItem
x:Uid="Settings_GeneralPage_NavigationViewItem_General"
@@ -85,6 +74,28 @@
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<BreadcrumbBar
x:Name="NavigationBreadcrumbBar"
Grid.Row="0"
MaxWidth="1000"
Margin="16,0,0,0"
ItemClicked="NavigationBreadcrumbBar_ItemClicked"
ItemsSource="{x:Bind BreadCrumbs, Mode=OneWay}">
<BreadcrumbBar.ItemTemplate>
<DataTemplate x:DataType="local:Crumb">
<TextBlock Text="{x:Bind Label, Mode=OneWay}" />
</DataTemplate>
</BreadcrumbBar.ItemTemplate>
<BreadcrumbBar.Resources>
<ResourceDictionary>
<x:Double x:Key="BreadcrumbBarItemThemeFontSize">28</x:Double>
<Thickness x:Key="BreadcrumbBarChevronPadding">7,4,8,0</Thickness>
<FontWeight x:Key="BreadcrumbBarItemFontWeight">SemiBold</FontWeight>
<x:Double x:Key="BreadcrumbBarChevronFontSize">16</x:Double>
</ResourceDictionary>
</BreadcrumbBar.Resources>
</BreadcrumbBar>
<Frame x:Name="NavFrame" Grid.Row="1" />
</Grid>
</NavigationView>