如何：创建 C# WPF 应用程序

更新：2007 年 11 月

本主题旨在通过演示如何创建一个简单的 Windows Presentation Foundation (WPF) 应用程序让您熟悉 Visual C# 速成版集成开发环境 (IDE)。与 Windows 窗体应用程序一样，可以通过将控件从“工具箱”拖动到设计图面来设计 WPF 应用程序。除了具有设计器、“属性”窗口和“工具箱”以外，WPF 项目中的 IDE 还具有一个包含 XAML 的窗口。“XAML”是可扩展应用程序标记语言的首字母缩写，用于创建用户界面。下图显示了 XAML 编辑器的位置。

XAML 编辑器

此示例向您演示如何创建自己的墨水应用程序以便用它来绘制图片。

在本节中，您将学习如何：

• 创建一个 WPF 应用程序。

• 在“代码”视图和“设计器”视图之间切换。

• 更改 WPF 窗口的属性。

• 使用 XAML 编辑器。

• 添加 System.Windows.Controls.InkCanvas 控件。

• 添加 System.Windows.Controls.Button 控件。

• 为控件创建事件处理程序。

有关视频演示，请参见 Video How to: Create a C# WPF Application（视频帮助：创建首个 C# WPF 应用程序）。

创建 WPF 应用程序

1. 在“文件”菜单上单击“新建项目”。

   将出现“新建项目”对话框。此对话框列出了 Visual C# 速成版能够创建的不同的默认应用程序类型。

2. 单击“WPF 应用程序”。

3. 将应用程序的名称更改为手写板。

4. 单击“确定”。

   Visual C# 速成版为项目创建一个按项目标题命名的新文件夹，然后在“设计器”视图中显示标题为 Window1 的新 WPF 窗体。随时都可以通过右击设计器图面或代码窗口并选择“查看代码”，切换到“代码”视图。默认情况下，XAML 编辑器显示在设计器之下，但可以通过右击设计器图面并单击“查看 XAML”以全屏模式查看 XAML 标记。

   在“设计器”视图中看到的 WPF 窗口是将在应用程序启动时打开的窗口的可视表示形式。在“设计器”视图中，可以将“工具箱”中的各个控件拖动到 WPF 窗口中。在将控件放到 WPF 窗口中之后，Visual C# 会自动创建一些代码，以便在程序运行时将该控件置于适当的位置。

5. 如果没有显示“属性”窗口，请单击“视图”菜单上的“属性窗口”。该窗口列出了当前所选的 WPF 窗口或控件的属性，并且您可以在此处更改现有的值。

6. 在“属性”窗口中将“Height”属性设置为“550”，将“Width”属性设置为“370”，从而更改该 WPF 窗口的大小。

7. 将该 WPF 窗口的标题更改为手写板。

8. 通过在下拉框中单击“Brown”然后按 Enter，将该 WPF 窗口的“Background”属性更改为棕色。

   说明：
   您也可以通过添加一个“Background”属性并将它的值设置为 Background="Brown" 来直接修改 XAML 标记。

9. 若要打开“工具箱”，请单击“视图”菜单，再单击“工具箱”。

10. 右击“工具箱”，然后单击“选择项”。

    “选择工具箱项”对话框打开。

11. 在“选择工具箱项”对话框的“WPF 组件”选项卡中，向下滚动到“InkCanvas”并将其选中，以使复选框中出现选中标记。

12. 单击“确定”，将 InkCanvas 控件添加到“工具箱”。

13. 从“工具箱”中将一个“InkCanvas”控件拖动到 WPF 窗口中。

14. 在“属性”窗口中设置 InkCanvas 控件的以下属性：

    属性	值
    Width	Auto
    Height	Auto
    HorizontalAlignment	Stretch
    VerticalAlignment	Stretch
    Margin	9, 9, 9, 68

15. 通过将“InkCanvas”控件的“Background”属性设置为“LightYellow”，将其颜色更改为黄色。

    InkCanvas 控件的背景颜色在运行时将显示为浅黄。

16. 将两个“Button”控件拖动到 WPF 窗口中“InkCanvas”的下方。将 button1 置于左侧，将 button2 置于右侧。

17. 选择 button1 并在 XAML 视图中更改 XAML 标记，如以下标记所示。此标记将文本设置为 Clear。

    <Button Height="23" HorizontalAlignment="Left" Margin="85,0,0,24" 
        Name="button1" VerticalAlignment="Bottom"
        Width="75">Clear</Button>
    

18. 选择 button2 并更改 XAML 标记，如以下标记所示。此标记将文本设置为 Close。

    <Button Height="23" HorizontalAlignment="Right" Margin="0,0,72,24" 
        Name="button2" VerticalAlignment="Bottom" Width="75"
        Click="ButtonCloseClicked">Close</Button>
    

    该 WPF 应用程序应与下图所示的“手写板”应用程序类似。

    WPF 墨水应用程序
    

创建事件处理程序

1. 双击“Clear”（清除），然后向生成的 Click 事件处理程序中添加以下代码：

       this.inkCanvas1.Strokes.Clear(); 
   

2. 通过右击代码编辑器然后单击“设计器”，返回到“设计器”视图。

3. 双击“Close”（关闭），然后向生成的 Click 事件处理程序中添加以下代码：

       this.Close();
   

4. 按 F5 运行项目。

5. 当该应用程序打开时，在“InkCanvas”控件中绘制一个图片。如果进行了错误操作，可以单击“Clear”（清除）以重新开始。

6. 单击“Close”（关闭）关闭应用程序。

请参见

任务

如何：创建新的 WPF 应用程序项目

如何：创建 C# 控制台应用程序

如何：创建 C# Windows 窗体应用程序

其他资源

创建您的第一个 Visual C# 应用程序