This is a migrated thread and some comments may be shown as answers.

Styling selecteditem

1 Answer 76 Views
ListPicker
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Fredrik
Top achievements
Rank 1
Fredrik asked on 02 Nov 2011, 03:33 PM
Hello !!

I'm trying to style the ListPickerItem to have a certaine color when selected and not the default one from the phone.
How can I do this task?
I have tryied to modify the ListPickerItem template and have different colors in the VisualStateGroup's "Selected" area with no good result.
All it does is selecting all of the selected items with my color and not just the only one selected.
Please provide a small sample how to achive this task.

Regards

Fredrik

1 Answer, 1 is accepted

Sort by
0
Georgi
Telerik team
answered on 07 Nov 2011, 11:33 AM
Hi Fredrik,

Thank you for contacting us and for your question.

The visual states are defined in the ControlTemplate of each list picker item. Therefore you will need to modify it in order to change a certain state. In the Q2 2011 SP1 of the control we have added the ItemStyle property which may be used to define the appearance of each list picker item. So, you may declare this in XAML:

<telerikInput:RadListPicker x:Name="listPicker">
    <telerikInput:RadListPicker.ItemStyle>
        <Style TargetType="telerikPrimitives:SelectorItem">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="telerikPrimitives:SelectorItem">
                        <Border Background="{TemplateBinding Background}">
 
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="content" Storyboard.TargetProperty="Foreground" Duration="0">
                                                <DiscreteObjectKeyFrame Value="Red" KeyTime="0"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
 
                            <ContentControl x:Name="content"
                                            Content="{TemplateBinding Content}"
                                            ContentTemplate="{TemplateBinding ContentTemplate}"
                                            Foreground="{TemplateBinding Foreground}"
                                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                            Margin="{TemplateBinding Padding}"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </telerikInput:RadListPicker.ItemStyle>
</telerikInput:RadListPicker>

This however will work when the control is operating in Inline mode. This is an omission in the version you are using. I would like to thank you for bringing our attention to this issue - I have updated your Telerik points for your time and feedback.

We will added a property named PopupItemStyle that will allow you to modify the appearance of each item in the popup part of the picker. This new property will be available with our official Q3 2011 release, due in about 10 days.

Do not hesitate to write us back with any question/problem you may have regarding our tools.

Greetings,
Georgi
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Tags
ListPicker
Asked by
Fredrik
Top achievements
Rank 1
Answers by
Georgi
Telerik team
Share this question
or