- 其余 21 个实验的 task.md:控件名照示例代码,"在平台上怎么试"和评分步骤一致,列出书上的印刷错误和控件名不一致 - 窗体改名:属性窗口里选中窗体可以改名称,类名、构造函数、new X()、Program.cs 和两个文件名一起改;方法名和字符串不变 - 11 个主窗体不叫 Form1 的实验,任务说明提示先改窗体名再双击生成 Load 事件 - 测试:表头只认分隔行上面那一行,数据行里出现"名称"不再被当成表头 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
4.4 KiB
4.4 KiB
任务目标
在任务 1 的程序里新建"校园环境"窗体 Environment,把界面搭好:顶部标题栏和"<返回主窗体",中间是路灯场景的背景图,底部一栏显示火焰、烟雾、光照度、温度、湿度,右边是"路灯控制"和"LED推送"两组控件,左下方是显示一周温度的折线图。这个任务只做界面,采集数据、控制路灯、推送 LED 在任务 3 做。
练习重点:多窗体、面板的多层停靠(Top / Fill / Bottom / Right)、透明背景、复选框、图表(Chart)的系列和图例。详细步骤见书 p159–164。
接着任务 1 的程序做。为了能看到效果,这次先让主界面的"校园环境"能打开窗体、"<返回主窗体"能关闭窗体(书上放在后面的任务里)。
界面和控件名
| 控件 | 名称(Name) | 文字(Text)和用途 |
|---|---|---|
| 窗体 | Environment |
校园环境;FormBorderStyle 设为 None,StartPosition 设为 CenterScreen |
| 面板 | panel1 |
顶部标题栏:停靠 Top,背景色 100, 116, 133,放标题图 ico_title |
| 面板 | panel2 |
停靠 Fill,下面的面板都放在它里面 |
| 面板 | panel3 |
panel2 里停靠 Top,背景色 229, 229, 229 |
| 标签 | lb_return |
< 返回主窗体(放在 panel3 上) |
| 面板 | panel_bg |
panel3 下面停靠 Fill,背景图片 day_02(路灯没亮的场景),背景排列 Stretch |
| 面板 | panel5 |
panel_bg 里停靠 Bottom:环境数据栏 |
| 文本框 | txt_fire、txt_smoke、txt_light、txt_temperature、txt_humidity |
火焰、烟雾、光照、温度、湿度(左边各配一个标签) |
| 按钮 | btn_dataAnalyse |
数据分析 |
| 按钮 | btn_ledEnvironment1 |
推送天气信息(环境数据栏里的那个) |
| 面板 | panel_form |
panel_bg 里停靠 Right,背景色 Transparent,背景图片 bg_from2 |
| 分组框 | groupBox2 |
路灯控制 |
| 复选框 | ch_autoLamp |
自动控制 |
| 文本框 | txt_autoLight |
设定开灯光照值(后面配标签"lx") |
| 图片框 | pic_lampOpen |
灯光控制的开关:背景色 Transparent,背景图片 switch_off |
| 分组框 | groupBox3 |
LED推送 |
| 文本框 | txt_ledMsg |
LED信息(Multiline 设为 True) |
| 复选框 | ch_autoLedFire |
自动推送火情 |
| 按钮 | btn_ledSendMsg |
推送LED信息 |
| 按钮 | btn_ledEnvironment2 |
推送天气信息(LED推送组里的那个) |
| 图表 | chart1 |
放在 panel_bg 左下方,显示最高温度和平均温度 |
书上表 8-6、表 8-7 把四个按钮的"名称"写成了"数据分析""推送天气信息""推送LED信息",那是按钮上的文字。名称按上表写,任务 3 的代码和自动评分都用这些名字。
实现步骤
- 项目资源里再勾选
day_02、bg_from2、switch_off(任务 3 还要用day_01、switch_on,可以一起勾上)。 - 点 + 新建窗体,建
Environment,设成无边框、屏幕居中,调到合适的大小。 - 按"标题栏 → panel2 → panel3 → panel_bg"的顺序拖面板,设好停靠。先放的面板先占地方,放错了可以在属性里改停靠。
- 在 panel_bg 上依次放底部的 panel5(环境数据栏)和右边的 panel_form,再把两组控件放进 panel_form 里的两个分组框。书上要求 panel_form 里的其他控件背景色也设成 Transparent,让背景图透出来。
- 拖一个图表到 panel_bg 上,在属性窗口点系列和图例:
- 图例两个:
MaxLegend、AVGLegend; - 系列两个:
MaxSeries(图表类型 Line,图例 MaxLegend,图例文字"最大值",X 值字段_Time,Y 值字段MaxTemperature)和AVGSeries(Line,AVGLegend,"平均值",_Time,AVGTemperature)。
- 图例两个:
- 主窗体
pic_environment的 Click:new Environment().Show();。 lb_return的 Click:this.Close();(只关掉这个窗体,主窗体还在)。
和书上不一样的地方
背景图片叫
bg_from2:书上写的是bg_form2.png,配套资料里的文件名是bg_from2,素材库也用这个名字。
在平台上怎么试
- 运行后在主界面点"校园环境",打开 Environment 窗体:背景是路灯场景,底部有五个文本框和"数据分析""推送天气信息",右边有"路灯控制""LED推送"两组,左下方有图表(现在还没有数据)。
- 点"< 返回主窗体",Environment 关闭,主界面还在。