resize datagrid based on a screen resolution

Question

I have a nested datagrid on my screen.It does not take the whole space of my window.I have set the height and width of the datagrids. My problem is when that the datagrid size is the same on every screen resolution. How can I make it to adjust based on a resolution? Can I do that somehow with the MinWidth and MaxWidth? or something like that?If I use SizeToContent,it does not maximize the window.

This is how the window should look This is XAML definition for the grid and main table:

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" MinHeight="30"/>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto"  />
            <RowDefinition Height="Auto"  />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="209*" />
        </Grid.ColumnDefinitions>
    <DataGrid Name="tabela" Grid.Row="1" Width="1100" Height="700" HorizontalAlignment="Center" IsReadOnly="True" AlternatingRowBackground="#eeeeee" ScrollViewer.CanContentScroll="True" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Auto"  ItemsSource="{Binding}" AutoGenerateColumns="False" RowDetailsVisibilityChanged="tabela_RowDetailsVisibilityChanged" SelectionChanged="tabela_SelectionChanged" >

Kacper Stachowski Kacper Stachowski · Accepted Answer · 2017-10-18T07:35:17

Try this:

<Grid>
    <DataGrid Name="tabela"
              HorizontalAlignment="Stretch" 
              VerticalAlignment="Stretch"
              IsReadOnly="True"
              AlternatingRowBackground="#eeeeee"
              ItemsSource="{Binding}"
              AutoGenerateColumns="False"
              RowDetailsVisibilityChanged="tabela_RowDetailsVisibilityChanged" 
              SelectionChanged="tabela_SelectionChanged" >
    </DataGrid>
</Grid>

If you want your controls to resize according to their parent size (in this case it's your window), you can't set Width and Height at all. You can play with MinWidth, MinHeight, MaxWidth and MaxHeight if you want to, but in most cases, controls just stretch to take all available space. It's being set by HorizontalAlignment="Stretch" and VerticalAlignment="Stretch" (in most cases those are default values, but I have set them explicitly in case you have it overriden somewhere else).

Another thing is if you set up a Grid with ColumnDefinitions and RowDefinitions, don't do it if you are not using it. Just Grid is enough to be a container for a single control such as DataGrid. If you do set Rows and Columns, you can set their Width and Height to one of three value types:

Exact value (e.g. 100)
Auto - Rows or Columns will resize to take just as much space as their content
* - this is a proportion marking, so setting star width to one column while you have three of them, will make this column to take all available space. On the other hand if you have two columns and you set Width="*" to the first one and Width="2*" to the second one, all available space will be divided into 3 parts and the first column will get 1/3 of it and the second one 2/3 (you can play with it however you want).

resize datagrid based on a screen resolution

1 Answers