CheckBox and accesibility behavior is unexpeted in Android, how control it's text color
I'm developing Xamarin.Forms app, and I have to take into account people with visual disabilities. I mostly use black and white colors to have the highest contrast and device's day/night mode is used to set element color. I'm using automation properties to give information to the screen reader.
The
CheckBox
doesn't have Text property. But if I use
AutomationProperties.Name
the text is shown in Android and I can't set it's color, because is not the same of
CheckBox.Color
property. This is a big problem because sometimes the text is unreadable.
Example code with 2 checkboxes, first without AutomationProperties and second with AutomationProperties.
App.xaml:
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="CheckBoxTest.App">
<Application.Resources>
<!-- Light theme colors -->
<Color x:Key="LightThemeBackgroundColor">WhiteSmoke</Color>
<Color x:Key="LightThemeTextColor">Black</Color>
<!-- Dark theme colors -->
<Color x:Key="DarkThemeBackgroundColor">Black</Color>
<Color x:Key="DarkThemeTextColor">WhiteSmoke</Color>
</Application.Resources>
</Application>
MainPage.xaml:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="CheckBoxTest.MainPage"
BackgroundColor="{AppThemeBinding Light={StaticResource LightThemeBackgroundColor}, Dark={StaticResource DarkThemeBackgroundColor}}">
<StackLayout>
<Label Text="Checkboxes" HorizontalTextAlignment="Center" FontSize="Medium"
TextColor="{AppThemeBinding Light={StaticResource LightThemeTextColor}, Dark={StaticResource DarkThemeTextColor}}"/>
<CheckBox HorizontalOptions="Center"
Color="{AppThemeBinding Light={StaticResource LightThemeTextColor}, Dark={StaticResource DarkThemeTextColor}}"/>
<CheckBox HorizontalOptions="Center"
Color="{AppThemeBinding Light={StaticResource LightThemeTextColor}, Dark={StaticResource DarkThemeTextColor}}"
AutomationProperties.IsInAccessibleTree="True" AutomationProperties.Name="Accept conditions"/>
</StackLayout>
</ContentPage>
These are day and night mode captures:
As you can see:
- In day/light mode, the text in the second
CheckBox
is white, and it is unreadable. - In night/dark mode, the text in the second
CheckBox
is gray.
In another app, and I don't know why, in night/dark mode the text is black (with black background)
So is it possible to change this text color to have full control in app design?