title: Creating and filling a NxN grid in UWP Xaml
body: <p>I am trying to create a UWP puzzle game, I want to cut the picture into n parts and then show the pieces in a grid.</p>
  
  <p>My problem is, how to force a certain NxN style. Right now I have to maximize the window in order to see a 3x3 grid, if I shrink either side, it will converge to a 2 column, 1 column grid. Is there a way to handle this?</p>
  
  <p>This is what I have done, I know the RowDefinition is manually right now, until I figure out a better way to do that.</p>
  
  <pre><code>&lt;UserControl
      x:Class="PictureSplitter.Views.PictureView"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d"
      d:DesignHeight="300"
      d:DesignWidth="400"&gt;
  
  
          &lt;GridView ItemsSource="{Binding Splitter.PuzzlePositions}"&gt;
  
              &lt;GridView.ItemTemplate&gt;
                  &lt;DataTemplate&gt;
                      &lt;Border BorderBrush="Red" BorderThickness="2"&gt;
                      &lt;Grid x:Name="picGrid"&gt;
                          &lt;Grid.RowDefinitions&gt;
                              &lt;RowDefinition Height="Auto"&gt;&lt;/RowDefinition&gt;
                              &lt;RowDefinition Height="Auto"&gt;&lt;/RowDefinition&gt;
                              &lt;RowDefinition Height="Auto"&gt;&lt;/RowDefinition&gt;
                          &lt;/Grid.RowDefinitions&gt;
                          &lt;Grid.ColumnDefinitions&gt;
                              &lt;ColumnDefinition Width="Auto"&gt;&lt;/ColumnDefinition&gt;
                              &lt;ColumnDefinition Width="Auto"&gt;&lt;/ColumnDefinition&gt;
                              &lt;ColumnDefinition Width="Auto"&gt;&lt;/ColumnDefinition&gt;
                          &lt;/Grid.ColumnDefinitions&gt;
                          &lt;Image Source="{Binding Piece.ImageSource}" /&gt;
                      &lt;/Grid&gt;
                  &lt;/Border&gt;
                  &lt;/DataTemplate&gt;
              &lt;/GridView.ItemTemplate&gt;
  
          &lt;/GridView&gt;
  
  &lt;/UserControl&gt;
  </code></pre>
  
  <p>This are two example images:
  <a href="https://i.stack.imgur.com/wmX89.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wmX89.png" alt="Wanted gridstyle"></a></p>
  
  <p><a href="https://i.stack.imgur.com/8jYyL.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8jYyL.png" alt="Not wanted gridstyle"></a></p>