2.windows桌面应用程序，完善程序需求，设计UI样式

文章目录

概要

1.对软件提出需求，尽量考虑周到
2.根据设计一个UI样式

流程

需求：设计一个串口调试助手
1.实现串口接收功能
2.实现串口发送功能
3.可以自动刷新并选择现有串口号
4.可以自由编辑输入波特率
5.可自由编辑选择数据位和停止位
6.可自由选择偶校验和无校验
7.接收数据显示可选择打开和关闭，且可以自由选择接收数据ASCII和HEX显示
8.接收数据实时写入制定文件夹内的文本文件中
9.可对保存文本文件名称命名，如果重名会清除之前的文本文件后重新创建一个
10.可以发送数据给串口，发送数据长度限制最长200，可自由选择发送的数据是HEX数据或者ASCII数据
11.可自由选择是否循环发送数据，可自定义循环发送数据的周期

简易UI设计
我不是专业的UI设计工程师，不知道他们会如何制作UI，但是根据目前这个工程绘图的方式我们需要了解每个空间所在的位置和大小才能完成绘制，和现在QT这些更方便的可手动拉取控件的绘制方式不同，所以我简单设计了一个串口助手的界面。根据需求对基本控件做了些功能说明。下一步就是对每个控件的初始位置和大小做设置

控件位置和大小
整体窗口大小确定为横向700乘以纵向550像素，在这里绘制都是像素为单位，我绘制了一个按钮进行尝试确认是从左上角开始进行绘制的，所以要确认每个像素的左上角的单位，以横向X纵向Y来表示，还有设置大小以横向长为M，纵向长为N表示的话就是如下图
（X，Y，M，N）：

由于文字的特殊性，长度会有变化，所以我就先不排， 等完成控件后再根据控件增加文字

我绘制按钮的尝试代码：
MyUartAssist.cpp

// TODO: 在此处添加使用 hdc 的任何绘图代码...CreateMyButton(hWnd, hInst,(HMENU)IDC_MYBUTTON,10,10,100,20,TEXT("我的按钮"));

MyButton.cpp

#include"MyUartAssist.h"#include"framework.h"//绘制按钮函数intCreateMyButton(HWND hWnd, HINSTANCE hInst, HMENU id,int x,int y,int width,int height, LPCWSTR text){// 创建按钮
    HWND hwndButton =CreateWindowW(L"BUTTON", text, WS_TABSTOP | WS_VISIBLE | WS_CHILD | BS_DEFPUSHBUTTON,
        x, y, width, height,
        hWnd, id, hInst,nullptr);if(!hwndButton){return-1;}else{return0;}}

MyButton.h

#pragmaonce#ifndefMYBUTTON_H#defineMYBUTTON_H#include"MyUartAssist.h"#include"framework.h"#include<iostream>#defineIDC_MYBUTTON2000intCreateMyButton(HWND hWnd, HINSTANCE hInst, HMENU id,int x,int y,int width,int height, LPCWSTR text);#endif// MYBUTTON_H

MyUartAssist.h

#include"MyButton.h"

技术名词解释

UI:是“用户界面”（User Interface）的缩写，它是指人和计算机系统交互的界面。UI 设计的目的是让用户能够轻松使用软件或硬件，通过视觉和交互元素来传递信息、执行命令和导航系统。

技术细节

再用VS2022绘制时关于字符串一定要使用宽字符的，TEXT(“我的按钮”)中TEXT会自动转为宽字符，有的都要这个就对了，没有转换宽字符的会因为Unicode字符集是宽字符而很可能报错，这个不做详细研究，反正这样用就对了，还有就是我再函数中使用的L"BUTTON"也是转宽字符的

小结

样式大概设计出来了，下面的很多节我会分别开始绘制控件了，等到控件，界面文字完成之后再对软件的内容，也就是功能给加上去。