Skip to content

Commit 5049be3

Browse files
wang563681252wang563681252
authored
Fix Accessibility Bug (#526)
1 parent 5c9bace commit 5049be3

File tree

10 files changed

+58
-21
lines changed

10 files changed

+58
-21
lines changed

‎AIDevGallery/Controls/ModelPicker/ModelOrApiPicker.xaml‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,8 @@
175175
AutomationProperties.Name="More info"
176176
Content="{x:Bind utils:AppUtils.GetHardwareAcceleratorString((models:HardwareAccelerator))}"
177177
Style="{StaticResource TertiaryButtonStyle}"
178-
ToolTipService.ToolTip="More info">
178+
ToolTipService.ToolTip="More info"
179+
Background="{ThemeResource ButtonBackground}">
179180
<Button.Flyout>
180181
<Flyout ShouldConstrainToRootBounds="False">
181182
<TextBlock
@@ -204,7 +205,7 @@
204205
Style="{StaticResource AccentButtonStyle}">
205206
<StackPanel Orientation="Vertical" Spacing="4">
206207
<FontIcon FontSize="14" Glyph="&#xE72A;" />
207-
<TextBlock Text="Run sample" />
208+
<TextBlock Text="Run sample" TextWrapping="Wrap"/>
208209
</StackPanel>
209210
</Button>
210211
</Grid>

‎AIDevGallery/Controls/ModelPicker/ModelPickerViews/OnnxPickerView.xaml‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
xmlns:ui="using:CommunityToolkit.WinUI"
1515
xmlns:utils="using:AIDevGallery.Utils"
1616
xmlns:vm="using:AIDevGallery.ViewModels"
17+
xmlns:controls="using:Microsoft.UI.Xaml.Controls"
1718
mc:Ignorable="d">
1819

1920
<Grid>
@@ -40,7 +41,7 @@
4041
Grid.Row="1"
4142
TextWrapping="Wrap"
4243
Text="To use a custom model, convert it to a WindowsML-compatible format using the AI Toolkit conversion tool. Note: Currently, only select models are supported for conversion in AI Toolkit, with additional models coming soon." />
43-
<StackPanel Orientation="Horizontal" Spacing="12">
44+
<controls:WrapPanel Orientation="Horizontal" HorizontalSpacing="12" VerticalSpacing="12">
4445
<Button
4546
x:Name="OpenAIToolkitButton"
4647
Click="OpenAIToolkitButton_Click"
@@ -65,7 +66,7 @@
6566
<TextBlock Text="View documentation" Margin="5,0,0,0" />
6667
</StackPanel>
6768
</Button>
68-
</StackPanel>
69+
</controls:WrapPanel>
6970
</StackPanel>
7071
<StackPanel
7172
Margin="0,12"
@@ -149,7 +150,8 @@
149150
Content="{x:Bind utils:AppUtils.GetHardwareAcceleratorString((models:HardwareAccelerator))}"
150151
Style="{StaticResource TertiaryButtonStyle}"
151152
Tapped="StopPropagatingHandler"
152-
ToolTipService.ToolTip="More info">
153+
ToolTipService.ToolTip="More info"
154+
Background="{ThemeResource ButtonBackground}">
153155
<Button.Flyout>
154156
<Flyout ShouldConstrainToRootBounds="False">
155157
<TextBlock
@@ -321,7 +323,8 @@
321323
AutomationProperties.Name="More info"
322324
Content="{x:Bind utils:AppUtils.GetHardwareAcceleratorString((models:HardwareAccelerator))}"
323325
Style="{StaticResource TertiaryButtonStyle}"
324-
ToolTipService.ToolTip="More info">
326+
ToolTipService.ToolTip="More info"
327+
Background="{ThemeResource ButtonBackground}">
325328
<Button.Flyout>
326329
<Flyout ShouldConstrainToRootBounds="False">
327330
<TextBlock

‎AIDevGallery/Pages/APIs/APIOverview.xaml‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@
118118
ItemsSource="{x:Bind wcrAPIs, Mode=OneWay}"
119119
SelectionMode="None">
120120
<ItemsView.Layout>
121-
<UniformGridLayout MinColumnSpacing="12" MinRowSpacing="12" />
121+
<FlowLayout MinColumnSpacing="12" MinRowSpacing="12" />
122122
</ItemsView.Layout>
123123
<ItemsView.ItemTemplate>
124124
<DataTemplate x:DataType="models:ApiDefinition">
@@ -128,8 +128,8 @@
128128
AutomationProperties.Name="{x:Bind Name}"
129129
CornerRadius="8">
130130
<Grid
131-
Width="260"
132-
Height="186"
131+
MinHeight="186"
132+
MinWidth="260"
133133
Padding="20,6,12,6"
134134
VerticalAlignment="Stretch"
135135
ColumnSpacing="20"
@@ -139,8 +139,8 @@
139139
<Grid.RowDefinitions>
140140
<RowDefinition Height="Auto" />
141141
<RowDefinition Height="Auto" />
142-
<RowDefinition Height="*" />
143142
<RowDefinition Height="Auto" />
143+
<RowDefinition Height="*" />
144144
</Grid.RowDefinitions>
145145
<FontIcon
146146
Margin="0,24,0,8"
@@ -156,10 +156,12 @@
156156
<TextBlock
157157
Grid.Row="2"
158158
Margin="0,8,0,0"
159-
VerticalAlignment="Top"
159+
VerticalAlignment="Center"
160+
FontWeight="SemiBold"
160161
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
161162
Text="{x:Bind Description}"
162163
TextTrimming="CharacterEllipsis"
164+
LineStackingStrategy="MaxHeight"
163165
TextWrapping="Wrap" />
164166
</Grid>
165167
</ItemContainer>

‎AIDevGallery/Pages/APIs/APISelectionPage.xaml.cs‎

Lines changed: 27 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
using AIDevGallery.Models;
55
using AIDevGallery.Samples;
66
using AIDevGallery.Telemetry.Events;
7+
using Microsoft.UI.Xaml;
78
using Microsoft.UI.Xaml.Controls;
89
using Microsoft.UI.Xaml.Navigation;
910
using System.Collections.Generic;
@@ -41,6 +42,28 @@ protected override void OnNavigatedTo(NavigationEventArgs e)
4142
};
4243
}
4344

