持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第11天,点击查看活动详情
本章节,将主要讲述页面的布局和自适应。
组建基本的页面框架
基本的页面将分为工具栏,侧边栏,和工作区三部分
如下如所示
工具栏
主要提供基本的操作选项,包括系统设备,日志查询,帮助信息等
修改界面
新建一个文件夹叫做form
再form中新建立一个窗口叫做mainform用来作为主窗口
修改标题:温湿度小工具
打开工具栏,拖入一个menustrip,dock属性设置为top
如下:
接着拖一个panel到menu下方,dock依旧是top
背景色为:亮白色,高度设定为5
增加工具选项
再menu中增加三个选项,系统设置,日志,和帮助,搞定如下:
侧边栏
侧边栏的作用是根据不同的选项,展示不同的可操作子菜单。
修改界面
拖入一个treeview,docker设置为left,宽度为:200
拖入一个panel,docker设置为left,宽度5
手动添加按钮(目前针对温湿度设备)
点击treeview旁边的三角形操作按钮,进入节点编辑
添加实时数据,历史数据,数据报表三个根节点
代码修改
工具栏按钮点击回调
根据之前的方法,逐一实现系统设置,日志,帮助的回调
系统设置
功能:弹出一个窗口,实现串口配置和打开
新建文件夹,Sysconf,实现一个窗口类,sysconf
界面如下:
回调函数实现:
/// <summary>
/// 系统设置回调
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void 系统设置ToolStripMenuItem_Click(object sender, EventArgs e)
{
Sysconf confwin = new Sysconf();
confwin.ShowDialog();
}
日志
把之前章节的日志按钮代码copy过来
/// <summary>
/// 日志
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void 日志ToolStripMenuItem_Click(object sender, EventArgs e)
{
string date = DateTime.Now.ToString("yyyy-MM");
//默认配置文件地址
string basedir = $"{AppDomain.CurrentDomain.BaseDirectory}logs\\{date}\\";
//MessageBox.Show(basedir);
//打开对话框
OpenFileDialog ofd = new OpenFileDialog();
ofd.InitialDirectory = basedir;
if (ofd.ShowDialog() == DialogResult.OK)
{
try
{
string file = ofd.FileName;
System.Diagnostics.Process.Start("notepad.exe", file);
}
catch
{
MessageBox.Show("打开日志失败,系统中没找到记事本程序");
}
}
}
帮助
功能:弹出一个窗口,显示帮助信息
新建about文件夹,创建一个aboutwein
窗体如下(一个group里面嵌套一个richtext窗体):
回调函数:
/// <summary>
/// 关于
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void 关于ToolStripMenuItem_Click(object sender, EventArgs e)
{
About myabout = new About();
myabout.ShowDialog();
}
修改启动main
/// <summary>
/// The main entry point for the application.
/// </summary>
[STAThread]
static void Main()
{
Application.SetHighDpiMode(HighDpiMode.SystemAware);
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
//Application.Run(new Form1());
Application.Run(new MainFrom());
}
测试
下一节:我们具体实现新建窗体的逻辑,以及把之前的表格和曲线显示集成进来