SuggestionViewBackgroundColor doesn't seem to be working

[Denise]

Hi,

I am using the AutoCompleteView in a Xamarin.Forms application running on iOS. The device is set to Dark Mode however I have set SuggestionViewBackgroundColor to White, however the SuggestionView still has a black background. I am running v2020.2.624.1.

Is this corrected in a later version of the library or do I need to use another approach to set the SuggestionViewBackgroundColor?

Kind regards,

Denise

[Didi]

Hi Denise,

Currently, Telerik UI for Xamarin controls do not have a support for dark mode. We have this logged in our feedback portal. You can follow and vote for the item at the link below:

https://feedback.telerik.com/xamarin/1433680-provide-support-for-ios-13-dark-mode

Solution:

1. SuggestionItemTemplate

The control used for the suggestionItemTemplate is the Xamarin.ListView control. So you can change the cell background color inside the SuggestionItemTemplate or change the Label Text color:

<telerikInput:RadAutoCompleteView x:Name="AutoComplete"
                                ItemsSource="{Binding Source}"
                                TextSearchPath="Name"
                                VerticalOptions="Start"
                                Watermark="Search here...">
    <telerikInput:RadAutoCompleteView.SuggestionItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid BackgroundColor="Red">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Label Margin="5"
                        FontSize="24"
                        Text="{Binding Name}"
                        TextColor="Green"/>
                    <Image Grid.Column="1"
                        Margin="5"
                        HeightRequest="20"
                        Source="{Binding ImageSource}"
                        WidthRequest="20"/>
                </Grid>
            </ViewCell>
        </DataTemplate>
    </telerikInput:RadAutoCompleteView.SuggestionItemTemplate>
</telerikInput:RadAutoCompleteView>

If this is not an option you could add a listview to the suggestionviewtemplate and change the background color of the ListView. How to do this, check my reply in the following forum thread:

https://www.telerik.com/forums/suggestionitemtemplate-cell-height-request#Wn7hmFPbUEul5WWCkJMr9A 

2. SuggestionView template example:

The example is located in the SDK Browser Application app / Examples/AutoCompleteViewControl/Templates/SuggestionViewTemplateExample

In Addition to the Dark and Light mode, you can create a dark/light support in the app. Mainly you can change the color when the theme is light/dark. For more details on this please review the following blog post: https://lalorosas.com/blog/dark-mode 

I hope the provided information will help you achieve the requirements you have.

Regards,
Didi
Progress Telerik