[Accessibility] Added Mode attached property to easily group or exclude views from VoiceOver/TalkBack.

CHANGELOG.md

@@ -1,3 +1,6 @@
+## [53.8.0]
+- [Accessibility] Added `Mode` attached property.
+
 ## [53.7.4]
 - Fix error causing index out of range in `TabBadgeService` when tabs have changed 
 

src/app/Components/AccessibilitySamples/VoiceOverSamples/GroupChildrenSamples.xaml

@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<dui:ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                 xmlns:dui="http://dips.com/mobile.ui"
+                 xmlns:localizedStrings="clr-namespace:Components.Resources.LocalizedStrings"
+                 x:Class="Components.AccessibilitySamples.VoiceOverSamples.GroupChildrenSamples"
+                 Title="{x:Static localizedStrings:LocalizedStrings.VoiceOver_GroupChildren_Title}">
+
+    <dui:ScrollView Padding="{dui:Sizes size_4}">
+        <dui:VerticalStackLayout Spacing="{dui:Sizes size_5}">
+
+            <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_GroupChildren_Description}"
+                       Style="{dui:Styles Label=UI200}"
+                       TextColor="{dui:Colors color_text_default}" />
+
+            <dui:VerticalStackLayout Spacing="{dui:Sizes size_2}">
+                <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_Example}"
+                           Style="{dui:Styles Label=SectionHeader}" />
+
+                <dui:VerticalStackLayout Spacing="{dui:Sizes size_1}">
+                    <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_WithoutGrouping}"
+                               Style="{dui:Styles Label=UI300}"
+                               TextColor="{dui:Colors color_text_default}" />
+                    <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_SwipeGestures}"
+                               Style="{dui:Styles Label=UI100}"
+                               TextColor="{dui:Colors color_text_subtle}" />
+
+                    <dui:VerticalStackLayout Spacing="{dui:Sizes size_1}"
+                                             Padding="{dui:Sizes size_3}"
+                                             BackgroundColor="{dui:Colors color_surface_subtle}"
+                                             dui:Layout.AutoCornerRadius="True">
+                        <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_Name}"
+                                   Style="{dui:Styles Label=SectionHeader}" />
+                        <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_Born}"
+                                   Style="{dui:Styles Label=UI200}" />
+                        <dui:HorizontalStackLayout Spacing="{dui:Sizes size_1}">
+                            <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_Phone}"
+                                       Style="{dui:Styles Label=UI200}" />
+                            <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_PhoneNumber}"
+                                       Style="{dui:Styles Label=UI200}" />
+                        </dui:HorizontalStackLayout>
+                        <dui:Label Text="john.doe@example.com"
+                                   Style="{dui:Styles Label=UI200}" />
+                    </dui:VerticalStackLayout>
+                </dui:VerticalStackLayout>
+
+                <!-- With GroupChildren -->
+                <dui:VerticalStackLayout Spacing="{dui:Sizes size_1}">
+                    <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_WithGrouping}"
+                               Style="{dui:Styles Label=UI300}"
+                               TextColor="{dui:Colors color_text_default}" />
+
+                    <dui:VerticalStackLayout Spacing="{dui:Sizes size_1}"
+                                             Padding="{dui:Sizes size_3}"
+                                             BackgroundColor="{dui:Colors color_surface_subtle}"
+                                             dui:Layout.AutoCornerRadius="True"
+                                             dui:Accessibility.Mode="GroupChildren">
+                        <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_Name}"
+                                   Style="{dui:Styles Label=Body400}" />
+                        <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_Born}"
+                                   Style="{dui:Styles Label=UI200}" />
+                        <dui:HorizontalStackLayout Spacing="{dui:Sizes size_1}">
+                            <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_Phone}"
+                                       Style="{dui:Styles Label=UI200}" />
+                            <dui:Label Text="{x:Static localizedStrings:LocalizedStrings.VoiceOver_PatientCard_PhoneNumber}"
+                                       Style="{dui:Styles Label=UI200}" />
+                        </dui:HorizontalStackLayout>
+                        <dui:Label Text="john.doe@example.com"
+                                   Style="{dui:Styles Label=UI200}" />
+                    </dui:VerticalStackLayout>
+                </dui:VerticalStackLayout>
+
+            </dui:VerticalStackLayout>
+
+        </dui:VerticalStackLayout>
+    </dui:ScrollView>
+
+</dui:ContentPage>

