title: wpf grid with dynamic columns
body: <p>I have a collection that I wish to bind to a WPF grid. </p>
  
  <p>The problem I'm facing is that the number of columns is dynamic and is dependent on a collection. Here is a simple mock up:</p>
  
  <pre><code>public interface IRows
  {
      string Message{get;}
      IColumns[] Columns{get;}
  }
  
  public interface IColumns
  {
      string Header {get;}
      AcknowledgementState AcknowledgementState{get;}
  }
  
  public interface IViewModel
  {
      ObservableCollection&lt;IRows&gt; Rows {get;}
  }
  </code></pre>
  
  <p>I want my view to bind to the the Rows collection, which contains a collection of Columns.</p>
  
  <p>My Columns collection contains an enum which should be represented by an image (1 of 3 possibilities). It also contains a Message property which should only be displayed in one column (static and is just some text information). It also contains a Header string which should be displayed as a header for that column.</p>
  
  <p><img src="https://i.stack.imgur.com/V0auB.png" alt="The link to what I want to show"></p>
  
  <p>Note that the number of columns is variable (at the moment the headers are set to Acknowledge but this will change to represent dynamic data).</p>
  
  <p><strong>Update: This is after implementing suggestions from Rachel</strong></p>
  
  <pre><code>    &lt;ItemsControl
   ItemsSource="{Binding Items, Converter={StaticResource PresentationConverter}}"&gt;
    &lt;ItemsControl.ItemsPanel&gt;
      &lt;ItemsPanelTemplate&gt;
        &lt;Grid ShowGridLines="true"
           local:GridHelpers.RowCount="{Binding RowCount}"
           local:GridHelpers.ColumnCount="{Binding ColumnCount}" /&gt;
      &lt;/ItemsPanelTemplate&gt;
    &lt;/ItemsControl.ItemsPanel&gt;
    &lt;ItemsControl.ItemContainerStyle&gt;
      &lt;Style&gt;
        &lt;Setter Property="Grid.Row" Value="{Binding RowIndex}"/&gt;
        &lt;Setter Property="Grid.Column" Value="{Binding ColumnIndex}"/&gt;
      &lt;/Style&gt;
    &lt;/ItemsControl.ItemContainerStyle&gt;
    &lt;ItemsControl.ItemTemplate&gt;
      &lt;DataTemplate&gt;
        &lt;ContentControl Content="{Binding}"&gt;
          &lt;ContentControl.Resources&gt;
            &lt;DataTemplate DataType="{x:Type UI:MessageEntity}"&gt;
              &lt;TextBox Text="{Binding Message}"&gt;&lt;/TextBox&gt;
            &lt;/DataTemplate&gt;
            &lt;DataTemplate DataType="{x:Type UI:StateEntity}"&gt;
              &lt;TextBox Text="{Binding State}"&gt;&lt;/TextBox&gt;
            &lt;/DataTemplate&gt;
          &lt;/ContentControl.Resources&gt;
        &lt;/ContentControl&gt;
      &lt;/DataTemplate&gt;
    &lt;/ItemsControl.ItemTemplate&gt;
  &lt;/ItemsControl&gt;
  </code></pre>
  
  <p>This almost gives me what I want now. I'm only stuck with what I should do for the headers.
  Any suggestions are welcome.</p>