Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You can display your collection using an <a href="http://msdn.microsoft.com/en-us/library/system.windows.controls.itemscontrol.aspx" rel="nofollow">ItemsControl</a> that has it's <code>ItemsPanel</code> set to a <code>Grid</code> or <code>UniformGrid</code>. I have some <code>ItemsControl</code> examples <a href="http://rachel53461.wordpress.com/2011/09/17/wpf-itemscontrol-example/" rel="nofollow">here</a> that may help you, as I don't find MDSN's examples very helpful.</p> <p>A <code>UniformGrid</code> would be easiest if you can bind your <code>Rows</code> and <code>Columns</code> properties to a property in your <code>ViewModel</code>, however that requires all your cells be the same size, and I can't remember if the properties <code>Rows</code> and <code>Columns</code> are DependencyProperties that participate in the binding system or not. </p> <pre><code>&lt;ItemsControl ItemsSource="{Binding MyCollection}"&gt; &lt;!-- ItemsPanelTemplate --&gt; &lt;ItemsControl.ItemsPanel&gt; &lt;ItemsPanelTemplate&gt; &lt;UniformGrid Columns="{Binding ColumnCount}" Rows="{Binding RowCount}" /&gt; &lt;/ItemsPanelTemplate&gt; &lt;/ItemsControl.ItemsPanel&gt; &lt;/ItemsControl&gt; </code></pre> <p>If this doesn't work for you, you can use a <code>Grid</code> as the <code>ItemsPanel</code> and set the <code>Grid.Row</code> and <code>Grid.Column</code> bindings in the <code>ItemContainerStyle</code>. </p> <p>This will require you have properties on each of your cell objects in the <code>ObservableCollection</code> to say what Row/Column that cell is in, however I suspect you'll need these anyways to determine things like adjacent cells in your click command.</p> <p>In addition, there's no built-in way to bind the number of Rows/Columns in your <code>Grid</code>, so I tend to use some <a href="http://rachel53461.wordpress.com/2011/09/17/wpf-grids-rowcolumn-count-properties/" rel="nofollow">custom attached properties</a> that will dynamically build the Grid's <code>RowDefinitions</code> and <code>ColumnDefinitions</code> based on a bound value.</p> <p>So your end result if you're using a Grid would probably look something like this:</p> <pre><code>&lt;ItemsControl ItemsSource="{Binding Cells}"&gt; &lt;!-- ItemsPanelTemplate --&gt; &lt;ItemsControl.ItemsPanel&gt; &lt;ItemsPanelTemplate&gt; &lt;!-- This is assuming you use the attached properties linked above --&gt; &lt;Grid local:GridHelpers.RowCount="{Binding Height}" local:GridHelpers.ColumnCount="{Binding Width}" /&gt; &lt;/ItemsPanelTemplate&gt; &lt;/ItemsControl.ItemsPanel&gt; &lt;!-- ItemContainerStyle --&gt; &lt;ItemsControl.ItemContainerStyle&gt; &lt;Style&gt; &lt;Setter Property="Grid.Column" Value="{Binding ColumnIndex}" /&gt; &lt;Setter Property="Grid.Row" Value="{Binding RowIndex}" /&gt; &lt;/Style&gt; &lt;/ItemsControl.ItemContainerStyle&gt; &lt;/ItemsControl&gt; </code></pre> <p>With a Model/ViewModel looking something like this</p> <pre><code>public class GameViewModel { // These should be full properties w/ property change notification // but leaving that out for simplicity right now public int Height; public int Width; public ObservableCollection&lt;CellModel&gt; Cells; } public class CellModel { // Same thing, full properties w/ property change notification public int ColumnIndex; public int RowIndex; public bool IsVisible; public bool IsMine; public int NumberAdjacentMines; } </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload