C# WPF Snippet - Synchronizing Selection [Beginner]

This is a short snippet on a cool little property for anything that derives from Selector (combo box, list box, etc..) called IsSynchronizedWithCurrentItem. This property allows multiple items controls that are bound to the same collection (on their ItemsSource property) to also display the same selection. This means that whatever is selected in one ItemsControl will be shown as selected in the other.

Below is a screenshot of the extremely simple sample app we will be creating today. It has a combo box and a list box which are both bound to the same backing collection. Granted, this is hard to convey in a screenshot, but if you change the current selection in either the combo box or the list box, the selection also changes in the other.

By default, the value of this property is null, which essentially means 'maybe'. Most of the time, the 'maybe' resolves to false, unless the Selector is using a CollectionView, in which case it resolves to true. If you explicitly set the property to true or false, that overrides this 'maybe' behavior.

Really, there isn't much special to do to get this to work - all that you need to do is set IsSynchronizedWithCurrentItem to true on both the ListBox and ComboBox:

<Window x:Class="SyncSelection.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="250" Width="300" Name="This">
  <StackPanel Margin="5">
    <ComboBox ItemsSource="{Binding ElementName=This, Path=BackingCollection}" 
                    IsSynchronizedWithCurrentItem="True" 
                    Margin="0 0 0 10" />
    <ListView ItemsSource="{Binding ElementName=This, Path=BackingCollection}" 
                  Height="150" 
                  IsSynchronizedWithCurrentItem="True" />
  </StackPanel>
</Window>

And the C# code behind is as simple as can be (nothing special needs to be done here to get the selection synchronization to work):

public partial class Window1 : Window
{
  private ObservableCollection<string> _BackingColllection = 
      new ObservableCollection<string>();

  public Window1()
  {
    _BackingColllection.Add("Item 1");
    _BackingColllection.Add("Item 2");
    _BackingColllection.Add("Item 3");
    _BackingColllection.Add("Item 4");
    _BackingColllection.Add("Item 5");
    _BackingColllection.Add("Item 6");
    InitializeComponent();
  }

  public ObservableCollection<string> BackingCollection
  { get { return _BackingColllection; } }
}

You might be wondering why something like this would be useful. Well, there are two reasons this can come in handy - first, the two views could possibly be sorted differently, and it might be useful for the user to interact with both. Another possibility is that by using data templates, the two views are actually displaying different data to the user, and so it is meaningful to have the selection stay synchronized.