Mirrors/PowerToys
1
0
Fork 0
mirror of https://github.com/microsoft/PowerToys.git synced 2026-04-03 17:56:44 +02:00
Code Issues Packages Projects Releases Wiki Activity

[CmdPal] Settings UI polishing (#38094)

Browse Source 
<!-- 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
Download Patch File Download Diff File Expand all files Collapse all files

20
src/modules/cmdpal/Microsoft.CmdPal.UI/Helpers/WindowExtensions.cs Normal file
View File

@@ -0,0 +1,20 @@
// Copyright (c) Microsoft Corporation
// The Microsoft Corporation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using Microsoft.UI;
using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml;
namespace Microsoft.CmdPal.UI.Helpers;
public static class WindowExtensions
{
public static void SetIcon(this Window window)
{
var hWnd = WinRT.Interop.WindowNative.GetWindowHandle(window);
WindowId windowId = Win32Interop.GetWindowIdFromWindow(hWnd);
AppWindow appWindow = AppWindow.GetFromWindowId(windowId);
appWindow.SetIcon(@"Assets\icon.ico");
}
}

2
src/modules/cmdpal/Microsoft.CmdPal.UI/MainWindow.xaml.cs
View File

@@ -8,6 +8,7 @@ using Microsoft.CmdPal.Common.Helpers;
using Microsoft.CmdPal.Common.Messages;
using Microsoft.CmdPal.Common.Services;
using Microsoft.CmdPal.UI.Events;
using Microsoft.CmdPal.UI.Helpers;
using Microsoft.CmdPal.UI.ViewModels;
using Microsoft.CmdPal.UI.ViewModels.Messages;
using Microsoft.Extensions.DependencyInjection;
@@ -71,6 +72,7 @@ public sealed partial class MainWindow : Window,
// notification area icon back
WM_TASKBAR_RESTART = PInvoke.RegisterWindowMessage("TaskbarCreated");
this.SetIcon();
AppWindow.Title = RS_.GetString("AppName");
AppWindow.Resize(new SizeInt32 { Width = 1000, Height = 620 });
PositionCentered();

4
src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/ExtensionPage.xaml
View File

@@ -41,8 +41,8 @@
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="1" Padding="0,0,8,0">
<Grid Padding="8,-8,8,8">
<ScrollViewer Grid.Row="1">
<Grid Padding="16">
<StackPanel
MaxWidth="1000"
HorizontalAlignment="Stretch"

4
src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/ExtensionsPage.xaml
View File

@@ -19,8 +19,8 @@
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="1" Padding="0,0,8,0">
<Grid Padding="8,16,8,8">
<ScrollViewer Grid.Row="1">
<Grid Padding="16">
<StackPanel
MaxWidth="1000"
HorizontalAlignment="Stretch"

4
src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/GeneralPage.xaml
View File

@@ -17,8 +17,8 @@
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="1" Padding="0,0,8,0">
<Grid Padding="8,16,8,8">
<ScrollViewer Grid.Row="1">
<Grid Padding="16">
<StackPanel
MaxWidth="1000"
HorizontalAlignment="Stretch"

59
src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/SettingsWindow.xaml
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>

24
src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/SettingsWindow.xaml.cs
View File

@@ -4,6 +4,7 @@
using System.Collections.ObjectModel;
using CommunityToolkit.Mvvm.Messaging;
using Microsoft.CmdPal.UI.Helpers;
using Microsoft.CmdPal.UI.ViewModels;
using Microsoft.CmdPal.UI.ViewModels.Messages;
using Microsoft.UI.Windowing;
@@ -24,7 +25,7 @@ public sealed partial class SettingsWindow : Window,
{
this.InitializeComponent();
this.ExtendsContentIntoTitleBar = true;
this.AppWindow.SetIcon("ms-appx:///Assets/Icons/StoreLogo.png");
this.SetIcon();
this.AppWindow.Title = RS_.GetString("SettingsWindowTitle");
this.AppWindow.TitleBar.PreferredHeightOption = TitleBarHeightOption.Tall;
PositionCentered();
@@ -110,6 +111,27 @@ public sealed partial class SettingsWindow : Window,
WeakReferenceMessenger.Default.Send<SettingsWindowClosedMessage>();
}
private void PaneToggleBtn_Click(object sender, RoutedEventArgs e)
{
NavView.IsPaneOpen = !NavView.IsPaneOpen;
}
private void NavView_DisplayModeChanged(NavigationView sender, NavigationViewDisplayModeChangedEventArgs args)
{
if (args.DisplayMode == NavigationViewDisplayMode.Compact || args.DisplayMode == NavigationViewDisplayMode.Minimal)
{
PaneToggleBtn.Visibility = Visibility.Visible;
NavView.IsPaneToggleButtonVisible = false;
AppTitleBar.Margin = new Thickness(48, 0, 0, 0);
}
else
{
PaneToggleBtn.Visibility = Visibility.Collapsed;
NavView.IsPaneToggleButtonVisible = true;
AppTitleBar.Margin = new Thickness(16, 0, 0, 0);
}
}
public void Receive(QuitMessage message)
{
// This might come in on a background thread

7
src/modules/cmdpal/Microsoft.CmdPal.UI/ToastWindow.xaml.cs
View File

@@ -4,19 +4,16 @@
using CommunityToolkit.Mvvm.Messaging;
using CommunityToolkit.WinUI;
using Microsoft.CmdPal.UI.Helpers;
using Microsoft.CmdPal.UI.ViewModels;
using Microsoft.CmdPal.UI.ViewModels.Messages;
using Microsoft.UI.Composition;
using Microsoft.UI.Composition.SystemBackdrops;
using Microsoft.UI.Dispatching;
using Microsoft.UI.Windowing;
using Microsoft.UI.Xaml;
using Windows.Graphics;
using Windows.UI;
using Windows.Win32;
using Windows.Win32.Foundation;
using Windows.Win32.UI.WindowsAndMessaging;
using WinRT;
using RS_ = Microsoft.CmdPal.UI.Helpers.ResourceLoaderInstance;
namespace Microsoft.CmdPal.UI;
@@ -37,7 +34,7 @@ public sealed partial class ToastWindow : Window,
AppWindow.IsShownInSwitchers = false;
ExtendsContentIntoTitleBar = true;
AppWindow.SetPresenter(AppWindowPresenterKind.CompactOverlay);
AppWindow.SetIcon("ms-appx:///Assets/Icons/StoreLogo.png");
this.SetIcon();
AppWindow.Title = RS_.GetString("ToastWindowTitle");
AppWindow.TitleBar.PreferredHeightOption = TitleBarHeightOption.Collapsed;