Search code examples
c#wpfxamlscaling

Content gets cropped then scaling window

enter image description here

I have a grid within a grid within a Dockpanel which I wants to fit the height of the window. The problem is that the content gets cropped at the bottom, and it's get more cropped the smaller the window is. (The reason I have a grid within a grid is that I whant the inner grid to be 8*8 regardless of what I otherwise do with the gui)

<Window x:Class="WPF_test.MainWindow"
    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"
    xmlns:local="clr-namespace:WPF_test"
    mc:Ignorable="d"
    Title="MainWindow" WindowState="Maximized">
<DockPanel HorizontalAlignment="Center" VerticalAlignment="Stretch" Height="Auto" Width="Auto" Margin="0,0,0,0">
    <Menu Width="200" Height="40" VerticalAlignment="Top"/>
    <Grid VerticalAlignment="Stretch" 
          Height="{Binding ActualHeight, 
          RelativeSource ={RelativeSource AncestorType = {x:Type Window}}}" 
          Width="{Binding ActualHeight, 
          RelativeSource ={RelativeSource AncestorType = {x:Type Window}}}" 
          Margin="0,0,0,0" ShowGridLines="True">
        <Grid.Background>
            <ImageBrush Stretch="UniformToFill" 
                ImageSource="C:/Users/ppeterss/OneDrive/Pictures/sjakk/red_mahogany_wood_texture_by_sweetsoulsister.jpg" />
        </Grid.Background>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="1*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="1*"/>
        </Grid.RowDefinitions>
        <Grid Height="Auto" Width="Auto" Margin="0,0,0,0" ShowGridLines="True" 
              Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="8" Grid.RowSpan="8" >
            <Grid.Background>
                <ImageBrush Stretch="Fill"
                ImageSource="C:/Users/ppeterss/OneDrive/Pictures/sjakk/WhiteBoards.png" />
            </Grid.Background>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="1*"/>
            </Grid.RowDefinitions>
        </Grid>
    </Grid>
</DockPanel>

Solution

  • Thank's to Sinatr who gave me the solution (see comment). Puting the Dockpanel inside a Viewbox did the trick. It migth be a better way to implement this, but this code worked for me. 

    <Window x:Class="WPF_test.MainWindow"
    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"
    xmlns:local="clr-namespace:WPF_test"
    mc:Ignorable="d"
    Title="MainWindow" WindowState="Maximized">
<Viewbox>
    <DockPanel HorizontalAlignment="Center" VerticalAlignment="Stretch" Height="Auto" Width="Auto" Margin="0,0,0,0">
        <Menu Width="200" Height="40" VerticalAlignment="Top"/>
        <Grid VerticalAlignment="Stretch" 
          Height="{Binding ActualHeight, 
          RelativeSource ={RelativeSource AncestorType = {x:Type Window}}}" 
          Width="{Binding ActualHeight, 
          RelativeSource ={RelativeSource AncestorType = {x:Type Window}}}" 
          Margin="0,0,0,0" ShowGridLines="True">
            <Grid.Background>
                <ImageBrush Stretch="UniformToFill" 
                ImageSource="C:/Users/ppeterss/OneDrive/Pictures/sjakk/red_mahogany_wood_texture_by_sweetsoulsister.jpg" />
            </Grid.Background>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="1*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="1*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="1*"/>
            </Grid.RowDefinitions>
            <UniformGrid Name="Board" Columns="8" Rows="8" Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="8" Grid.RowSpan="8">
                <UniformGrid.Background>
                    <ImageBrush Stretch="Fill"
                ImageSource="C:/Users/ppeterss/OneDrive/Pictures/sjakk/WhiteBoards.png" />
                </UniformGrid.Background>
            </UniformGrid>
        </Grid>
    </DockPanel>
</Viewbox>