与Tim Corey探索C#表单设计——引导讲解

表单构建介绍

Tim 开始时欢迎我们来到第七课，并明确说明其目的：我们正在构建表单。 他提醒我们，这类似于类库的工作，但现在我们根据之前的规划草图实施实际的用户界面。 Tim 指出，我们可能会有在此阶段添加代码的冲动，但他敦促我们仅专注于构建表单。

他还解释说，我们以前的设计是粗略的草图，现在我们正在让表单看起来很好。 Tim 说明设计指南很重要，尽管他不会展示自己经历的实验，但他会带我们查看最终结果。 他还指出第四步规划中的设计是本课的基础，如果需要的话可以参考这些设计。

添加新项目并启动 Windows 窗体应用程序

Tim 向我们展示如何向解决方案添加新项目。 在解决方案资源管理器中，他右击解决方案，选择"添加新项目"，并选择"Windows 窗体应用程序"。 这创建了一种专门用于构建 Windows 桌面应用程序的新项目类型。 他将该项目命名为"Tournament Tracker UI"。

他解释说，当创建 Windows 表单应用程序时，默认 Form1.cs 文件会自动生成。由于应用程序需要一个起始表单，Tim 决定不删除它。 相反，他重命名了文件和类为"TournamentViewerForm"，并接受提示以重命名所有引用。 这确保了应用程序的主窗口将正确运行。

重命名表单类

Tim 强调必须在 Windows 窗体应用程序中有一个运行的表单。 他解释说，如果您删除默认的 Form1.cs，则必须手动更新 Program.cs 中的入口点。 为了避免这种复杂性，Tim 只需重命名表单。 这是启动 Windows 窗体应用程序时的典型步骤：重命名类和文件以匹配项目的目的。

使用属性窗口

Tim 弹出属性窗口并开始修改表单的属性。 他将文本属性更改为"Tournament Viewer"，以便标题栏显示正确的名称。

接下来，他将背景色从默认的 Visual Studio 灰色更改为白色，解释说白色更加现代且不会分散表单内容的注意力。 这是为用户界面建立设计指南的一部分。

然后他将字体更改为 16 点的现代字体，并解释应该早做这一步：以后添加的控件将自动继承新字体。 Tim 说明这是高效构建表单的重要提示。

更改图标和资源

Tim 通过导入一个自定义图标文件来更改表单的图标。他解释说，他使用了一个免费工具"Metro Studio"来创建图标。 这帮助他避免从头编写或设计图标。 他还提到他将在所有表单中使用相同的图标，以为应用程序创建统一的外观。

向表单添加控件

Tim 开始通过从工具箱中拖动控件到表单上来构建用户界面。 他添加一个标题标签并更改其属性：

• ForeColor → RGB (51, 153, 255)

• Font → Light, 28

• Text → "Tournament:"

• Name → "headerLabel"

然后他复制并粘贴标题标签以创建锦标赛名称标签，暂时将其文本设置为"None"并命名为"tournamentNameLabel"。 Tim 解释复制和粘贴控件是保持样式一致和节省时间的快捷方法。

添加回合选择控件

Tim 添加了一个"Round"标签和一个组合框下拉框。 他将标签的字体更改为 20 并将颜色设置为相同的蓝色强调。 他使用 Visual Studio 的对齐指南来确保控件正确对齐。

接下来，他添加一个标记为"仅未播放"的复选框。他将其样式更改为平坦，并将勾选颜色更改为蓝色。 Tim 还解释了他的命名约定：他在末尾添加控件类型（例如，roundDropDown, unplayedOnlyCheckbox）以便于搜索和代码导航。

添加比赛列表和得分控件

Tim 添加了一个命名为 matchupListBox 的 ListBox 并将其边框样式设置为固定单。 他解释说，ListBox 的行为类似于 ComboBox，这使得后续编码更简单。

然后他添加了团队名称和分数的标签和文本框。 他演示了一个强大的技巧：选择多个控件，复制它们，然后一起粘贴。 这保持了间距和布局，加快了设计过程。

