title: Change scaling order WPF
body: <p>I have a WPF application that needs to be sort of responsive. What I want to have is a <code>DataGrid</code> inside a <code>Grid</code>. When the window scales down, I want the <code>Grid</code> to resize first, and then the <code>DataGrid</code>. Here is what I achieved so far:</p>
  
  <p><a href="https://i.stack.imgur.com/H3cAa.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/H3cAa.gif" alt="enter image description here"></a> </p>
  
  <p>In the gif on top you can see that the <code>Grid</code> resizes first, and when it reaches it's minimum scaling size, it goes over the bottom <code>DataGrid</code>. Not exactly what I want because I want to scale the layout first, then show a scrollbar in the <code>DataGrid</code> instead of the layout just going over it. So I tried the following:</p>
  
  <p><a href="https://i.stack.imgur.com/8Cl4l.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8Cl4l.gif" alt="enter image description here"></a> </p>
  
  <p>Right here you can see that it shows the scrollbars like I want. The only thing is that it first resizes the DataGrid, and when it's done resizing the DataGrid, it starts to resize the Grid. I want it to be the other way around, first resize the grid, then resize the DataGrid and show the Scrollbars. So basically I'm searching for a solution that does the following:</p>
  
  <ol>
  <li>Scale the window which scales the Grid. </li>
  <li>Scale the grid till it's minimum size</li>
  <li>When it has reached the minimum size and it's still getting smaller, show scrollbar in DataGrid. </li>
  </ol>
  
  <p>So that comes down to the first Gif from this question, followed by scrollbars in the DataGrid</p>
  
  <p>Is there any way to do this? It seems like I'm very close since it's a combination of those two things but I don't know how. Here's my code:</p>
  
  <pre><code>&lt;Grid Grid.Row="1" HorizontalAlignment="Right"  Grid.Column="0"&gt;
    &lt;Grid ShowGridLines="False"&gt;
      &lt;Grid.RowDefinitions&gt;
        &lt;RowDefinition MaxHeight="50"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="20"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="5"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="5"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="5"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="50"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="50"/&gt;
        &lt;RowDefinition Height="auto"/&gt;
        &lt;RowDefinition MaxHeight="5"/&gt;
        &lt;RowDefinition Name="DataGridRow" Height="*" MaxHeight="240" /&gt;
      &lt;/Grid.RowDefinitions&gt;
  
      &lt;Label Grid.Row="1" FontSize="24"&gt;Test&lt;/Label&gt;
      &lt;Label Grid.Row="3" Content="Test"/&gt;
      &lt;ComboBox Grid.Row="5" MaxWidth="500" MinWidth="300" HorizontalAlignment="Left"  /&gt;
      &lt;Label Grid.Row="7" Content="Test"/&gt;
      &lt;ComboBox Grid.Row="9" MaxWidth="500" MinWidth="300" HorizontalAlignment="Left"/&gt;
      &lt;Separator Grid.Row="11"/&gt;
  
      &lt;Label Grid.Row="13" Content="Test" /&gt;
      &lt;Grid Grid.Row="15"&gt;
        &lt;DataGrid
            RowHeight="40"
             CanUserAddRows="False"
              x:Name="dataGrid"
              AutoGenerateColumns="False"
              CanUserResizeColumns="True"
              HeadersVisibility="None"
              GridLinesVisibility="None"
              ScrollViewer.CanContentScroll="True"
              ScrollViewer.VerticalScrollBarVisibility="Visible"
              ScrollViewer.HorizontalScrollBarVisibility="Auto"
          &lt;DataGrid.Columns&gt;
            &lt;DataGridTextColumn IsReadOnly="True" Width="*" Binding="{Binding Name}"&gt;
              &lt;DataGridTextColumn.ElementStyle&gt;
                &lt;Style TargetType="TextBlock"&gt;
                  &lt;Setter Property="VerticalAlignment" Value="Center" /&gt;
                  &lt;Setter Property="Margin" Value="2,0,0,0"/&gt;
                &lt;/Style&gt;
              &lt;/DataGridTextColumn.ElementStyle&gt;
            &lt;/DataGridTextColumn&gt;
          &lt;/DataGrid.Columns&gt;
        &lt;/DataGrid&gt;
      &lt;/Grid&gt;
    &lt;/Grid&gt;
  &lt;/Grid&gt;
  </code></pre>