Forum Xamarin.Forms
We are excited to announce that the Xamarin Forums are moving to the new Microsoft Q&A experience. Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

We encourage you to head over to Microsoft Q&A for .NET for posting new questions and get involved today.

Voice over is reading parent screen on custom confirmation alert popups

AnkitParekhAnkitParekh USMember ✭✭
edited October 20 in Xamarin.Forms

Parent screen is being read for voice-over/talkback on custom confirmation alert messages on iOS and Android devices.

When the custom popup is displayed on the screen and if a swipe gesture is done to read the entire screen, it reads the popup content as well as everything there on the parent screen (on the background of the popup), unlike native popups.

Whereas the native android & iOS popup works like a charm, it stops at the last button and doesn't read the parent or background screen.

Can anyone suggest how I can stop voice-over/talkback on the last control of the custom alert like native popups? or please suggest any readily available dialog plugin which can help fix this issue?

I have attached the existing custom alert dialog code for your reference.

Thanks in advance.

Used Xamarin Forms Ver.: 4.8.0

Best Answers

Answers

  • JarvanJarvan Member, Xamarin Team Xamurai
    edited October 21

    how I can stop voice-over/talkback on the last control of the custom alert like native popups

    Try to override the OnAppearing method which will be call when the page is on the screen. When closing the alert dialog, the method will be executed. You could add the function of stop the accessibility in this method.

    protected override void OnAppearing()
    {
        base.OnAppearing();
        //stop the accessibility function
        //try to achieve this on each platform and use DependencyService to call the method in the shared project
    }
    
  • AnkitParekhAnkitParekh USMember ✭✭
    edited October 21

    @Jarvan
    My intention is not to stop the voice-over on closing the dialog, I want to stop it when the dialog is displayed on top of a screen and when the voice-over reads the dialog, it should stop at last control of the dialog and do not read the content of a calling (parent) screen.

    I will try to explain the sequence of events:
    1. PageA Opened
    2. PageA displayed a CustomDialogA (Sub-layout in PageA.xaml)
    3. Voice-over activated to read the entire screen

    In this case, PageA and CustomDialogA are both visible on the screen and Voice-over is asked to read the entire screen then it reads out the dialog content and calling (PageA) screen content as well.

    Just to clarify, CustomDialogA is added in the PageA.xaml layout file and shown by a flag IsVisible = true/false.

    • Do you think in this case overriding, OnAppearing() will help?
    • Could you elaborate more on the stop accessibility function?
    • Is there any command which can turn on / off voice-over for the entire page?
  • JarvanJarvan Member, Xamarin Team Xamurai
    edited October 21

    I want to stop it when the dialog is displayed on top of a screen and when the voice-over reads the dialog

    Try to detect the OnDisappearing method to stop the accessibility when the dialog shows.

    Is there any command which can turn on / off voice-over for the entire page

    To stop the accessibility, you could refer to the following link:
    https://forums.xamarin.com/discussion/162526/accessibility-how-to-stop-the-back-button-always-becoming-the-first-voice-over-element

  • JohnHardmanJohnHardman GBUniversity admin
    edited October 21

    @AnkitParekh

    Sounds like the issue reported at https://github.com/xamarin/Xamarin.Forms/issues/9792, although more generalised.
    I haven't looked at your code to see how you are creating the popups, but if it seems appropriate you might want to update that GitHub issue, and raise one for TalkBack on Android if you are seeing the problem there too.

    [Update: I've just done a quick test using XF 4.8, and found that the code I tested didn't exhibit this problem on iOS or UWP, but some (but not all) popups did on Android, suggesting that it depends on how the popup is created. I'll investigate the code that I tested when I have time, but go ahead and update GitHub issues with what you have found too]

  • AnkitParekhAnkitParekh USMember ✭✭
    edited October 21

    @JohnHardman

    I am facing this issue with any screen which displays a custom alert dialog and not only with a screen with a listview and yes, I am facing this issue on Android and iOS both.

    I have added the popup as a sub-layout in my .xaml file and hiding/showing using the IsVisible flag. I am attaching the Custom Alert Dialog code and also the code snippet of how I add it to the layout.

    <local:AlertDialog
                    AlertType="{x:Static analytics:ModalTitle.Congrats}"
                    IsShown="{Binding ShowCongratsDialog}"
                    Image="handshake"
                    Title="{strings:Translate CongratsMessage}"
                    TapOutsideClosesAlert="{Binding IsAndroid}"
                    Message="{strings:Translate CongratsBody}"
                    PositiveTextKey="GotIt"
                    PositiveButtonCommand="{Binding ReloadCommand}"
                    NegativeButtonCommand="{Binding ReloadCommand}" />
    

    Attaching the AlertDialog file.

    [Update: I am hiding/showing popup using IsShown property and IsVisible is tied with IsShown in AlertDialog.xaml.cs.]

  • JohnHardmanJohnHardman GBUniversity admin
    edited October 21

    @AnkitParekh said:
    I have added the popup as a sub-layout in my .xaml file and hiding/showing using the IsVisible flag.

    Changing IsVisible isn't always picked up by screen readers. I've been investigating this myself today. I'm rushing out so can't look now, but I'm pretty sure that there's already a GitHub issue for this. As a workaround, you might want to bind AutomationProperties.IsInAccessibleTreeProperty on appropriate Views to whatever you bind IsVisible to (with or without a BooleanToOpposite value converter as appropriate). I plan to test that myself later today, but I would hope that would work. If it does, I'll be adding that to my growing list of workarounds for XF accessibility issues. If it doesn't, then a custom page renderer may be required until a fix goes into XF.

  • AnkitParekhAnkitParekh USMember ✭✭
    edited October 21

    @JohnHardman

    JFYI, my issue is not exactly the same as this https://github.com/xamarin/Xamarin.Forms/issues/9792 because my parent screen and the dialogue on top of that screen both are being read by voice-over/talkback.

    But the expected behaviour is that voice-over/talkback should only read the content of custom dialogue when it is visible on the screen and should not read the background screen content after reading the dialogue content.

  • AnkitParekhAnkitParekh USMember ✭✭
    edited October 22

    @JohnHardman

    I am attaching XAML/C# files. This tool was not allowing me to attach .xaml/xaml.cs so added .txt extension at the end.

  • JohnHardmanJohnHardman GBUniversity admin

    @AnkitParekh said:
    @JohnHardman

    I am attaching XAML/C# files. This tool was not allowing me to attach .xaml/xaml.cs so added .txt extension at the end.

    You can copy/paste XAML and C# into posts, rather than attach the files. As long as you mark those blocks as being code, it will be formatted correctly. When you are typing a post, just about the editing area is a set of toolbar icons. If you dropdown the sixth one across, you will see the option to mark an area of a post as being "Code". Doing this makes it much easier for people to read and respond to posts.

    In terms of the question itself, it still appears that my previous post provides the way to go.

  • JohnHardmanJohnHardman GBUniversity admin

    @Jarvan said:
    You could try using Rg.Plugins.Popup plugin to display the dialog. The pop-up will be shown as a page, which will be better to detect navigation between pages.

    Unfortunately, Rg.Plugins.Popup doesn't seem to solve this. There is an issue raised at https://github.com/rotorgames/Rg.Plugins.Popup/issues/585

  • AnkitParekhAnkitParekh USMember ✭✭
    edited October 29

    @JohnHardman, @Jarvan
    I tried implementing Rg.Plugins.Popup and it resolved the issue on iOS but still I am experiencing the issue on Android as reported over here. As @Jarvan and @JohnHardman suggested above, I had to manually handle this situation for Android, I created PageRenderer and handled the visibility of the entire page from accessibility when dialogue is opened/closed.

    Thanks, @Jarvan and @JohnHardman, your suggestions are very helpful.

  • JarvanJarvan Member, Xamarin Team Xamurai

    Congrats! If you've solved the issue, please accept the helpful reply as the answer. It will be beneficial for other community members who have similar questions.

Sign In or Register to comment.