Dynamic DataTemplate in ControlTemplate via Trigger

Question

I have a listbox "listBox_Results" and several ItemTemplates(one of them ItemTemplateStyle1), in my ItemContainerStyle I'm setting Template property for item. So I want change my ItemTemplate in trigger "IsSelected". (in common sense: I want my listboxitem change size and content display on selection, by dynamicly setting diffrent ItemTemplate) Do you have any solutions?

Best regards

upd:If you think this question is unclear or not useful, most apreciate if tell you me why, before you minus

Code:

   <ListBox Name="listBox_Results"  
             HorizontalAlignment="Stretch"
             VerticalAlignment="Stretch"
             BorderThickness="0"
             Margin="2"
             Grid.Row="0"
             ItemTemplate="{StaticResource ItemTemplateStyle1}"
             ItemsSource="{Binding}" >
            <ListBox.ItemContainerStyle>

                <Style TargetType="{x:Type ListBoxItem}">
                    <Setter Property="Background" Value="Transparent"/>
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                    <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                    <Setter Property="Padding" Value="2,2,2,2"/>
                    <Setter Property="Margin" Value="2"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                <Border x:Name="Bd" Margin="1" SnapsToDevicePixels="true" CornerRadius="3" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" >
                                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                </Border>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsSelected" Value="true">
                                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                                        <Setter Property="FontWeight" Value="Bold"/>
                                        <Setter Property="Background" TargetName="Bd">
                                            <Setter.Value>
                                                #E1E1E1
                                            </Setter.Value>
                                        </Setter>
                                        ...

Answer 1

First, take out your inline styling and create a ResourceDictionary to keep things together. This will also help with the template switch I am suggesting.

In the Resource Dictionary, you will define the two templates that you want (the selected and unselected list item templates), the style of the list item and the list box itself. I am abbreviating the code, just to show how I would put the items together.

In the ResourceDictionary

<ControlTemplate x:Key="unselectedTemplate" TargetType="{x:Type ListBoxItem}">
   <Grid>
     <ContentPresenter />
   </Grid>
</ControlTemplate>
<ControlTemplate x:Key="selectedTemplate" TargetType="{x:Type ListBoxItem}">
   <Grid>
     <ContentPresenter Margin="3"/>
   </Grid>
</ControlTemplate>
<Style x:Key="listboxItemStyle" TargetType="{x:Type ListBoxItem}">
   <Setter Property="Template" Value="{StaticResource unselectedTemplate}"/>
   <Style.Triggers>
     <DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource Self}}" Value="True">
       <Setter Property="Template" Value="{StaticResource selectedTemplate}"/>
     </DataTrigger>
    </Style.Triggers>
</Style>
<Style x:Key="listBoxStyle" TargetType="{x:Type ListBox}">
   <Setter Property="HorizontalAlignment" Value="Stretch"/>
   <Setter Property="ItemContainerStyle" Value="{StaticResource listboxItemStyle}"/>
</Style>

Then, when you are creating your list box on the page... just reference the list box style key.

<ListBox Name="listbox_Results" Style="{StaticResource listBoxStyle}" ItemsSource="{Binding}"/>

Make sure the ControlTemplates are defined before the styles, I found when I don't I run into errors. Also, this keeps your layout page cleaner, and the styles are easier to reuse if you need to use them again.

I uploaded a very basic example here.

Answer 2

You have to use an Data template selector which will select a particular data template according to the conditions in your selector.

You have to write the data templates in xaml with separate names and select them from the DataTemplateSelector class file. For that you need to inherit from the base class DataTemplateSelector

I will share some sample code with you. Please check this and you will get an idea of how to use an item template selector.

XAML :

<Window x:Class="WpfApplication5.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication5"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <DataTemplate x:Key="NormalUserDataTemplate">
            <StackPanel>
                <TextBlock Text="{Binding Name}" />
            </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="PremiumUserDataTemplate">
            <StackPanel Background="LightBlue">
                <TextBlock Text="{Binding Name}" />
            </StackPanel>
        </DataTemplate>
        <local:PremiumUserDataTemplateSelector x:Key="myPremiumUserDataTemplateSelector" />
    </Window.Resources>
    <Grid>
        <ListView x:Name="myListView" ItemTemplateSelector="{StaticResource myPremiumUserDataTemplateSelector}">
        </ListView>
    </Grid>
</Window>

Code behind :

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        List<User> users = new List<User>();
        for (int i = 0; i < 10; ++i)
        {
            var user = new User { ID = i, Name = "Name " + i.ToString(), Age = 20 + i };
            if (i == 2 || i == 4)
            {
                user.IsPremiumUser = true;
            }
            users.Add(user);
        }
        myListView.ItemsSource = users;
    }
}

public class PremiumUserDataTemplateSelector : DataTemplateSelector
{
    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        FrameworkElement elemnt = container as FrameworkElement;
        User user = item as User;
        if(user.IsPremiumUser)
        {
            return elemnt.FindResource("PremiumUserDataTemplate") as DataTemplate;
        }
        else
        {
            return elemnt.FindResource("NormalUserDataTemplate") as DataTemplate;
        }
    }
}

public class User
{
    public int ID { get; set; }
    public string Name { get; set; }
    public int Age { get; set; }
    public bool IsPremiumUser { get; set; }
}