Create a view/control so that in ios it is UIAccessibilityTrait.Adjustable using Xamarin.Forms

Question

I'm developing an application for blind or visually impaired users. Right now in my application I have a value that can change from 0 to 10. I increase it with one button and decrease it with another.

When there is a value that can be increased or decreased, in iOS it is common to do it with a view that detects the swipe up / down gestures when VoiceOver is activated. These views you create are of type UIAccessibilityTraitAdjustable. In Xamarin.iOS this value is part of the UIAccessibilityTrait enumeration: UIAccessibilityTrait.Adjustable.

Is it possible to create a control so that in iOS it has this behavior in Xamarin.Forms? When compiling it for Android it should have the normal behavior with the increase and decrease buttons.

edit 1:

I'm thinking in something like this:

 <!-- This Grid should be Adjustable, how to handle accessibilityIncrement and accessibilityDecrement or bind to IncreaseCommand/DecreaseCommand? -->  
<Grid AutomationProperties.IsInAccessibleTree="{Binding IsIosPlatform}">  
    <Grid.RowDefinitions>  
        <RowDefinition/>  
        <RowDefinition/>  
    </Grid.RowDefinitions>  
    <Grid.ColumnDefinitions>  
        <ColumnDefinition/>  
        <ColumnDefinition/>  
    </Grid.ColumnDefinitions>  
    <Label Grid.Row="0"  
           Grid.Column="0"  
           Grid.ColumnSpan="2"  
           Text="{Binding Value}"/>  
    <Button Grid.Row="1"  
            Grid.Column="0"  
            Text="-"  
            Command="{Binding DecreaseCommand}"  
            AutomationProperties.IsInAccessibleTree="{Binding IsAndroidPlatform}"/>  
    <Button Grid.Row="1"  
            Grid.Column="1"  
            Text="+"  
            Command="{Binding IncreaseCommand}"  
            AutomationProperties.IsInAccessibleTree="{Binding IsAndroidPlatform}"/>  
</Grid>  

Answer 1

Hello,

Welcome to our Microsoft Q&A platform!
You could use customrenderers to access UIAccessibilityTrait.Adjustable. I test with a custom slider, it works. The two buttons display on Android and you also could add some logic code to change the slider value. You can have a try with the following code:

XAML

<StackLayout>  
        <Label  
            x:Name="labelShow"  
               Text= "ShowValue"  
               FontSize="Large"  
               HorizontalOptions="Center"  
               VerticalOptions="CenterAndExpand"></Label>  
        <Button Text="plus">  
            <Button.IsVisible>  
                <OnPlatform x:TypeArguments="x:Boolean"  
                            iOS ="False"  
                            Android ="True"/>  
            </Button.IsVisible>  
        </Button>  
  
        <Slider x:Name="slider"  
               Minimum="0"  
                Maximum="10"  
                ValueChanged="Slider_ValueChanged"  
            ></Slider>  
        <Button Text="subtract">  
            <Button.IsVisible>  
                <OnPlatform x:TypeArguments="x:Boolean"  
                            iOS ="False"  
                            Android ="True"/>  
            </Button.IsVisible>  
        </Button>  
    </StackLayout>  

void Slider_ValueChanged(System.Object sender, Xamarin.Forms.ValueChangedEventArgs e)  
        {  
            labelShow.Text = string.Format("value:{0}",e.NewValue);  
        }  

customrenderers

using System;  
using VoiceOverDemo.iOS;  
using Xamarin.Forms;  
using Xamarin.Forms.Platform.iOS;  
[assembly:ExportRenderer(typeof(Slider), typeof(MySlider))]  
namespace VoiceOverDemo.iOS  
{  
    public class MySlider:SliderRenderer  
    {  
        protected override void OnElementChanged(ElementChangedEventArgs<Slider> e)  
        {  
            base.OnElementChanged(e);  
            if(Control != null) {  
                Control.BackgroundColor = UIKit.UIColor.Orange;  
                Control.AccessibilityTraits = UIKit.UIAccessibilityTrait.Adjustable;  
            }  
        }  
    }  
}  

screen shoot


Best Regards,
Wenyan Zhang

---

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.