Select object in ListView using Selected DataTemplate

Question

I'm using DataTemplate for SelectedItem on ListView as :

<ControlTemplate x:Key="SelectedTemplate" TargetType="ListViewItem">
<WrapPanel (...) BackGround="Silver">

</WrapPanel>
(...)
<Style TargetType="ListViewItem">
       <Style.Triggers>
             <MultiTrigger>
                   <MultiTrigger.Conditions>
                       <Condition Property="IsSelected" Value="true" />
                       <Condition Property="Selector.IsSelectionActive" Value="true" />
                   </MultiTrigger.Conditions>
                   <Setter Property="Template" Value="{StaticResource SelectedTemplate}" />
             </MultiTrigger>
       </Style.Triggers>
</Style>
</ControlTemplate>

Also, ItemsSource is binded to IObservableCollection. But I'm having some problems with selecting item in myListView. What I want to reach is that, Default item template have white background. Selected background is Silver. When I click on item, background changes. But when I'm doing it from code, listview have selected item (checked that, selected index = 0, selectetitem != null), but item get style from non-selected item. So basically I'd like to select item with selectedTemplate. I've tried myListView.SelectedIndex, myLisview.SelectedItem, but doesn't really work.. Any ideas?

Thanks!

Also - I know that I can copy DataTemplate and copy to Selected control template, but I don't want to use this solution, becouse everytime I select one of item in listview, it goes to get methods from my class. All I need is just using the same template change background to silver. — user13657
Hello. Unforntunately, don't have time at this momment. I'll try to make it later. — user13657

BenjaminPaul BenjaminPaul · Accepted Answer · 2014-01-21T15:35:08

If I understand you correctly you have it working so that when you select the item in the list the selected template silver background is shown however when you set the selected item using code it does not?

I have created a simple example that works and the change that I had to make was to set the binding of selecteditem property on the listview to be two way..

<ListView SelectedItem="{Binding MySelectedItem, Mode=TwoWay}">

My example uses Caliburn Micro however this is not important.

Heres my example code that demonstrates it working...

View Model:

public class ShellViewModel : Screen, IShell
{
    private ObservableCollection<Person> people = new ObservableCollection<Person>();

    public ObservableCollection<Person> People
    {
        get
        {
            return this.people;
        }

        set
        {
            this.people = value;
            this.NotifyOfPropertyChange(() => this.People);
        }
    }

    private Person selectedPerson;

    public Person SelectedPerson
    {
        get
        {
            return this.selectedPerson;
        }

        set
        {
            this.selectedPerson = value;
            this.NotifyOfPropertyChange(() => this.SelectedPerson);
        }
    }

    public ShellViewModel()
    {
        var russell = new Person { Name = "Russell" };
        this.People.Add(new Person { Name = "Benjamin" });
        this.People.Add(new Person { Name = "Steve" });
        this.People.Add(russell);
        this.SelectedPerson = russell;
    }

View:

<Window x:Class="WpfApplication5.ShellView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Window.Resources>

    <Style x:Key="TextStyle" TargetType="{x:Type TextBlock}">
        <Style.Triggers>
            <DataTrigger
                    Binding="{Binding
                        RelativeSource={RelativeSource
                            Mode=FindAncestor,
                            AncestorType={x:Type ListBoxItem}},
                            Path=IsSelected}"
                    Value="True">
                <Setter Property="Background" Value="Red"></Setter>
                </DataTrigger>
        </Style.Triggers>
    </Style>

    <DataTemplate x:Key="MyItemTemplate">
        <TextBlock Text="{Binding Name}" Style="{StaticResource TextStyle}"></TextBlock>
    </DataTemplate>
</Window.Resources>

<Grid Background="White">
    <ListView ItemsSource="{Binding People}" x:Name="People" ItemTemplate="{StaticResource MyItemTemplate}" SelectedItem="{Binding SelectedPerson, Mode=TwoWay}">
    </ListView>
</Grid>

Changing the SelectedPerson property on the view model also displays in the view.

Hope this helps!

Select object in ListView using Selected DataTemplate

2 Answers