Visual Studio WPFアプリ開発で実行時コントロールの大きさや位置がおかしくなってしまう

前提

Visual StudioでC# WPFアプリのコントロールについて。

発生している問題

コントロール(ボタンに限らず)の大きさや位置がUI開発画面と実行時の画面で変わってしまう。
以下、開発画面と実行画面の画像です。
開発画面の表示
実行時の表示

該当のXAML

xaml
1<Window x:Name="testwpf" x:Class="testwpf.MainWindow"
2        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
5        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
6        xmlns:local="clr-namespace:testwpf"
7        mc:Ignorable="d"
8        Title="testwpf" Height="400" Width="300">
9    <Button Height="40" Content="実行" Click="Button_Click" Margin="100,252,100,92" Width="100"/>
10</Window>

試したこと

自分でもかなり検索したりしてみたのですが、検索の仕方が悪いのか解決には至らず...
私の推測ではMarginのせいでこんなことになっているのかな？と思ったりしましたが、それをどうすればいいのかも分からずでした。
どうか、ご教授のほどよろしくお願い致します。

補足情報（FW/ツールのバージョンなど）

Visual Studio 2022

補足

この質問で投稿させていただいたコードは初期の状態で設定されているGridを削除していますが、これは削除しないほうが良いのでしょうか？
Gridありでも上記の画像よりはひどくないものの、やはりボタンの高さが変わってしまいます。

回答1件

ベストアンサー

私の推測ではMarginのせいでこんなことになっているのかな？と思ったりしましたが、それをどうすればいいのかも分からずでした。

はい。その通りです。ウィンドウを広げるとボタンが出てくると思います。

なんていえばいいんですかね？
例えばウィンドウの高さを変えるとウィンドウ下部に常に92pxの空白があるような状態になり、一定以上高さが小さくなるとボタンが隠れてしまいます。

要はデザイナでコントロールをドラッグして移動するような操作をすると、上下左右にマージンがついてしまいこのようなことになります。
わたしはこれをぐちゃぐちゃマージンと呼んでいますｗ（Margin="8,8,8,8"のような小さい数値は問題ありません）

ウィンドウのリサイズをさせる気がないのであれば、このような作り方でもおおむね問題はないです（Window.Width・Window.Heightはタイトルバーや枠を含み、実際のユーザー設定を見ずに固定値っぽいので、Gridにサイズを入れたほうがよさそう）

xml
1<Window
2  x:Class="Qf2phpggrf7n3d8.MainWindow"
3  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5  ResizeMode="NoResize"
6  SizeToContent="WidthAndHeight">
7  <Grid Width="300" Height="400">
8    <Button
9      Width="100"
10      Height="40"
11      Margin="100,268,100,92"
12      Content="実行" />
13  </Grid>
14</Window>

リサイズ対応にするには４辺のマージンをやめ、１辺（あるいは直行する２辺）だけになるようにします（HorizontalAlignment・VerticalAlignmentを適宜変更してください）

xml
1<Window
2  x:Class="Qf2phpggrf7n3d8.MainWindow"
3  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5  Width="300"
6  Height="400">
7  <Grid>
8    <Button
9      Width="100"
10      Height="40"
11      Margin="0,0,0,92"
12      HorizontalAlignment="Center"
13      VerticalAlignment="Bottom"
14      Content="実行" />
15  </Grid>
16</Window>