src/app/Components/AccessibilitySamples/VoiceOverSamples/GroupChildrenSamples.xaml.cs

@@ -0,0 +1,9 @@
+namespace Components.AccessibilitySamples.VoiceOverSamples;
+
+public partial class GroupChildrenSamples : DIPS.Mobile.UI.Components.Pages.ContentPage
+{
+    public GroupChildrenSamples()
+    {
+        InitializeComponent();
+    }
+}

src/app/Components/AccessibilitySamples/VoiceOverSamples/VoiceOverSamples.xaml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<dui:ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                 xmlns:dui="http://dips.com/mobile.ui"
+                 xmlns:localizedStrings="clr-namespace:Components.Resources.LocalizedStrings"
+                 xmlns:helpers="clr-namespace:Components.Helpers"
+                 xmlns:voiceOverSamples="clr-namespace:Components.AccessibilitySamples.VoiceOverSamples"
+                 x:Class="Components.AccessibilitySamples.VoiceOverSamples.VoiceOverSamples"
+                 Title="{x:Static localizedStrings:LocalizedStrings.VoiceOver}">
+
+    <dui:ScrollView Padding="{dui:Sizes size_4}">
+        <dui:VerticalStackLayout Spacing="{dui:Sizes size_0}">
+
+                <dui:ListItem Title="{x:Static localizedStrings:LocalizedStrings.VoiceOver_GroupChildren_Title}"
+                              HasBottomDivider="True"
+                              Command="{helpers:NavigationCommand ContentPageType={x:Type voiceOverSamples:GroupChildrenSamples}}" />
+
+            </dui:VerticalStackLayout>
+
+    </dui:ScrollView>
+
+</dui:ContentPage>

src/app/Components/AccessibilitySamples/VoiceOverSamples/VoiceOverSamples.xaml.cs

@@ -0,0 +1,9 @@
+namespace Components.AccessibilitySamples.VoiceOverSamples;
+
+public partial class VoiceOverSamples
+{
+    public VoiceOverSamples()
+    {
+        InitializeComponent();
+    }
+}

src/app/Components/App.xaml.cs

@@ -1,90 +1,50 @@
 using Components.Resources.LocalizedStrings;
-using Components.Services;
-using DIPS.Mobile.UI.API.Library;
+using Enum = System.Enum;
 
 namespace Components;
 
 public partial class App
 {
-    private readonly AppCenterService m_appCenterService;
-
     public App()
     {
         InitializeComponent();
-
-        m_appCenterService = new AppCenterService();
     }
 
     protected override Window CreateWindow(IActivationState? activationState)
     {
-        var shell = new DIPS.Mobile.UI.Components.Shell.Shell
-        {
-            ShouldGarbageCollectPreviousPage = true,
-
-        };
+        var shell = new DIPS.Mobile.UI.Components.Shell.Shell();
 
+        var allSamples = REGISTER_YOUR_SAMPLES_HERE.RegisterSamples();
         var tabBar = new TabBar();
-        var tab = new Tab();
 
-        tab.Items.Add(new ShellContent
+        foreach (var sampleType in Enum.GetValues<SampleType>())
         {
-            ContentTemplate =
-                new DataTemplate(() => new MainPage(new List<SampleType> {SampleType.Resources, SampleType.Components}.OrderBy(s => s.ToString()),
-                    REGISTER_YOUR_SAMPLES_HERE.RegisterSamples()))
-        });
-        tabBar.Items.Add(tab);
-        shell.Items.Add(tabBar);
-
-        return new Window(shell);
-    }
-
-    protected override void OnStart()
-    {
-        _ = TryGetLatestVersion();
-
-        base.OnStart();
-    }
-
-
-    private async Task<bool> TryGetLatestVersion()
-    {
-#if DEBUG
-        return true;
-#endif
-
-        var release = await m_appCenterService.GetLatestVersion();
-        if (release != null)
-        {
-            var latestVersion = new Version(release.Version);
-            var currentVersion = AppInfo.Version;
-            if (currentVersion >= latestVersion)
+            var samples = allSamples.Where(s => s.Type == sampleType).OrderBy(s => s.Name);
+            var title = sampleType switch
             {
-                return false;
-            }
-
-            if (Current?.MainPage == null) return true;
-            var wantToDownload = await Current.MainPage.DisplayAlert(LocalizedStrings.New_version,
-                LocalizedStrings.New_version_message, LocalizedStrings.Download, LocalizedStrings.Cancel);
-            if (!wantToDownload)
+                SampleType.Resources => LocalizedStrings.Resources,
+                SampleType.Components => LocalizedStrings.Components,
+                SampleType.Accessibility => LocalizedStrings.Accessibility,
+                _ => sampleType.ToString()
+            };
+
+            var tab = new Tab
             {
-                return false;
-            }
-
-            await Launcher.OpenAsync(release.InstallUri);
-            return true;
+                Title = title,
+                Items =
+                {
+                    new ShellContent
+                    {
+                        ContentTemplate = new DataTemplate(() => new SamplesPage(sampleType, samples))
+                    }
+                }
+            };
+
+            tabBar.Items.Add(tab);
         }
