为 WPF 应用程序设计用户界面_wpf vs xaml 设计视图-CSDN博客

您可以为 Windows Presentation Foundation (WPF) 应用程序设计用户界面，就像为 Windows 窗体应用程序设计一样。将控件从“工具箱”中拖动到设计图面。对于 WPF 应用程序而言，集成开发环境 (IDE) 有所不同。除了具有“属性”窗口和“工具箱”外，WPF IDE 还有一个 XAML 编辑器。XAML 是一种可用于创建用户界面的可扩展应用程序标记语言。下图显示了 XAML 编辑器的位置。有关更多信息，请参见演练：在 WPF 设计器中编辑 XAML。

XAML 编辑器

正如可通过在 Windows 窗体开发过程中手动编写代码来创建控件一样，您可以使用 XAML 标记创建控件。在大多数情况下，不用编写 XAML 来创建控件；从“工具箱”中拖动控件并使 Visual C# 速成版为您生成 XAML，这样会更加容易。然后，您可以修改 XAML 标记更改控件的属性，如“高度”或“文本”。例如，当您双击“Button”控件以将其添加到 WPF 窗口时，会生成类似如下标记的 XAML 标记。

 
     <Button Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" 
    Name="Button1" VerticalAlignment="Top" Width="75">Button</Button>

默认情况下，可修改的属性（如宽度和高度）显示为红色字体。可以直接在 XAML 标记中更改这些值，如下例所示。

 
     <Button Height="30" HorizontalAlignment="Left" Margin="10,10,0,0" 
    Name="Button1" VerticalAlignment="Top" Width="60">Submit</Button>

创建 WPF 应用程序

在“文件”菜单上单击“新建项目”。
在“新建项目”对话框中单击“WPF 应用程序”。
在“名称”框中，键入“WPF 应用程序”，然后单击“确定”。

随即便会创建一个新的 WPF 项目。将出现一个名为“Window1”的新窗口，其 XAML 标记显示在 Visual C# 速成版 IDE 的 XAML 编辑器中。
单击“Window1”以选定它。
在 XAML 视图中，将 Window 元素的 Title 属性更改为 WPF Application。

“Window1”标题栏中的文本将更改为“WPF 应用程序”。

向 WPF 窗口中添加控件

若要在 WPF 窗口中添加控件，可以从“工具箱”拖动控件。有关更多信息，请参见公共 WPF 控件。

向 WPF 窗口中添加控件

从“工具箱”中将一个“TextBox”控件拖动到 WPF 窗口的右上方。
单击该“TextBox”控件以将其选中。
在“属性”窗口中，单击“HorizontalAlignment”属性的第一个箭头（左箭头），如下图所示。
HorizontalAlignment 属性

这会将该“TextBox”从 WPF 窗口的右侧移动到左侧。
设置该“TextBox”的下列属性。

属性

值

VerticalAlignment

Top

Width

75

Height

26
在 XAML 编辑器中，将 TextBox 元素的 Width 属性更改为 140，将 Margin 元素更改为 30, 56, 0, 0，如下例所示。
<TextBox Height="26" HorizontalAlignment="Left" Margin="30,56,0,0" Name="TextBox1" VerticalAlignment="Top" Width="140" />
键入新值后，该“TextBox”的宽度和位置将随之更改。
向 WPF 窗口中该“TextBox”旁添加一个“Button”控件。

属性	值
VerticalAlignment	Top
Width	75
Height	26

将开始和结束 Button 标记之间的文本从 Button 更改为 Submit，如下例所示。

 
         <Button Height="23" HorizontalAlignment="Right" Margin="0,59,35,0" 
    Name="Button1" VerticalAlignment="Top" 
    Width="75">Submit</Button>

输入新值后，按钮上的文本将随之更改。