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] A11y improvements (#38840)

Browse Source 
This PR introduces the following changes:

- Adding the right a11y labels - as a result, Accesibility Insights is no longer flagging any errors: https://github.com/microsoft/PowerToys/issues/38395
- Removing and tweaking a few animations, addressing: https://github.com/microsoft/PowerToys/issues/38438
- Localization improvements
This commit is contained in:
Niels Laute
2025-04-17 15:51:40 +02:00
committed by GitHub
parent 05218e8af6
commit c04400e7df
5 changed files with 69 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/CommandBar.xaml
View File

@@ -36,7 +36,7 @@
<!-- Template for actions in the mode actions dropdown button -->
<DataTemplate x:Key="ContextMenuViewModelTemplate" x:DataType="viewmodels:CommandContextItemViewModel">
<Grid>
<Grid AutomationProperties.Name="{x:Bind Title, Mode=OneWay}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="32" />
<ColumnDefinition Width="*" />
@@ -63,27 +63,6 @@
Text="{x:Bind RequestedShortcut, Mode=OneWay, Converter={StaticResource KeyChordToStringConverter}}" />
</Grid>
</DataTemplate>
<animations:ImplicitAnimationSet x:Name="ShowAnimations">
<animations:OpacityAnimation
From="0"
To="1.0"
Duration="0:0:0.340" />
<animations:ScaleAnimation
From="0.85"
To="1"
Duration="0:0:0.350" />
</animations:ImplicitAnimationSet>
<animations:ImplicitAnimationSet x:Name="HideAnimations">
<animations:OpacityAnimation
From="1.0"
To="0"
Duration="0:0:0.240" />
<animations:ScaleAnimation
From="1"
To="0.85"
Duration="0:0:0.350" />
</animations:ImplicitAnimationSet>
</ResourceDictionary>
</UserControl.Resources>
@@ -135,9 +114,6 @@
<Button
x:Name="SettingsIconButton"
x:Uid="SettingsButton"
animations:Implicit.HideAnimations="{StaticResource HideAnimations}"
animations:Implicit.ShowAnimations="{StaticResource ShowAnimations}"
ui:VisualExtensions.NormalizedCenterPoint="0.5,0.5"
Style="{StaticResource SubtleButtonStyle}"
Tapped="SettingsIcon_Tapped"
Visibility="{x:Bind CurrentPageViewModel.IsNested, Mode=OneWay, Converter={StaticResource BoolToInvertedVisibilityConverter}}">
@@ -167,10 +143,8 @@
<Button
x:Name="PrimaryButton"
Padding="6,4,4,4"
animations:Implicit.HideAnimations="{StaticResource HideAnimations}"
animations:Implicit.ShowAnimations="{StaticResource ShowAnimations}"
ui:VisualExtensions.NormalizedCenterPoint="0.5,0.5"
x:Load="{x:Bind IsLoaded, Mode=OneWay}"
AutomationProperties.Name="{x:Bind ViewModel.PrimaryCommand.Name, Mode=OneWay}"
Background="Transparent"
Style="{StaticResource SubtleButtonStyle}"
Tapped="PrimaryButton_Tapped"
@@ -198,10 +172,8 @@
<Button
x:Name="SecondaryButton"
Padding="6,4,4,4"
animations:Implicit.HideAnimations="{StaticResource HideAnimations}"
animations:Implicit.ShowAnimations="{StaticResource ShowAnimations}"
ui:VisualExtensions.NormalizedCenterPoint="0.5,0.5"
x:Load="{x:Bind IsLoaded, Mode=OneWay}"
AutomationProperties.Name="{x:Bind ViewModel.SecondaryCommand.Name, Mode=OneWay}"
Style="{StaticResource SubtleButtonStyle}"
Tapped="SecondaryButton_Tapped"
Visibility="{x:Bind ViewModel.HasSecondaryCommand, Mode=OneWay}">
@@ -245,13 +217,10 @@
x:Name="MoreCommandsButton"
x:Uid="MoreCommandsButton"
Padding="4"
animations:Implicit.HideAnimations="{StaticResource HideAnimations}"
animations:Implicit.ShowAnimations="{StaticResource ShowAnimations}"
ui:VisualExtensions.NormalizedCenterPoint="0.5,0.5"
Content="{ui:FontIcon Glyph=&#xE712;,
FontSize=16}"
Style="{StaticResource SubtleButtonStyle}"
ToolTipService.ToolTip="Ctrl+k"
ToolTipService.ToolTip="Ctrl+K"
Visibility="{x:Bind ViewModel.ShouldShowContextMenu, Mode=OneWay}">
<Button.Flyout>
<Flyout Placement="TopEdgeAlignedRight">

2
src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/Tag.xaml
View File

