[FZ Editor] Accessibility fixes (#12651)

* Added Name to unicodes and fixed labels in dialog buttons * Fixed dialog padding * Update MainWindow.xaml * Update MainWindow.xaml Co-authored-by: Niels Laute <niels9001@hotmail.com>
2025-12-16 11:48:06 +01:00 · 2021-08-16 20:03:07 +02:00
parent e96c0da265
commit 784a4641f1
5 changed files with 542 additions and 517 deletions
--- a/src/modules/fancyzones/editor/FancyZonesEditor/CanvasEditor.xaml
+++ b/src/modules/fancyzones/editor/FancyZonesEditor/CanvasEditor.xaml
@@ -3,7 +3,6 @@
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:local="clr-namespace:FancyZonesEditor"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid x:Name="Body">
--- a/src/modules/fancyzones/editor/FancyZonesEditor/CanvasEditorWindow.xaml
+++ b/src/modules/fancyzones/editor/FancyZonesEditor/CanvasEditorWindow.xaml
@@ -8,12 +8,12 @@
                    xmlns:props="clr-namespace:FancyZonesEditor.Properties"
                    mc:Ignorable="d"
                    Title=""
-                    Width="320"
+                    MinWidth="360"
                    BorderThickness="0"
                    xmlns:ui="http://schemas.modernwpf.com/2019"
                    ui:WindowHelper.UseModernWindowStyle="True"
                    ui:TitleBar.IsIconVisible="False"
-                    SizeToContent="Height"
+                    SizeToContent="Width"
                    Background="{DynamicResource PrimaryBackgroundBrush}"
                    ResizeMode="NoResize"
                    WindowStartupLocation="CenterOwner"
--- a/src/modules/fancyzones/editor/FancyZonesEditor/GridEditorWindow.xaml
+++ b/src/modules/fancyzones/editor/FancyZonesEditor/GridEditorWindow.xaml
@@ -8,12 +8,12 @@
                    xmlns:props="clr-namespace:FancyZonesEditor.Properties"
                    mc:Ignorable="d"
                    Title=""
-                    Width="320"
+                    MinWidth="360"
                    BorderThickness="0"
                    xmlns:ui="http://schemas.modernwpf.com/2019"
                    ui:WindowHelper.UseModernWindowStyle="True"
                    ui:TitleBar.IsIconVisible="False"
-                    SizeToContent="Height"
+                    SizeToContent="Width"
                    Background="{DynamicResource PrimaryBackgroundBrush}"
                    ResizeMode="NoResize"
                    WindowStartupLocation="CenterOwner"
--- a/src/modules/fancyzones/editor/FancyZonesEditor/MainWindow.xaml
+++ b/src/modules/fancyzones/editor/FancyZonesEditor/MainWindow.xaml
@@ -25,7 +25,8 @@
        Closing="OnClosing"
        ResizeMode="CanResize">
    <Window.Resources>
-
+        <Thickness x:Key="ContentDialogPadding">24,18,0,24</Thickness>
+        <Thickness x:Key="ContentDialogCommandSpaceMargin">0,24,24,0</Thickness>
        <Converters:LayoutModelTypeToVisibilityConverter x:Key="LayoutModelTypeToVisibilityConverter" />
        <Converters:LayoutTypeCustomToVisibilityConverter x:Key="LayoutTypeCustomToVisibilityConverter" />
        <Converters:LayoutTypeTemplateToVisibilityConverter x:Key="LayoutTypeTemplateToVisibilityConverter" />
@@ -141,10 +142,7 @@
                                         VerticalAlignment="Stretch"
                                         HorizontalAlignment="Stretch" />
                </Grid>
-                <Button Content="&#xE104;"
-                        x:Name="EditLayoutButton"
-                        FontFamily="Segoe MDL2 Assets"
-                        FontSize="14"
+                <Button x:Name="EditLayoutButton"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Top"
                        Margin="4"
@@ -161,7 +159,14 @@
                        AutomationProperties.HelpText="{x:Static props:Resources.Edit}"
                        AutomationProperties.Name="{Binding Name}"
                        Style="{StaticResource AccentButtonStyle}"
-                        ui:ControlHelper.CornerRadius="36" />
+                        ui:ControlHelper.CornerRadius="36">
+                    <Button.Content>
+                        <TextBlock Text="&#xE104;" 
+                                       FontFamily="Segoe MDL2 Assets"
+                                        FontSize="14"
+                                       AutomationProperties.Name="{x:Static props:Resources.Edit}" />
+                    </Button.Content>
+                </Button>
            </Grid>
        </DataTemplate>
    </Window.Resources>
@@ -283,11 +288,12 @@
                <StackPanel Orientation="Horizontal"
                            Margin="8">
                    <TextBlock Text="&#xE109;"
+                               AutomationProperties.Name="{x:Static props:Resources.Create_new_layout}"
                               FontFamily="Segoe MDL2 Assets"
-                               Foreground="White" />
+                               Foreground="{DynamicResource AccentButtonForeground}" />
                    <TextBlock Text="{x:Static props:Resources.Create_new_layout}"
                               Margin="12,-3,0,0"
-                               Foreground="White" />
+                               Foreground="{DynamicResource AccentButtonForeground}" />
                </StackPanel>
                <Button.Effect>
                    <DropShadowEffect BlurRadius="6"
@@ -338,7 +344,7 @@
                          Opened="Dialog_Opened"
                          Closed="Dialog_Closed">
            <Grid DataContext="{Binding SelectedModel}"
-                  MinWidth="320" Margin="4,4,4,32">
+                  MinWidth="320" Margin="4,4,24,32">

                <StackPanel Margin="0,-37,0,0"
                            HorizontalAlignment="Right"
@@ -348,32 +354,43 @@
                            x:Name="duplicateLayoutButton"
                            AutomationProperties.Name="{x:Static props:Resources.Duplicate}"
                            ToolTip="{x:Static props:Resources.Duplicate}"
-                            Content="&#xE8C8;"
-                            FontFamily="Segoe MDL2 Assets"
                            Style="{StaticResource IconOnlyButtonStyle}"
-                            Visibility="{Binding Path=Type, Converter={StaticResource LayoutTypeCustomToVisibilityConverter}}" />

+                            Visibility="{Binding Path=Type, Converter={StaticResource LayoutTypeCustomToVisibilityConverter}}">
+                        <Button.Content>
+                            <TextBlock Text="&#xE8C8;" 
+                                       FontFamily="Segoe MDL2 Assets"
+                                       AutomationProperties.Name="{x:Static props:Resources.Duplicate}" />
+                        </Button.Content>
+                    </Button>
                    <!--Used by narrator for announcements-->
                    <TextBlock x:Name="LayoutCreationAnnounce" />
-                    
                    <Button Click="DuplicateLayout_Click"
                            x:Name="createFromTemplateLayoutButton"
                            AutomationProperties.Name="{x:Static props:Resources.Create_Custom_From_Template}"
                            ToolTip="{x:Static props:Resources.Create_Custom_From_Template}"
-                            Content="&#xE8C8;"
-                            FontFamily="Segoe MDL2 Assets"
                            Style="{StaticResource IconOnlyButtonStyle}"
-                            Visibility="{Binding Path=Type, Converter={StaticResource LayoutTypeTemplateToVisibilityConverter}}" />
+                            Visibility="{Binding Path=Type, Converter={StaticResource LayoutTypeTemplateToVisibilityConverter}}">
+                        <Button.Content>
+                            <TextBlock Text="&#xE8C8;" 
+                                       FontFamily="Segoe MDL2 Assets"
+                                       AutomationProperties.Name="{x:Static props:Resources.Create_Custom_From_Template}" />
+                        </Button.Content>
+                    </Button>

-                    <Button Click="DeleteLayout_Click"
+                        <Button Click="DeleteLayout_Click"
                            x:Name="deleteLayoutButton"
                            AutomationProperties.Name="{x:Static props:Resources.Delete}"
                            ToolTip="{x:Static props:Resources.Delete}"   
-                            Content="&#xE107;"
-                            FontFamily="Segoe MDL2 Assets"
-                            Foreground="#c50500"
                            Style="{StaticResource IconOnlyButtonStyle}"
-                            Visibility="{Binding Path=Type, Converter={StaticResource LayoutTypeCustomToVisibilityConverter}}" />
+                            Visibility="{Binding Path=Type, Converter={StaticResource LayoutTypeCustomToVisibilityConverter}}">
+                        <Button.Content>
+                            <TextBlock Text="&#xE107;" 
+                                       FontFamily="Segoe MDL2 Assets"
+                                       Foreground="#c50500"
+                                       AutomationProperties.Name="{x:Static props:Resources.Delete}" />
+                        </Button.Content>
+                    </Button>
                </StackPanel>

                <StackPanel>
@@ -386,6 +403,7 @@
                                   ToolTip="{x:Static props:Resources.Name}"
                                   FontSize="16"
                                   VerticalAlignment="Bottom" Margin="0,0,0,8"
+                                   AutomationProperties.Name="{x:Static props:Resources.Name}"
                                   Text="&#xE932;" />
                        <TextBox Text="{Binding Name}"
                                 ui:ControlHelper.PlaceholderText="{x:Static props:Resources.Name}"
@@ -394,7 +412,9 @@
                                 ui:ControlHelper.Header="{x:Static props:Resources.Name}"
                                 MinWidth="286"
                                 HorizontalAlignment="Stretch"
-                                 GotKeyboardFocus="TextBox_GotKeyboardFocus"/>
+                                 GotKeyboardFocus="TextBox_GotKeyboardFocus" />
+
+              
                    </StackPanel>

                    <!-- Shortcut panel -->
@@ -410,6 +430,7 @@
                                       Margin="8,4,0,0"
                                       Foreground="{DynamicResource SystemControlBackgroundAccentBrush}"
                                       Text="&#xE946;"
+                                       AutomationProperties.Name="{x:Static props:Resources.QuickKey_Description}"
                                       ToolTip="{x:Static props:Resources.QuickKey_Description}" />
                        </StackPanel>

@@ -420,6 +441,7 @@
                                       VerticalAlignment="Center"
                                       FontSize="16"
                                       ToolTip="{x:Static props:Resources.QuickKey_Title}"
+                                       AutomationProperties.Name="{x:Static props:Resources.QuickKey_Title}"
                                       Text="&#xEDA7;" />

                            <ComboBox x:Name="quickKeySelectionComboBox"
@@ -471,6 +493,7 @@
                                   VerticalAlignment="Center"
                                   FontSize="16"
                                   Margin="0,16,0,0"
+                                   AutomationProperties.Name="{x:Static props:Resources.Number_of_zones}"
                                   ToolTip="{x:Static props:Resources.Number_of_zones}"
                                   Text="&#xECA5;" />

@@ -496,6 +519,7 @@
                            <TextBlock FontFamily="Segoe MDL2 Assets"
                                       VerticalAlignment="Center"
                                       FontSize="16"
+                                       AutomationProperties.Name="{x:Static props:Resources.Space_Around_Zones}"
                                       ToolTip="{x:Static props:Resources.Space_Around_Zones}"
                                       Text="&#xE91B;" />

@@ -548,6 +572,7 @@
                                       VerticalAlignment="Center"
                                       FontSize="16"
                                       ToolTip="{x:Static props:Resources.Distance_adjacent_zones}"
+                                        AutomationProperties.Name="{x:Static props:Resources.Distance_adjacent_zones}"
                                       Text="&#xF617;" />

                            <ui:NumberBox Text="{Binding SensitivityRadius}"
@@ -607,6 +632,7 @@
                                       FontSize="16"
                                       Foreground="{DynamicResource SystemControlBackgroundAccentBrush}"
                                       Margin="0,4,0,0"
+                                       AutomationProperties.Name="{x:Static props:Resources.Layout_Grid_Title}"
                                       HorizontalAlignment="Left"
                                       FontFamily="Segoe MDL2 Assets" />
                            <StackPanel Grid.Column="1"
@@ -641,6 +667,7 @@
                            <TextBlock Text="&#xF5ED;"
                                       FontSize="16"
                                       Foreground="{DynamicResource SystemControlBackgroundAccentBrush}"
+                                       AutomationProperties.Name="{x:Static props:Resources.Layout_Canvas_Title}"
                                       Margin="0,4,0,0"
                                       HorizontalAlignment="Left"
                                       FontFamily="Segoe MDL2 Assets" />
--- a/src/modules/fancyzones/editor/FancyZonesEditor/Styles/ButtonStyles.xaml
+++ b/src/modules/fancyzones/editor/FancyZonesEditor/Styles/ButtonStyles.xaml
@@ -1,8 +1,6 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:ui="http://schemas.modernwpf.com/2019"
-                    xmlns:primitives="clr-namespace:ModernWpf.Controls.Primitives"
-                    xmlns:local="clr-namespace:FancyZonesEditor.Styles">
+                    xmlns:ui="http://schemas.modernwpf.com/2019">
    
    <Style x:Key="LayoutTypeRadioButtonStyle" TargetType="RadioButton">
        <Setter Property="OverridesDefaultStyle" Value="True" />
@@ -155,4 +153,5 @@
            </Setter.Value>
        </Setter>
    </Style>
+
 </ResourceDictionary>