Pass listbox selected item information through to usercontrol (WPF)

Question

I have a listbox, and each listbox item is a custom usercontrol I made. I have used styles to remove all of the default highlighting for a listbox item (ie. removing the blue background highlight for a selected item).

What I want is to be able to do something special to my user control to denote that the listbox item is highlighted. Such as make the border on the user control more bold, something like that.

If I could get a boolean into the user control, I think from there I'd be able to figure out how to make the necessary changes to the user control... through a converter or something most likely.

What I'm not sure of, is how do I pass into the usercontrol the information that shows whether the listbox item which the user control is in is highlighted.

The code in question is like this:

<ListBox.ItemTemplate>
 <DataTemplate>
  <hei:OrangeUserCtrl DataContext="{Binding}" Height="40" Width="40" />
 </DataTemplate>
</ListBox.ItemTemplate>

How can I pass in to the user control (preferably as a true/false) if the listbox item it is in is highlighted?

Thanks

kmatyaszek kmatyaszek · Accepted Answer · 2013-01-17T16:40:06

You can use Tag property and RelativeSource binding.

In my example when item is highlighted I changed Border properties (BorderBrush=Red and BorderThickness=3).

Source code:

Simple class to hold data:

class Person
{
   public string Name { get; set; }
   public string Surname { get; set; }
}

ListBox:

 <ListBox ItemsSource="{Binding}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <local:MyCustomPresenter DataContext="{Binding}" 
                                             Tag="{Binding Path=IsSelected, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBoxItem}, UpdateSourceTrigger=PropertyChanged}"
                                             Height="60" Width="120" />               
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

UserControl to display custom data:

<UserControl x:Class="WpfTextWrapping.MyCustomPresenter"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Border Margin="10">
        <Border.Style>
            <Style TargetType="Border">
                <Setter Property="BorderBrush" Value="Green" />
                <Setter Property="BorderThickness" Value="1" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path=Tag, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}, UpdateSourceTrigger=PropertyChanged}" Value="True">
                        <Setter Property="BorderBrush" Value="Red" />
                        <Setter Property="BorderThickness" Value="3" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Border.Style>

        <StackPanel Orientation="Vertical">
            <TextBlock Text="{Binding Name}" />
            <TextBlock Text="{Binding Surname}" />
        </StackPanel>        
    </Border>
</UserControl>

Pass listbox selected item information through to usercontrol (WPF)

2 Answers