45+
private static string GetContentText(object? content)
46+
{
47+
return content switch
48+
{
49+
string s => s,
50+
TextBlock tb => tb.Text,
51+
_ => string.Empty
52+
};
53+
}
54+
55+
private static TextBlock CreateWrappedText(string text)
56+
{
57+
return new TextBlock
58+
{
59+
Text = text,
60+
TextWrapping = TextWrapping.Wrap,
61+
MaxLines = 3,
62+
TextTrimming = TextTrimming.None,
63+
Margin = new Thickness(0, 0, 8, 0)
64+
};
65+
}
66+
4467
private void SetupAPIs()
4568
{
4669
if (ModelTypeHelpers.ParentMapping.TryGetValue(ModelType.WCRAPIs, out List<ModelType>? innerItems))
@@ -51,19 +74,19 @@ private void SetupAPIs()
5174
{
5275
if (!string.IsNullOrWhiteSpace(apiDefinition.Category))
5376
{
54-
NavigationViewItem? existingItem = NavView.MenuItems.OfType<NavigationViewItem>().FirstOrDefault(i => i.Content is string name && name == apiDefinition.Category);
77+
NavigationViewItem? existingItem = NavView.MenuItems.OfType<NavigationViewItem>().FirstOrDefault(i => GetContentText(i.Content) == apiDefinition.Category);
5578

5679
if (existingItem == null)
5780
{
58-
existingItem = new NavigationViewItem() { Content = apiDefinition.Category, Icon = new FontIcon() { Glyph = "\uF0E2" }, SelectsOnInvoked = false, IsExpanded = true };
81+
existingItem = new NavigationViewItem() { Content = CreateWrappedText(apiDefinition.Category), Icon = new FontIcon() { Glyph = "\uF0E2" }, SelectsOnInvoked = false, IsExpanded = true };
5982
NavView.MenuItems.Add(existingItem);
6083
}
6184

62-
existingItem.MenuItems.Add(new NavigationViewItem() { Content = apiDefinition.Name, Icon = new FontIcon() { Glyph = apiDefinition.IconGlyph }, Tag = item });
85+
existingItem.MenuItems.Add(new NavigationViewItem() { Content = CreateWrappedText(apiDefinition.Name), Icon = new FontIcon() { Glyph = apiDefinition.IconGlyph }, Tag = item });
6386
}
6487
else
6588
{
66-
NavView.MenuItems.Add(new NavigationViewItem() { Content = apiDefinition.Name, Icon = new FontIcon() { Glyph = apiDefinition.IconGlyph }, Tag = item });
89+
NavView.MenuItems.Add(new NavigationViewItem() { Content = CreateWrappedText(apiDefinition.Name), Icon = new FontIcon() { Glyph = apiDefinition.IconGlyph }, Tag = item });
6790
}
6891
}
6992
}