+
+        shell.Items.Add(tabBar);
 
-        return false;
-    }
-
-    protected override void OnResume()
-    {
-        _ = TryGetLatestVersion();
-        base.OnResume();
-    }
-
-    protected override void OnSleep()
-    {
-        base.OnSleep();
+        return new Window(shell);
     }
 }

src/app/Components/Components.csproj

@@ -27,8 +27,8 @@
 
     <PropertyGroup Condition="'$(Configuration)|$(TargetFramework)|$(Platform)'=='Debug|net9.0-ios|AnyCPU'">
         <CreatePackage>false</CreatePackage>
+        <CodesignKey>Apple Development</CodesignKey>
         <CodesignProvision>Automatic</CodesignProvision>
-        <CodesignKey>iPhone Developer</CodesignKey>
     </PropertyGroup>
     <PropertyGroup Condition="'$(Configuration)|$(TargetFramework)|$(Platform)'=='Release|net9.0-ios|AnyCPU'">
         <CreatePackage>false</CreatePackage>
@@ -133,6 +133,10 @@
           <DependentUpon>BarcodeScanningSample.xaml</DependentUpon>
           <SubType>Code</SubType>
         </Compile>
+        <Compile Update="AccessibilitySamples\VoiceOverSamples\VoiceOverSamples.xaml.cs">
+          <DependentUpon>VoiceOverSamples.xaml</DependentUpon>
+          <SubType>Code</SubType>
+        </Compile>
     </ItemGroup>
 
     <ItemGroup>
@@ -163,6 +167,13 @@
         <MauiXaml Update="ComponentsSamples\PhotoCapturing\PhotoCaptureSample.xaml">
           <SubType>Designer</SubType>
         </MauiXaml>
+        <MauiXaml Update="AccessibilitySamples\VoiceOverSamples\VoiceOverSamples.xaml">
+          <SubType>Designer</SubType>
+        </MauiXaml>
+    </ItemGroup>
+
+    <ItemGroup>
+      <Folder Include="Services\" />
     </ItemGroup>
 
 

src/app/Components/REGISTER_YOUR_SAMPLES_HERE.cs

@@ -1,3 +1,5 @@
+using Components.AccessibilitySamples;
+using Components.AccessibilitySamples.VoiceOverSamples;
 using Components.ComponentsSamples.Alerting;
 using Components.ComponentsSamples.AmplitudeView;
 using Components.ComponentsSamples.BarcodeScanning;
@@ -65,6 +67,7 @@ public static List<Sample> RegisterSamples()
             new(SampleType.Components, "Tag", () => new TagsSamples()),
             new(SampleType.Components, "Counters", () => new CountersSamples()),
             new(SampleType.Components, "TabView", () => new TabViewSamples()),
+            new(SampleType.Accessibility, "VoiceOver/TalkBack", () => new VoiceOverSamples()),