@@ -38,6 +38,7 @@
<Setter Property="IsTabStop" Value="False" />
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="AutomationProperties.AutomationControlType" Value="Custom" />
<Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
<Setter Property="Padding" Value="{ThemeResource TagPadding}" />
<Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
@@ -56,6 +57,7 @@
Padding="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
VerticalAlignment="{TemplateBinding VerticalAlignment}"
AutomationProperties.Name="{TemplateBinding Text}"
Background="{TemplateBinding Background}"
BackgroundSizing="{TemplateBinding BackgroundSizing}"
BorderBrush="{TemplateBinding BorderBrush}"

24
src/modules/cmdpal/Microsoft.CmdPal.UI/ExtViews/ListPage.xaml
View File

@@ -28,21 +28,22 @@
NotEmptyValue="Visible" />
<DataTemplate x:Key="TagTemplate" x:DataType="viewmodels:TagViewModel">
<ItemContainer>
<cpcontrols:Tag
BackgroundColor="{x:Bind Background, Mode=OneWay}"
FontSize="12"
ForegroundColor="{x:Bind Foreground, Mode=OneWay}"
Icon="{x:Bind Icon, Mode=OneWay}"
Text="{x:Bind Text, Mode=OneWay}"
ToolTipService.ToolTip="{x:Bind ToolTip, Mode=OneWay}" />
</ItemContainer>
<cpcontrols:Tag
AutomationProperties.Name="{x:Bind Text, Mode=OneWay}"
BackgroundColor="{x:Bind Background, Mode=OneWay}"
FontSize="12"
ForegroundColor="{x:Bind Foreground, Mode=OneWay}"
Icon="{x:Bind Icon, Mode=OneWay}"
Text="{x:Bind Text, Mode=OneWay}"
ToolTipService.ToolTip="{x:Bind ToolTip, Mode=OneWay}" />
</DataTemplate>
<!-- https://learn.microsoft.com/windows/apps/design/controls/itemsview#specify-the-look-of-the-items -->
<DataTemplate x:Key="ListItemViewModelTemplate" x:DataType="viewmodels:ListItemViewModel">
<Grid Padding="0,12,0,12" ColumnSpacing="12">
<Grid
Padding="0,12,0,12"
AutomationProperties.Name="{x:Bind Title, Mode=OneWay}"
ColumnSpacing="12">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="28" />
<ColumnDefinition Width="*" />
@@ -55,6 +56,7 @@
Width="20"
Height="20"
Margin="4,0,4,0"
AutomationProperties.AccessibilityView="Raw"
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
SourceKey="{x:Bind Icon, Mode=OneWay}"
SourceRequested="{x:Bind help:IconCacheProvider.SourceRequested}" />

64
src/modules/cmdpal/Microsoft.CmdPal.UI/Pages/ShellPage.xaml
View File