‎AIDevGallery/Pages/Scenarios/ScenarioPage.xaml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@
164164
x:Name="WinMlModelOptionsButton"
165165
Padding="0"
166166
Visibility="Collapsed"
167-
AutomationProperties.Name="WinMl Model Options Button">
167+
AutomationProperties.Name="WinMl Model Options">
168168
<Button.Flyout>
169169
<Flyout
170170
x:Name="WinMLOptionsFlyout"

‎AIDevGallery/Samples/Open Source Models/Embeddings/SemanticSuggest.xaml‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
xmlns:shared="using:AIDevGallery.Samples.SharedCode"
1010
mc:Ignorable="d">
1111
<Grid>
12-
<shared:SemanticComboBox x:Name="MySemanticComboBox" Items="{x:Bind ShoppingCategories}"/>
12+
<shared:SemanticComboBox x:Name="MySemanticComboBox"
13+
Items="{x:Bind ShoppingCategories}"
14+
IsTabStop="False"/>
1315
</Grid>
1416
</samples:BaseSamplePage>

‎AIDevGallery/Samples/Open Source Models/Image Models/YOLOv4/YOLOObjectionDetection.xaml‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
<Image
2525
x:Name="DefaultImage"
2626
MaxWidth="800"
27-
MaxHeight="500" />
27+
MaxHeight="500"/>
2828
</Viewbox>
2929
<ProgressRing
3030
x:Name="Loader"
@@ -41,8 +41,11 @@
4141
<Button
4242
x:Name="UploadButton"
4343
Padding="8"
44+
Margin="4"
4445
AutomationProperties.Name="Select image"
4546
Click="UploadButton_Click"
47+
IsTabStop="True"
48+
UseSystemFocusVisuals="True"
4649
ToolTipService.ToolTip="Select image">
4750

4851
<FontIcon FontSize="16" Glyph="&#xEE71;" />

‎AIDevGallery/Samples/Open Source Models/Image Models/YOLOv4/YOLOObjectionDetection.xaml.cs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -157,7 +157,7 @@ private async Task DetectObjects(string filePath)
157157
UploadButton.Visibility = Visibility.Collapsed;
158158

159159
DefaultImage.Source = new BitmapImage(new Uri(filePath));
160-
NarratorHelper.AnnounceImageChanged(DefaultImage, "Image changed: new upload."); // <exclude-line>
160+
NarratorHelper.AnnounceImageChanged(DefaultImage, "Photo changed: new upload."); // <exclude-line>
161161

162162
Bitmap image = new(filePath);
163163

@@ -228,7 +228,7 @@ private async Task DetectObjects(string filePath)
228228
UploadButton.Visibility = Visibility.Visible;
229229
});
230230

231-
NarratorHelper.AnnounceImageChanged(DefaultImage, "Image changed: objects detected."); // <exclude-line>
231+
NarratorHelper.AnnounceImageChanged(DefaultImage, "Photo changed: objects detected."); // <exclude-line>
232232
image.Dispose();
233233
}
234234
}

‎AIDevGallery/Samples/Open Source Models/Language Models/SmartText.xaml‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
<shared:SmartTextBox
1414
x:Name="SmartTextBox"
1515
Text="This is the Smart Text Box control. It exposes generative AI actions through a selection flyout menu. Try it out by highlighting some text to display the menu."
16-
Margin="0,32,0,0"/>
16+
Margin="0,32,0,0"
17+
IsTabStop="False"/>
1718
</Grid>
1819
</samples:BaseSamplePage>

‎AIDevGallery/Samples/Open Source Models/Multimodal Models/DescribeImage.xaml.cs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -171,6 +171,8 @@ private async void LoadButton_Click(object sender, RoutedEventArgs e)
171171

172172
await DescribeTheImage();
173173
}
174+
175+
LoadImageButton.Focus(FocusState.Programmatic);
174176
}
175177

176178
private async void Button_Click(object sender, RoutedEventArgs e)

0 commit comments

Comments
 (0)