Accessibility options, allows accessibility programs to read your app and provide any appropriate assistance. The most common, is a narrator, being able to read your app, to verbal speak to a user about what parts of your app do. Accessibility support in our apps, is something a lot of developers overlook. It was previously difficult to add platform specific accessibility support with Xamarin Forms. Starting in Xamarin Forms 2.3.5, we now have basic accessibility support for each platform. Previously this had to be done via Custom Renderers, or more recently Effects.
Accessibility Options
Xamarin Forms includes 4 different Accessibility Options, that are set via Attached Properties, in the class AutomationProperties. These set the accessibility options natively, so that a narrator can speak about the element.
IsInAccessibleTree
IsInAccessibleTree is a boolean that is determines if this element is accessible. You must set this to true, in order for the other elements to be used.
// XAML <Entry Accessibility.IsInAccessibleTree="True" Text="Hello" /> // Code Behind var entry = new Entry(); entry.SetValue(Accessibility.IsInAccessibleTreeProperty, true);
Behind the scenes, it sets these properties for the control, on each platform.
Android | iOS | UWP |
---|---|---|
Focusable | IsAccessibilityElement | AutomationProperties.AccessibilityViewProperty |
HelpText
The HelpText is a text value, that can be spoken, if there is nothing else to describe the element.
// XAML <Entry AutomationProperties.IsInAccessibleTree="True" AutomationProperties.HelpText="Howdy" Text="Hello" /> // Code Behind var entry = new Entry(); entry.SetValue(AutomationProperties.IsInAccessibleTreeProperty, true); entry.SetValue(AutomationProperties.HelpText, "Howdy");
Behind the scenes, it sets these properties for the control, on each platform.
ANDROID | IOS | UWP |
---|---|---|
Hint | AccessibilityHint | AutomationProperties.HelpTextProperty |
Name
This is just a name of the element.
// XAML <Entry AutomationProperties.IsInAccessibleTree="True" AutomationProperties.Name="EntryBox" Text="Hello" /> // Code Behind var entry = new Entry(); entry.SetValue(AutomationProperties.IsInAccessibleTreeProperty, true); entry.SetValue(AutomationProperties.Name, "EntryBox");
Behind the scenes, it sets these properties for the control, on each platform.
ANDROID | IOS | UWP |
---|---|---|
ContentDescription | AccessibilityLabel | AutomationProperties.NameProperty |
LabeledBy
Labeled By, allows another element to define accessibility information. For example if you have an Entry, but a label is next to it, describing the element. Then the text value of that label can be used to describe the element.
// XAML <Label x:Name="EntryLabel" Text="Username" /> <Entry AutomationProperties.IsInAccessibleTree="True" AutomationProperties.LabeledBy="{x:Reference EntryLabel}" /> // Code Behind var entryLabel = new Label() { Text="Username" }; var entry = new Entry(); entry.SetValue(AutomationProperties.IsInAccessibleTreeProperty, true); entry.SetValue(AutomationProperties.LabeledBy, entryLabel);
Behind the scenes, it sets these properties for the control, on each platform.
ANDROID | IOS | UWP |
---|---|---|
SetLabelFor | Not Mapped | AutomationProperties.LabeledByProperty |
Narration
Each platform has a different program to narrate, these values. Windows 10 has the Narrator (Settings -> Ease of Access -> Narrator), iOS has VoiceOver (Settings -> General -> Accessibility -> VoiceOver) and Android you can download TalkBack. How the program narrates each elements is up to the program itself. For example in UWP, it will prioritize Name, LabeledBy and then HelpText. In Android, it may combine the Name and Hint values. Testing on each platform with each element, will be needed to ensure you have a decent experience.
Learn More
Xamarin provides some Accessibility Guidelines for Xamarin apps, which goes beyond these new Accessibility Options. You can learn many things, relating to many different types of accessibility options and design to help make your app more accessible.
Ref
https://docs.microsoft.com – https://xamarinhelp.com – https://blog.xamarin.com/