#467 – Use a UniformGrid for Evenly Spaced Rows and Columns

The UniformGrid layout panel is similar to a Grid, in that it lays child elements out in rows and columns.  But it’s different from a Grid in the following ways:

  • You don’t specify any size information for individual rows and columns
  • All columns are the same width
  • All rows are the same height
  • You specify the desired number of rows and columns
  • You don’t specify a row or column for child elements

Child elements are automatically placed into consecutive cells in the grid.  Each row is filled from left to right, starting with the first row.

    <UniformGrid Rows="2" Columns="3">
        <Label Content="1st" Background="Azure" />
        <Label Content="2nd" Background="Moccasin"/>
        <Label Content="3rd" Background="DarkSeaGreen"/>
        <Label Content="4th" Background="Violet" />
        <Label Content="5th" Background="Pink" />
    </UniformGrid>