xamarin RadListPicker Text color can't change

1 Answer 201 Views
ListPicker ListView ListView - Xamarin.Android
Chiran
Top achievements
Rank 1
Iron
Iron
Chiran asked on 30 Jul 2021, 11:46 AM | edited on 30 Jul 2021, 11:47 AM

Hi,

I'm trying to change the line colour of RadListPicker popup,

Please help me.

 

1 Answer, 1 is accepted

Sort by
0
Didi
Telerik team
answered on 30 Jul 2021, 02:29 PM

RadListPicker provides different styling options and they are described here: https://docs.telerik.com/devtools/xamarin/controls/listpicker/list-picker-styling#styling 

On the attached image text color is not marked, the border around the items is marked. 

If you want to change this border color and thickness then you have to set style to the ItemStyle and SelectedItemStyle

Example:

 <Style TargetType="telerikDataControls:SpinnerItemView" x:Key="ItemStyle">
                <Setter Property="BackgroundColor" Value="#F8F8F8"/>
                <Setter Property="CornerRadius" Value="0"/>
                <Setter Property="BorderColor" Value="Red"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="TextColor" Value="#919191" />
                <Setter Property="FontSize" Value="12"/>
            </Style>

            <Style TargetType="telerikDataControls:SpinnerItemView" x:Key="SelectedItemStyle">
                <Setter Property="BackgroundColor" Value="#F0F0F0"/>
                <Setter Property="CornerRadius" Value="0"/>
                <Setter Property="BorderColor" Value="Yellow"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="TextColor" Value="#4A4949" />
                <Setter Property="FontSize" Value="16"/>
            </Style>

and to change the border of the popup footer, you can use the FooterStyle property

<Style TargetType="telerikInput:PickerPopupFooterView" x:Key="footerStyle">
                <Setter Property="BackgroundColor" Value="Transparent"/>
                <Setter Property="HeightRequest" Value="60"/>
                <Setter Property="BorderColor" Value="Blue"/>
                <Setter Property="BorderThickness" Value="3"/>
            </Style>

 

 

 <telerikInput:RadListPicker Placeholder="Pick a City Name!"
                                        ItemsSource="{Binding Items}" 
                                        DisplayMemberPath="Name"
                                        IsLooping="True"
                                        DisplayStringFormat="You have picked: {0}"
                                        ItemStyle="{StaticResource ItemStyle}"
                                        SelectedItemStyle="{StaticResource SelectedItemStyle}">
                <telerikInput:RadListPicker.BindingContext>
                    <local:ViewModel/>
                </telerikInput:RadListPicker.BindingContext>
                <telerikInput:RadListPicker.SelectorSettings>
                    <telerikInput:PickerPopupSelectorSettings PopupOutsideBackgroundColor="#4A4949F"
                                                              HeaderLabelText="Select city"
                                                              FooterStyle="{StaticResource footerStyle}"/>
                </telerikInput:RadListPicker.SelectorSettings>
            </telerikInput:RadListPicker>

and the used namespaces: 

xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"

Result:

 

 

Regards,
Didi
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Chiran
Top achievements
Rank 1
Iron
Iron
commented on 02 Aug 2021, 09:41 AM

Thanks, Didi

Love you...

Chiran
Top achievements
Rank 1
Iron
Iron
commented on 03 Aug 2021, 04:37 AM | edited

But the Center horizontal two-line can't remove or change colours, you can see that by changing the background colour to a bit dark,

My xamarin form version is 4.7.0.1351,

 

Didi
Telerik team
commented on 03 Aug 2021, 05:24 AM

use SelectionHighlightStyle -> Specifies the style applied to the border where the current selection is.  https://docs.telerik.com/devtools/xamarin/controls/listpicker/list-picker-styling#listpicker-styling 
Review the documentation and all styling options that ListPicker Provides. 
Tags
ListPicker ListView ListView - Xamarin.Android
Asked by
Chiran
Top achievements
Rank 1
Iron
Iron
Answers by
Didi
Telerik team
Share this question
or