使用英语阅读

通过

教程：创建数学测验 WinForms 应用

  • 项目

在此系列四个教程中，你将生成一个数学测验。 测验包含四个随机数学问题，测验者尝试在指定时间内回答。

Visual Studio 集成开发环境（IDE）提供了创建应用所需的工具。 若要了解有关此 IDE 的详细信息，请参阅 欢迎使用 Visual Studio IDE。

在第一个教程中，你将了解如何：

  • 创建使用 Windows 窗体的 Visual Studio 项目。
  • 向窗体添加标签、按钮和其他控件。
  • 设置控件的属性。
  • 保存并运行项目。

先决条件

需要 Visual Studio 才能完成本教程。 访问 Visual Studio 下载页面 获取免费版本。

备注

本教程需要 Windows 窗体应用 (.NET Framework) 项目模板。 在安装过程中，选择 .NET 桌面开发 工作负载：

显示 Visual Studio 安装程序中 dot NET 桌面开发工作负载的屏幕截图。

如果已安装 Visual Studio 并需要添加它，请在菜单中选择 工具>获取工具和功能，或在 创建新项目 窗口中，选择 安装更多工具和功能 链接。

屏幕截图显示“创建新项目”对话框内“找不到所需内容”消息中的“安装更多工具和功能”链接。

创建 Windows 窗体项目

创建数学测验时，第一步是创建 Windows 窗体应用项目。

  1. 打开 Visual Studio。

  2. 在开始窗口中，选择 创建新项目。

    显示 Visual Studio 开始窗口中“创建新项目”选项的屏幕截图。

  3. 在“创建新项目”窗口中，搜索“Windows 窗体”。 然后从 项目类型 列表中选择 桌面。

  4. 针对 C# 或 Visual Basic，选择“Windows 窗体应用 (.NET Framework)”模板，然后选择“下一步”。

    显示“创建新项目”对话框的屏幕截图，其中显示了搜索框、项目类型列表和两个模板。

  5. 在 配置新项目 窗口中，将项目命名为 MathQuiz，然后选择 “创建”。

  1. 打开 Visual Studio。

  2. 在开始窗口中，选择 创建新项目。

    显示 Visual Studio 开始窗口中“创建新项目”选项的屏幕截图。

  3. 在“创建新项目”窗口中，搜索“Windows 窗体”。 然后从 项目类型 列表中选择 桌面。

  4. 针对 C# 或 Visual Basic，选择“Windows 窗体应用 (.NET Framework)”模板，然后选择“下一步”。

    显示“创建新项目”对话框的屏幕截图，其中显示了搜索框、项目类型列表和两个模板。

  5. 在 配置新项目 窗口中，命名项目为 MathQuiz，然后选择 创建。

Visual Studio 为应用创建解决方案。 解决方案是应用所需的所有项目和文件的容器。

设置窗体属性

选择模板并命名文件后，Visual Studio 会为你打开一个表单。 本部分介绍如何更改某些窗体属性。

  1. 在项目中，选择“Windows 窗体设计器”。 设计器选项卡标记为 Form1.cs [设计] 用于 C# 或 Form1.vb [设计] 用于 Visual Basic。

  2. 选择窗体“Form1”。

  3. 属性 窗口现在显示表单的属性。 此窗口通常位于 Visual Studio 的右下角。 如果未看到 属性，请选择 视图>属性窗口。

  4. 在属性窗口中找到“文本”属性。 根据列表的排序方式，可能需要向下滚动。 对于“文本”值输入“数学测验”，然后选择 Enter。

    窗体的标题栏中现在包含文本“数学测验”。

    备注

    可以按类别或按字母顺序显示属性。 使用 属性 窗口中的按钮来回切换。

  5. 将窗体的大小更改为 500 像素宽 400 像素。

    可以通过拖动窗体的边缘或手柄来调整窗体的大小，直到尺寸以 大小 值的形式显示在 属性 窗口中。 拖动图柄是窗体右下角的一个白色小正方形。 还可以通过更改 Size 属性的值来调整窗体的大小。

  6. 将 FormBorderStyle 属性的值更改为 Fixed3D，并将 MaximizeBox 属性设置为 False。

    这些值可防止测验者调整表单的大小。

创建剩余时间框

数学测验的右上角包含一个框。 该框显示测验中保留的秒数。 本部分演示如何对该框使用标签。 在本系列的后续教程中添加倒计时计时器的代码。

  1. 在 Visual Studio IDE 的左侧，选择 工具箱 选项卡。如果未看到工具箱，请在菜单栏中选择 视图>工具箱，或使用快捷键 Ctrl+Alt+X。

  2. 选择 工具箱中的 Label 控件，然后将其拖到窗体上。

  3. 在 属性 框中，设置标签的以下属性：

    • 将 （名称） 设置为 timeLabel。
    • 将 自动调整大小 更改为 False，以便调整框的大小。
    • 将 BorderStyle 更改为 FixedSingle，以在框周围绘制线条。
    • 将 大小 设置为 200， 30。
    • 选择 Text 属性，然后选择 Backspace 键以删除 Text 值。
    • 选择“文本”属性旁边的加号 (+)，然后将“大小”设置为“15.75”。

  4. 将标签移动到窗体的右上角。 出现蓝色分隔线时，使用它们将控件定位在窗体上。

  5. 从 工具箱中添加另一个 标签 控件，然后将其字号设置为 15.75。

  6. 将此标签的 Text 属性设置为 时间剩余。

  7. 移动标签，使其在 timeLabel 标签的左侧排列。

    屏幕截图显示“剩余时间”和剩余时间标签，其中控件在窗体的右上角相互对齐排列。