Tim 还解释说，您必须正确重命名每个控件，避免诸如 label1 或 textBox2 这样的默认名称，这可能会导致混淆。

添加 VS 标签和得分按钮

Tim 在两个团体部分之间添加了"VS"标签。 然后他添加了一个得分按钮并定制其样式：

• FlatStyle → Flat

• BorderColor → Silver

• MouseDownBackColor → (102, 102, 102)

• MouseOverBackColor → (242, 242, 242)

• Font → Semi-bold, 16

• ForeColor → (51, 153, 255)

• Text → "Score"

他解释说，这些设置使按钮看起来现代且响应迅速，特别是当用户悬停或点击时。

运行表单

Tim 解释说项目目前有错误的启动项目。 在解决方案资源管理器中，类库是粗体的，意味着它被设置为启动项目，但类库不能自主运行。 他将 Tracker UI 设置为启动项目。

当他运行应用程序时，表单以 Windows 10 的风格出现。 Tim 指出按钮的悬停和点击行为，显示用户界面响应迅速且现代。

创建锦标赛表单

Tim 添加了一个名为 CreateTournamentForm 的新表单，并设置其属性（字体、颜色、图标）。 他从锦标赛查看器表单中复制控件以加快开发。

他添加了：

• 锦标赛名称输入

• 报名费用输入（默认值 0）

• 添加团队下拉框

• 创建团队链接标签

• 添加团队按钮

• 创建奖励按钮

• 锦标赛玩家列表框

• 删除按钮

• 创建锦标赛按钮

Tim 解释他的设计选择是保持链接标签为蓝色，因为用户被训练去识别蓝色带下划线的文本为链接。

创建团队表单

Tim 创建了 CreateTeamForm 并添加了：

• 团队名称输入

• 选择团队成员下拉框

• 添加成员按钮

• 用于添加新成员的组框

• 名、姓、电子邮件和手机字段

• 创建成员按钮

• 团队成员列表框

• 删除选中成员按钮

• 创建团队按钮

他解释说，组框提供了视觉边界，使管理组合控件更容易。 这也有助于将组作为一个单元移动时。

创建奖品表单

Tim 构建了 CreatePrizeForm 并添加了：

• 名次输入

• 名次名称输入

• 奖金输入

• 奖金百分比输入

• "或"标签

• 创建奖励按钮

他使用对齐工具来确保布局看起来整洁和专业。

锦标赛仪表板表单

Tim 构建了最后的表单：TournamentDashboardForm。 他添加了：

• 加载现有锦标赛下拉框

• 加载锦标赛按钮

• 创建锦标赛按钮

他使用对齐和间距工具使布局视觉平衡。

命名和组织提示

Tim 强调了正确命名的重要性。 他展示了属性下拉框如何帮助识别未命名的控件，如 label1 或 textBox2 是不小心留下的。 他演示将一个组框重命名为 addNewMemberGroupBox 以便于明确。

设置启动表单

Tim 解释如何在 Program.cs 中更改启动表单。 他更改为：

Application.Run(new TournamentViewerForm());

至：

Application.Run(new TournamentDashboardForm());

他解释这行代码创建了一个窗体实例，并在窗体关闭前暂停应用程序运行。

为什么 Main 很重要

Tim 将 Windows 窗体与控制台应用程序进行比较：两者都有一个静态 void Main。 他澄清一旦 Main 完成，应用程序便关闭。 这就是为什么窗体必须保持打开以便应用程序继续运行的原因。

他还指出 Visual Studio 包含 XML 注释，他鼓励之后为方法添加 XML 文档。

下一步是什么

Tim 在课程结束时表示，下一步是通过逻辑将窗体连接起来。 他向观众保证，令人畏惧的部分即将到来，但一旦窗体构建完毕，它将变得可控。 他表示逻辑将像拼装 LEGO 积木一样，难的部分将随着我们的进展逐渐消失。