CODEWITHSUNDEEP
iosxamlxamarin.formsaccessibilityvoiceover
Physikbuddha
Physikbuddha

Reputation: 1662

How can I make a MasterDetailPage icon VoiceOver accessible?

My Xamarin.Forms app's main page consists of a MasterDetailPage that looks like the following:

<MasterDetailPage ...>
    <MasterDetailPage.Master>
        <v:MasterMenuPage Title="Menu" Icon="icon_hamburger.png" />
    </MasterDetailPage.Master>
    <MasterDetailPage.Detail>
        ...
    </MasterDetailPage.Detail>
</MasterDetailPage>

As I tried 'listening' to my app on iOS 10 with VoiceOver activated, I noticed that the voice reads the menu icon as Icon Hamburger instead of Menu.

How can I set an accessibility text to overcome this problem?

Upvotes: 1

Views: 410

Answers (2)

Milan MiNo Michalec
Milan MiNo Michalec

Reputation: 155

try:

AutomationProperties.SetIsInAccessibleTree(yourElement, true);
AutomationProperties.SetName(yourElement, "textToBeSpoken");

source: https://blog.xamarin.com/accessbility-xamarin-forms/

Upvotes: 0

Jamil Geor
Jamil Geor

Reputation: 337

From looking through the Xamarin.Forms source code, and how it creates that navigation item. I think the only way you are going to be able to set the accessibility label for that icon is by creating a custom renderer for NavigationPage.

This example, sets the label correctly for me.

[assembly: ExportRenderer(typeof(NavigationPage), typeof(stackoverflowexample.iOS.CustomNavigationPageRenderer))]
namespace stackoverflowexample.iOS
{
    public class CustomNavigationPageRenderer : NavigationRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            var button = GetNavigationButton();

            if (button == null) return;

            button.AccessibilityLabel = GetMasterPageTitle();

        }

        UIBarButtonItem GetNavigationButton()
        {
            var nav = this.NativeView.Subviews.OfType<UINavigationBar>().FirstOrDefault();

            var navItem = nav.Items.FirstOrDefault(x => x.LeftBarButtonItem != null);

            return navItem?.LeftBarButtonItem;
        }

        string GetMasterPageTitle()
        {
            var parentPages = ((Page)Element).GetParentPages();
            var masterDetail = parentPages.OfType<MasterDetailPage>().FirstOrDefault();

            return masterDetail?.Master?.Title;
        }
    }
}

Upvotes: 1

Related Questions