@@ -41,6 +41,7 @@
<DataTemplate x:Key="TagTemplate" x:DataType="viewModels:TagViewModel">
<cpcontrols:Tag
HorizontalAlignment="Left"
AutomationProperties.Name="{x:Bind Text, Mode=OneWay}"
BackgroundColor="{x:Bind Background, Mode=OneWay}"
FontSize="12"
ForegroundColor="{x:Bind Foreground, Mode=OneWay}"
@@ -147,27 +148,36 @@
Visibility="{x:Bind ViewModel.CurrentPage.IsNested, Mode=OneWay, Converter={StaticResource BoolToInvertedVisibilityConverter}}">
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation
EasingMode="EaseIn"
EasingType="Cubic"
From="0"
To="1.0"
Duration="0:0:0.340" />
Duration="0:0:0.187" />
<animations:ScaleAnimation
EasingMode="EaseIn"
EasingType="Cubic"
From="0.5"
To="1"
Duration="0:0:0.350" />
Duration="0:0:0.187" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation
EasingMode="EaseOut"
EasingType="Cubic"
From="1.0"
To="0"
Duration="0:0:0.240" />
Duration="0:0:0.187" />
<animations:ScaleAnimation
EasingMode="EaseOut"
EasingType="Cubic"
From="1"
To="0.5"
Duration="0:0:0.350" />
Duration="0:0:0.187" />
</animations:Implicit.HideAnimations>
</Image>
<Button
x:Name="BackButton"
x:Uid="BackButton"
Margin="4,0,4,0"
Padding="4"
HorizontalAlignment="Center"
@@ -178,35 +188,42 @@
FontSize="16"
Style="{StaticResource SubtleButtonStyle}"
Tapped="BackButton_Tapped"
ToolTipService.ToolTip="Back"
Visibility="{x:Bind ViewModel.CurrentPage.IsNested, Mode=OneWay}">
<animations:Implicit.ShowAnimations>
<animations:OpacityAnimation
EasingMode="EaseIn"
EasingType="Cubic"
From="0"
To="1.0"
Duration="0:0:0.340" />
Duration="0:0:0.333" />
<animations:ScaleAnimation
From="0.5"
To="1"
Duration="0:0:0.350" />
Duration="0:0:0.333" />
<animations:TranslationAnimation
From="16,0,0"
To="0,0,0"
Duration="0:0:0.350" />
Duration="0:0:0.333" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation
EasingMode="EaseOut"
EasingType="Cubic"
From="1.0"
To="0"
Duration="0:0:0.340" />
Duration="0:0:0.333" />
<animations:ScaleAnimation
EasingMode="EaseOut"
EasingType="Cubic"
From="1"
To="0.5"
Duration="0:0:0.350" />
Duration="0:0:0.333" />
<animations:TranslationAnimation
EasingMode="EaseOut"
EasingType="Cubic"
From="0,0,0"
To="16,0,0"
Duration="0:0:0.350" />
Duration="0:0:0.187" />
</animations:Implicit.HideAnimations>
</Button>
<cpcontrols:IconBox
@@ -223,29 +240,29 @@
<animations:OpacityAnimation
From="0"
To="1.0"
Duration="0:0:0.450" />
Duration="0:0:0.333" />
<animations:ScaleAnimation
From="0.8"
To="1"
Duration="0:0:0.500" />
Duration="0:0:0.333" />
<animations:TranslationAnimation
From="8,0,0"
To="0,0,0"
Duration="0:0:0.400" />
Duration="0:0:0.187" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation
From="1.0"
To="0"
Duration="0:0:0.340" />
Duration="0:0:0.333" />
<animations:ScaleAnimation
From="1"
To="0.8"
Duration="0:0:0.350" />
Duration="0:0:0.333" />
<animations:TranslationAnimation
From="0,0,0"
To="8,0,0"
Duration="0:0:0.350" />
Duration="0:0:0.187" />
</animations:Implicit.HideAnimations>
</cpcontrols:IconBox>
</StackPanel>
@@ -272,13 +289,13 @@
<animations:OpacityAnimation
From="0"
To="1.0"
Duration="0:0:0.340" />
Duration="0:0:0.333" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation
From="1.0"
To="0"
Duration="0:0:0.340" />
Duration="0:0:0.333" />
</animations:Implicit.HideAnimations>
</ProgressBar>
@@ -313,21 +330,21 @@
<animations:OpacityAnimation
From="0"
To="1.0"
Duration="0:0:0.270" />
Duration="0:0:0.187" />
<animations:TranslationAnimation
From="24,0,0"
To="0,0,0"
Duration="0:0:0.280" />
Duration="0:0:0.187" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation
From="1.0"
To="0"
Duration="0:0:0.180" />
Duration="0:0:0.187" />
<animations:TranslationAnimation
From="0,0,0"
To="24,0,0"
Duration="0:0:0.220" />
Duration="0:0:0.187" />
</animations:Implicit.HideAnimations>
<Grid Margin="12">
<Grid.RowDefinitions>
@@ -343,6 +360,7 @@
MinHeight="64"
MaxHeight="96"
HorizontalAlignment="Center"
AutomationProperties.AccessibilityView="Raw"
SourceKey="{x:Bind ViewModel.Details.HeroImage, Mode=OneWay}"
SourceRequested="{x:Bind help:IconCacheProvider.SourceRequested}"
Visibility="{x:Bind HasHeroImage, Mode=OneWay}" />

12
src/modules/cmdpal/Microsoft.CmdPal.UI/Strings/en-us/Resources.resw
View File

@@ -379,9 +379,6 @@ Right-click to remove the key combination, thereby deactivating the shortcut.</v
<data name="Settings_GeneralPage_NavigationViewItem_Extensions.Content" xml:space="preserve">
<value>Extensions</value>
</data>
<data name="MoreCommandsButton.[using:Microsoft.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
<value>More commands</value>
</data>
<data name="SettingsButton.[using:Microsoft.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
<value>Open Command Palette settings</value>
</data>
@@ -397,4 +394,13 @@ Right-click to remove the key combination, thereby deactivating the shortcut.</v
<data name="Settings_GeneralPage_ShowSystemTrayIcon_SettingsCard.Description" xml:space="preserve">
<value>Choose if Command Palette is visible in the system tray</value>
</data>
<data name="BackButton.[using:Microsoft.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
<value>Back</value>
</data>
<data name="BackButton.[using:Microsoft.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
<value>Back</value>
</data>
<data name="MoreCommandsButton.[using:Microsoft.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
<value>More</value>
</data>
</root>