How do I conditionally change properties of controls in the CellTemplate of a data bound WPF ListView?

Question

Ok... I'm new to WPF, but I kind of know how to do things using DataTriggers and Converters.

But, what I want to seems a little more complex than that. Let me give you the details:

The DataContext for the ListView control is an IList of objects (object=Room). These are the available rooms. I've got another control (let's say it's a TextBox) that it bound to one of the Room objects contained in the IList. I want to display an image only for the room (ListViewItem) that is bound to the other control.

This is some of my XAML:

<TextBox Name="Room" />
<ListView Name="RoomsList" SelectionMode="Single">
    <ListView.View>
        <GridView>
            <GridViewColumn Width="32">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <!-- 
                           Here's where I want to change the Source property
                           depending on whether or not the item matches the
                           TextBox DataContext.
                        -->
                        <Image Source="Images/Check.png" />
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
            </GridViewColumn>
            <GridViewColumn Header="Room Name" Width="150" HeaderContainerStyle="{StaticResource textHeaderStyle}" 
                DisplayMemberBinding="{Binding Path=RoomName}" />
        </GridView>
    </ListView.View>
</ListView>

I'm kind of stuck on this one. Any ideas as to how to approach this?

Answer 1

You can write a MultiValueConverter which returns Visibility back and takes DataContext as the first Converter Value and the specific 'Room' object as the second Value(Use ElementName binding with Element as 'Room') If the Values matches then show the Image control ie, imgControl.Visibility bind to the Converter

Answer 2

Assuming your room object contains the picture or a link to the picture you can use the SelectedIndex property of ListView and bind to the picture field.

<TextBox Name="Room" Text="{Binding ElementName=RoomsList.SelectedItem, Path=Picture}" />

Where Roomlist.Picture is the photo you want to display. If it's a URL you'll probably have to do this is an image tag contained within the textbox. Note that I haven't tested this code so it might need to be tweaked a little to get it to work.