[Solved] Applying ItemContainerStyle

[Charles]

Using the RadDataboundListBox and I am attempting to apply a style to the ItemContainerStyle property in XAML. It causes an XAML parsing error at runtime.

This style has previously worked for me when using the built-in Windows Phone ListBox. It basically animates the selection of a listbox item so that it seems to depress when selected. The TargetType is "ListBoxItem" in the definition of the style. What would be the corresponding target type for the RadDataboundListbox?

I've included the somewhat lengthy style definition below:

<Style x:Key="SelectedItemStyle"
       TargetType="ListBoxItem">
    <Setter Property="Background"
            Value="Transparent" />
    <Setter Property="BorderThickness"
            Value="0" />
    <Setter Property="BorderBrush"
            Value="Transparent" />
    <Setter Property="Padding"
            Value="0" />
    <Setter Property="HorizontalContentAlignment"
            Value="Left" />
    <Setter Property="VerticalContentAlignment"
            Value="Top" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListBoxItem">
                <Border x:Name="LayoutRoot"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{TemplateBinding Background}"
                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalAlignment}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Duration="0"
                                                     To="0.9"
                                                     Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)"
                                                     Storyboard.TargetName="ContentContainer"
                                                     d:IsOptimized="True" />
                                    <DoubleAnimation Duration="0"
                                                     To="0.9"
                                                     Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)"
                                                     Storyboard.TargetName="ContentContainer"
                                                     d:IsOptimized="True" />
                                    <PointAnimation Duration="0"
                                                    To="0,0"
                                                    Storyboard.TargetProperty="(UIElement.RenderTransformOrigin)"
                                                    Storyboard.TargetName="ContentContainer"
                                                    d:IsOptimized="True" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background"
                                                                   Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0"
                                                                Value="{StaticResource TransparentBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0"
                                                     To=".5"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Storyboard.TargetName="ContentContainer" />
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Unselected" />
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground"
                                                                   Storyboard.TargetName="ContentContainer">
                                        <DiscreteObjectKeyFrame KeyTime="0"
                                                                Value="{StaticResource PhoneAccentBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentControl x:Name="ContentContainer"
                                    ContentTemplate="{TemplateBinding ContentTemplate}"
                                    Content="{TemplateBinding Content}"
                                    Foreground="{TemplateBinding Foreground}"
                                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    Margin="{TemplateBinding Padding}"
                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                    RenderTransformOrigin="0.5,0.5">
                        <ContentControl.RenderTransform>
                            <CompositeTransform />
                        </ContentControl.RenderTransform>
                    </ContentControl>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

[Valentin.Stoychev]

Hello Charles,

you should target the RadDataBoundListBoxItem. Like that:

<Style TargetType="telerikPrimitives:RadDataBoundListBoxItem" x:Key="ItemContainerStyle">

You can also see a working sample in the FirstLook example of the DataBoundListbox that is available in the solution with the examples, which comes with the installation.

Please let us know how it goes. Especially if you hit any performance issues!

Kind regards,
Valentin.Stoychev
the Telerik team

[Charles]

Thank you for your immediate response.

First of all, that solved the problem I had with the XAML parsing.

Unfortuneately, it doesn't work the way it normally does, but that is probably something to do with the way I've put the itemtemplate together or something in the style. I doubt that it is the RadDataboundListbox.

Once again, thanks for the help.

[Deyan]

Hello Charles,

We will close this support thread now. If you continue experiencing issues with setting custom style to the RadDataBoundListBox for its items, let us know and we will help.

Greetings,
Deyan
the Telerik team