Приложение в редакторе отличается от скомпилированного приложения

Question

Я начинаю изучать WPF. Возникла проблема.

То, как выглядит мое приложение в редакторе отличается от того, как выглядит скомпилированное приложение. В окне обрезается часть справа и снизу.

Примеры:

• В редакторе
• В приложении

Как сделать так, чтобы окно не обрезалось справа и снизу?

Код разметки:

<Window x:Name="MainWindow1" x:Class="Tic_tac_toe.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:Tic_tac_toe"
    mc:Ignorable="d"
    Title="Tic-tac-toe" Height="500" Width="500" ResizeMode="NoResize" WindowStartupLocation="CenterScreen">

<Window.Resources>
    <Style x:Key="MyButtonStyle1" TargetType="Button">
        <Setter Property="Background" Value="White"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="FontSize" Value="100"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border Name="border" 
                        BorderThickness="0"
                        BorderBrush="White" 
                        CornerRadius="0" 
                        Background="{TemplateBinding Background}">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="border" Property="BorderBrush" Value="Black" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

    </Style>
</Window.Resources>

<Grid x:Name="MainGird">
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>

    <Button x:Name="Button1_1" Style="{StaticResource MyButtonStyle1}" Content="" Grid.Column="1" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Top" Width="144" Height="137"/>
    <Button x:Name="Button1_0" Style="{StaticResource MyButtonStyle1}" Content="" Grid.Column="1" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="144" Height="137"/>
    <Button x:Name="Button2_0" Style="{StaticResource MyButtonStyle1}" Content="" Grid.Column="2" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="145" Height="137"/>
    <Button x:Name="Button2_1" Style="{StaticResource MyButtonStyle1}" Content="" Grid.Column="2" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Top" Width="145" Height="137"/>
    <Button x:Name="Button2_2" Style="{StaticResource MyButtonStyle1}" Content="" Grid.Column="2" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="2" VerticalAlignment="Top" Width="145" Height="137"/>
    <Button x:Name="Button1_2" Style="{StaticResource MyButtonStyle1}" Content="" Grid.Column="1" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="2" VerticalAlignment="Top" Width="144" Height="137"/>
    <Button x:Name="Button0_0" Style="{StaticResource MyButtonStyle1}" Content="" HorizontalAlignment="Left" VerticalAlignment="Top" Width="145" Height="137" Margin="10,10,0,0" />
    <Button x:Name="Button0_1" Style="{StaticResource MyButtonStyle1}" Content="" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Top" Width="145" Height="137"/>
    <Button x:Name="Button0_2" Style="{StaticResource MyButtonStyle1}" Content="" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="2" VerticalAlignment="Top" Width="145" Height="137"/>

    <Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="451" VerticalAlignment="Top" Width="20" Grid.ColumnSpan="2" Margin="155,10,0,0" Grid.RowSpan="3" RadiusX="1" RadiusY="1"/>
    <Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="451" VerticalAlignment="Top" Width="20" Grid.ColumnSpan="2" Margin="154,10,0,0" Grid.RowSpan="3" Grid.Column="1" RadiusX="1" RadiusY="1"/>
    <Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="20" Margin="10,147,0,0" Grid.RowSpan="2" VerticalAlignment="Top" Width="474" Grid.ColumnSpan="3" RadiusX="1" RadiusY="1"/>
    <Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="20" Margin="10,147,0,0" Grid.RowSpan="2" VerticalAlignment="Top" Width="474" Grid.ColumnSpan="3" Grid.Row="1" RadiusX="1" RadiusY="1"/>

</Grid>

Answer 1

Как-то у вас всё очень сложно. Предположу, что вам нужно просто вот такое:

<Grid Background="#FFF4F4F5"> <!-- цвет фона -->
    <Grid Margin="10"> <!-- внешний маргин -->
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="10"/> <!-- внутренний маргин -->
            <RowDefinition/>
            <RowDefinition Height="10"/> <!-- внутренний маргин -->
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="10"/> <!-- внутренний маргин -->
            <ColumnDefinition/>
            <ColumnDefinition Width="10"/> <!-- внутренний маргин -->
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>

        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="0" Grid.Column="0" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="0" Grid.Column="2" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="0" Grid.Column="4" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="2" Grid.Column="0" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="2" Grid.Column="2" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="2" Grid.Column="4" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="4" Grid.Column="0" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="4" Grid.Column="2" />
        <Button Style="{StaticResource MyButtonStyle1}" Grid.Row="4" Grid.Column="4" />
    </Grid>
</Grid>