.net - 表单控件在开始表单时的视觉变化

Question

这是我的第一个 WPF 项目，我很享受它，直到我遇到这个问题。我按照我的意愿设计了一个表格。在视觉工作室中看起来像这样。

但是当我从 Visual Studio 调试它时，它给了我扭曲的视图。截图如下。

但是，当我找到我的.exe文件并双击它或只是ctrl+F5在 Visual Studio 中按下它时，它会给我所需的输出/视图。谁能告诉我发生了什么？

Answer 1

这是产生类似于您所描述的输出的 XAML：

<Window x:Class="MiscSamples.Layout"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Layout" Height="300" Width="300">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition Height=".5*"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
            <RowDefinition Height=".5*"/>
        </Grid.RowDefinitions>

        <Button Grid.Row="0" Grid.Column="0" Margin="2" Content="Source1"/>
        <Button Grid.Row="0" Grid.Column="1" Margin="2" Content="Source2"/>
        <Button Grid.Row="0" Grid.Column="2" Margin="2" Content="Target"/>

        <TextBox Grid.Row="1" Grid.Column="0" Margin="2"/>
        <TextBox Grid.Row="1" Grid.Column="1" Margin="2"/>
        <TextBox Grid.Row="1" Grid.Column="2" Margin="2"/>

        <DataGrid Grid.Row="2" Grid.ColumnSpan="2" Grid.RowSpan="2" Margin="2"/>

        <CheckBox Grid.Row="2" Grid.Column="2" Margin="2" VerticalAlignment="Top" Content="Select All"/>

        <Button Grid.Row="3" Grid.Column="2" Margin="2"/>
    </Grid>
</Window>

• 删除所有设计器生成的 XAML 并用它替换它。
• 此 XAML 生成与分辨率无关的输出。它将所有 UI 元素拉伸到可用的窗口/屏幕大小。
• 请注意，Visual Studio WPF 设计器不会生成与分辨率无关的内容。因此它完全没用，没有人使用它。
• 编写 XAML 是一项令人愉快的活动，比在诸如 winforms 之类的蹩脚恐龙技术中手动编写 UI 要好得多。这就是为什么 winforms 需要视觉设计师，而 WPF 不需要。
• 另外，在开始编写应用程序的逻辑之前，我建议您查看@Rachel 的优秀解释，了解开始“思考 WPF 方式”意味着什么，并查看MVVM设计模式。