窗体控件开始窗体上的视觉变化

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的Excellent Explanation关于开始“思考WPF方式”的含义，以及MVVM设计模式。