Qt5学习笔记之串口助手一：基本界面设计

一、概述

从这一篇文章开始，跟着视频实现一个串口助手。当然，这里实现的串口功能比较简单，只有最基础的串口参数设置、发送、接收。在之后的拓展学习中，我们再实现一个具备完整功能的串口助手，如增加时间戳、周期发送、16进制/ASCII发送等。

Qt的三驾马车：串口编程、网络编程、操作GPIO。

二、界面布局

1.添加接收框、发送框、个人广告框、串口通信参数选择框。

接收框使用的是Plain Text Edit控件：

QPlainTextEdit可以说是一个简化版的QTextEdit类控件。QPlainTextEdit是用逐行逐段滚动的方法替代了像素精准度高的滚动方法，所以效率要更高一些（每次滚动都需要重新的绘制）在处理大批量的文本内容有比较强大的优势。

2.添加操作按钮、广告框中的文本（图片）框、参数含义提示。使用组建Label、Push Button即可

3.对组件进行基本调整和设置，如字体居中等，在之前的QQ登录界面都有提到。需要注意的是，取消接收框的输入权限。

4.对界面进行布局。需要注意的是选择Group Box，设置最小高度，防止布局后“自制串口助手”无法显示。这一点在之前设置图片时同样有提到。

三、添加串口参数

1.双击Combo Box组件，在弹出的对话框中点击“+”号，然后输入我们需要的内容。多次添加即可。添加完后选择OK。

2.选择其中一项，通过上下箭头，即可设置顺序和默认参数。

3.编译查看效果。如果界面的串口通信参数不对齐，则可以通过打破布局，选中这几个Combo Box和Label，然后选择栅格布局即可。

4.另一种设置默认参数的方式：

四、查询可用的COM口

1.修改组件名称。在工程文件中添加串口相关内容。

2.添加获取串口端号代码，并在响应的Combo Box组件中显示。

    foreach(const QSerialPortInfo &info, QSerialPortInfo::availablePorts()) {
        serialNamePort<<info.portName();
        qDebug() << serialNamePort;
    }
    ui->serialCb->addItems(serialNamePort);

serialNamePort是QStringList型，所以ui->serialCb->addItems(serialNamePort);要放在foreach外面，否则会重复添加COM口：

3.编译测试，发现报错。查找发现是上面的代码写丢了一对小括号。正确应为

    foreach(const QSerialPortInfo &info, QSerialPortInfo::availablePorts()) {	//小括号写丢了
        serialNamePort<<info.portName();
    }