为加法问题添加控件

测验的第一部分是加法问题。 本部分介绍如何使用标签来显示该问题。

  1. 将 标签 控件从 工具箱 添加到窗体。

  2. 在 属性 框中，设置标签的以下属性：

    • 将 文本 设置为 ？（问号）。
    • 将“AutoSize”设置为“False”。
    • 将 大小 设置为 60,50。
    • 将字号设置为 18。
    • 将“TextAlign”设置为“MiddleCenter”。
    • 将 位置 设置为 50, 75，以此定位控件于窗体中。
    • 将“(Name)”设置为“plusLeftLabel”。

  3. 在窗体中，选择你创建的“plusLeftLabel”标签。 通过选择“编辑>复制”或“Ctrl+C”来复制标签。

  4. 通过选择“编辑>粘贴”三次或“Ctrl+V”三次，将标签粘贴到表单中。

  5. 排列三个新标签，使其位于 plusLeftLabel 标签右侧的一行中。

  6. 将第二个标签的 Text 属性设置为 +（加号）。

  7. 将第三个标签的 （Name） 属性设置为 plusRightLabel。

  8. 将第四个标签的 Text 属性设置为 =（等号）。

  9. 从“工具箱”向窗体中添加 NumericUpDown 控件。 稍后将了解有关此类控件的详细信息。

  10. 在 属性 框中，为 NumericUpDown 控件设置以下属性：

    • 将字号设置为 18。
    • 在 MaximumSize下，将宽度设置为 100。
    • 将“(Name)”设置为 sum。

  11. 将 NumericUpDown 控件与用于加法问题的 标签 控件对齐。

    显示数学测验的第一行的屏幕截图，其中标签可见，并且具有显示零的箭头键的控件。

添加减法、乘法和除法问题的控件

接下来，将标签添加到剩余数学问题的窗体中。

  1. 复制为加法问题创建的四个 标签 控件和 NumericUpDown 控件。 将它们粘贴到表格中。

  2. 移动新控件以在加法控件下方排列。

  3. 在 属性 框中，为新控件设置以下属性：

    • 将第一个问号标签的 （名称） 设置为 minusLeftLabel。
    • 将第二个标签的 文本 设置为 -（减号）。
    • 将第二个问号标签的“(Name)”设置为“minusRightLabel”。
    • 将“NumericUpDown”控件的“(Name)”设置为“difference”。

  4. 复制加法控件，再将它们粘贴到窗体中两次。

  5. 对于第三行：

    • 将第一个问号标签的“(Name)”设置为“timesLeftLabel”。
    • 将第二个标签 文本 设置为 ×（乘法符号）。 可以从本教程复制乘法符号并将其粘贴到窗体上。
    • 将第二个问号标签的 （名称） 设置为 timesRightLabel。
    • 将“NumericUpDown”控件的“(Name)”设置为“product”。

  6. 对于第四行：

    • 将第一个问号标签的 （名称） 设置为 dividedLeftLabel。
    • 将第二个标签的“文本”设置为 ÷（除号）。 可以从本教程复制分区符号并将其粘贴到窗体上。
    • 将第二个问号标签的“(Name)”设置为“dividedRightLabel”。
    • 将“NumericUpDown”控件的“(Name)”设置为“quotient”。

屏幕截图，其中显示了一个数学测验，其中包含四行问题，标签和带有箭头键的控件可见。

添加“开始”按钮并设置“tab-index”顺序

本部分介绍如何添加“开始”按钮。 还需指定控件的 tab 键顺序。 此排序确定测验参与者如何使用 Tab键 从一个控件移动到下一个控件。

  1. 将 Button 控件从 工具箱 添加到窗体。

  2. 在 属性 框中，设置按钮的以下属性：

    • 将“(Name)”设置为“startButton”。
    • 将 文本 设置为 开始测验。
    • 将字号设置为 14。
    • 将 自动调整大小 设置为 True，这会导致按钮自动调整大小以适应文本。
    • 将“TabIndex”设置为“0”。 此值使开始按钮成为接收焦点的第一个控件。

  3. 将此按钮置于窗体底部附近的中心位置。

    屏幕截图，显示包含四行问题和开始按钮的数学测验。

  4. 在“属性”框中，设置每个 NumericUpDown 控件的“TabIndex”属性：

    • 将 sum 控件的 TabIndex 设置为 1。
    • 将“difference”控件的“TabIndex”设置为“2”。
    • 将 产品 控件的 TabIndex 设置为 3。
    • 将“quotient”控件的“TabIndex”设置为“4”。

运行应用

数学题尚不适用于你的测验。 但你仍然可以运行应用来检查 TabIndex 值是否按预期运行。

  1. 使用以下方法之一保存应用：

    • 选择 Ctrl+Shift+S。
    • 在菜单栏中，选择“文件”>“保存全部”。
    • 在工具栏上，选择 保存所有 按钮。

  2. 使用以下方法之一运行应用：

    • 选择 F5。
    • 在菜单栏上，依次选择“调试”>“开始调试”。
    • 在工具栏上，选择 开始 按钮。

  3. 按几次“Tab” 键，以查看焦点如何从一个控件移动到下一个控件。

下一步

转到下一教程，向数学测验添加随机数学问题和事件处理程序。

教程第 2 部分：向数学测验 WinForms 应用添加数学问题