65.9K
CodeProject is changing. Read more.
Home

WPF: Binding to Individual Collection Items (But Not in an ItemsControl)

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.75/5 (3 votes)

Jun 17, 2009

CPOL
viewsIcon

56763

downloadIcon

154

Binding to individual collection items (but not in an ItemsControl) in WPF

Well, I had a great day yesterday, and quite a surprising one. I had an issue with an idea I was working on, so naturally I turned to Josh Smith.

And guess what I, yes me, the mere mortal managed to teach Josh something about WPF…Ha Ha, check that.

So here is what I taught Josh…..(still can't believe I managed to teach Josh something ;-) )

I want to be able to bind multiple controls that are all stand alone controls to a collection. Sounds simple enough, right.

Check this code behind:

    1:  using System; 
    2:  using System.Collections.Generic; 
    3:  using System.Collections.ObjectModel; 
    4:  using System.Linq; 
    5:  using System.Text; 
    6:  using System.Windows; 
    7:  using System.Windows.Controls; 
    8:  using System.Windows.Data; 
    9:  using System.Windows.Documents; 
   10:  using System.Windows.Input; 
   11:  using System.Windows.Media; 
   12:  using System.Windows.Media.Imaging; 
   13:  using System.Windows.Navigation; 
   14:  using System.Windows.Shapes; 
   15:   
   16:  namespace WPF_test 
   17:  { 
   18:      public partial class Window1 : Window 
   19:      { 
   20:          public ObservableCollection<string> 
   21:              MyValues { get; private set; } 
   22:   
   23:          public Window1() 
   24:          { 
   25:              MyValues = new ObservableCollection<string>(); 
   26:              MyValues.Add(“array”); 
   27:              MyValues.Add(“element”); 
   28:              MyValues.Add(“bindings”); 
   29:              //use the ObservableCollection<string> MyValues  as 
   30:              //the DataContext for the Window 
   31:              this.DataContext = MyValues; 
   32:              InitializeComponent(); 
   33:          } 
   34:   
   35:          private void Button_Click_0( 
   36:              object sender, RoutedEventArgs e) 
   37:          { 
   38:              MyValues.Clear(); 
   39:              MyValues.Add(“bindings”); 
   40:              MyValues.Add(“element”); 
   41:              MyValues.Add(“array”); 
   42:          } 
   43:   
   44:          private void Button_Click_1( 
   45:              object sender, RoutedEventArgs e) 
   46:          { 
   47:              MyValues.Clear(); 
   48:              MyValues.Add(“element”); 
   49:              MyValues.Add(“bindings”); 
   50:              MyValues.Add(“array”); 
   51:          } 
   52:   
   53:          private void Button_Click_2( 
   54:              object sender, RoutedEventArgs e) 
   55:          { 
   56:              MyValues.Clear(); 
   57:              MyValues.Add(“array”); 
   58:              MyValues.Add(“bindings”); 
   59:              MyValues.Add(“element”); 
   60:          } 
   61:      } 
   62:  }

And here is the XAML code. This is where the individual elements are bound to the MyValues collection. Let's see:

    1:  <Window x:Class=”WPF_test.Window1″ 
    2:      xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation” 
    3:      xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml” 
    4:      Title=”Window1″ Height=”300″ Width=”300″> 
    5:   
    6:   
    7:      <Window.Resources> 
    8:          <ContentPresenter x:Key=”cont1″ Content=”{Binding Path=.[0], Mode=OneWay}”/> 
    9:          <ContentPresenter x:Key=”cont2″ Content=”{Binding Path=.[1], Mode=OneWay}”/> 
   10:          <ContentPresenter x:Key=”cont3″ Content=”{Binding Path=.[2], Mode=OneWay}”/> 
   11:      </Window.Resources> 
   12:   
   13:      <StackPanel Orientation=”Vertical”> 
   14:          <Button Content=”{DynamicResource cont1}” Click=”Button_Click_0″/> 
   15:          <Button Content=”{DynamicResource cont2}” Click=”Button_Click_1″/> 
   16:          <Button Content=”{DynamicResource cont3}” Click=”Button_Click_2″/> 
   17:      </StackPanel> 
   18:   
   19:   
   20:  </Window>

And real guts of this post is the Content=”{Binding Path=.[0], Mode=OneWay}” part, see how it uses the . notation, which means current Binding, and the [0] indexer.

Neat, huh? And here it is running:

37352/image-thumb20.png

You can see a demo project here.