今天去拜访了一个客户，在沟通中了解到了客户目前在用的一直是串口屏，并且分农业级别和工业级别的，屏幕不算大，大概3.5寸，农业级别的价格在五六十块钱，工业级别由于产品温度要求高，价格在一百多块钱，比我们段码液晶屏大概贵了3-4倍，很多人不懂串口屏是什么，简单的来讲串口屏就是带串口控制的液晶屏，详细定义：一套由单片机或PLC带控制器的显示方案，显示方案中的通讯部分由串口通讯，UART串口或者SPI串口等；它由显示驱动板、外壳、LCD液晶显示屏三部分构成。接收用户单片机串口发送过来的指令，完成在LCD上绘图的所有操作，也就是所谓的真彩屏，高显示相对于段码液晶屏来讲要丰富的多，价格高功耗大。



段码液晶屏，或段式液晶屏，是液晶产品中的一种，但在液晶行业内，一般称为图案型液晶屏，笔段式液晶屏，单色液晶屏等等，主要是替代LED数码管（由7个笔段组成，用于显示数字0～9），价格平民化、功耗可以忽略不计，更适用于用量大的行业，相对可以节约成本。

想做一个人机交互的显示屏，之前准备用FSMC接口自己做的，后来发现界面太丑了，而且麻烦。这时候突然在淘宝上搜到了串口屏，果断买了一个，还真是个神器。下面简单总结下串口屏的开发步骤：
1）下载相应的上位机软件，自己用PS做好UI界面，直接导入进去，添加相应的按钮即可
2）将TFT工程下载到串口屏
3）将串口屏的串口与MCU的串口连接通信
本人第一次买的上海一家公司的屏，上位机软件不过关又不退货，后来用大彩的，真心赞，而且资料齐全。程序框架一目了然。
他们自带的程序是Keil4，我将其移植到正点原子的开发板，附件上传我移植到正点原子模板的程序。
https://download.csdn.net/download/weixin_42445727/10490522

 概要：USART HMI智能串口屏，该显示屏的介绍、GUI界面的设计、通讯方式和修改控件参数的相关指令等。

    一开始我们项目组在显示上用的是12864液晶显示屏（带字库），但是看起来效果不是很好，感觉很LOW，而且不知道什么原因，12864常常会指针乱飞，显示一堆乱七八糟的字符，有时候只是不小心用手碰了一下读写或者数据的几个引脚，就开始显示乱码（不排除是因为自己写的代码有BUG的原因）。在一次跟学长的闲聊中，得知有工业串口屏、工业组态屏这些东西，专门用来做工业智能显示仪表的屏幕，一般都有软件以拖控件的形式对GUI界面进行设计，学长当时就给我们推荐了USART HMI智能串口屏，这种显示屏自带GUI，供电就可以使用，可通过串口通信对控件上的参数进行修改，还有一些特定的指令可实现一些功能操作，任何有串口通信功能的单片机都可以带得动，即便它是彩屏，也无需单片机去驱动。

    先附上一张USART HMI智能串口屏的产品介绍书的部分截图。



 

    淘宝上可进行购买，宝贝详情中便有这玩意的相关资料，资料中有专门用来设计这款显示屏GUI的软件，如果做项目想用好看一点的屏幕却不想上STM32等性能比较强的单片机的话，建议可以试试这款显示屏。强行安利一波！！！23333

    接下来是对这款显示屏的GUI的设计方面的说明。淘宝详情里有个教程视频，好像在PC端淘宝网页才可以正常观看，基本的控件的使用都有简单的说明，具体使用方法得自行摸索。以下只简单说一下本人在学习时的一些技巧。

    在开始前，要说的是，官方有个社区（论坛），里面有素材库，可以免费在里面下载工程文件参考学习或者快速开发，只需要注册即可，我们的项目的GUI也是以其中的一个超声波水位监测的项目作为参考，其中的程序也是如此，特此声明。

    1. 做好UI设计的素材作为背景图。

    注意尺寸要与所购买的显示屏大小一致！！！！我买的是240*400的，做的图也是这个尺寸。如下图。   

 

    事先做好UI，是为了方便后面在软件上拖对应的控件到预期的位置，最主要的还是可以省屏幕的内存，是的，这个屏幕也是需要用内存的，而且要特别省！！！预留字符长度都尽量的卡好，不然像我这样十个页面左右的，分分钟用完内存。（还不是没好好看选型手册的锅。QAQ）

    为了省事，本人是在PPT上进行简单的UI设计，因为相对PS来说，更方便拖拽对齐等功能的实现。强迫症患者童鞋注意，项目期初的UI只需要满足基本功能和美观即可，不可过早的追求美观而拖累项目进度。

    2. 打开软件，新建项目并设置。

    首先打开软件，选择你所买的屏幕的型号，这也决定了你的显示界面的最大尺寸，型号一般在装着显示屏的盒子上贴着，选择你显示的方向，横屏还是竖屏等。如图。

 

    然后进入设计界面，先把我们事先做好的图片素材添加到左下角的图片素材管理区里，然后在右侧页面管理区添加页面，一般第一个作为主界面，其他的是做触发某些事件后切换的界面，比如点击设计的“设置”按钮，切换到设置界面。



    建议给这些界面都起对应功能的名字，双击重命名，否则需要的界面比较多时很容易弄乱。每个界面都需要设置一下背景填充，选择图片，作为背景，然后下面pic里选择对应的图片素材。

    

    在需要显示某些参数的页面，比如主界面，往往需要返回该页面的ID值给单片机，告知单片机显示屏现在处在主界面，ID值是根据页面顺序给的编号，返回页面ID值的代码：sendme  //发送当前页面ID号到串口。       

    同样其他需要返回ID值的页面也是如此。

 

  

 

14.sendme 发送当前页面ID号到串口
		

			
sendme

			实例1：sendme   (此指令不需要参数)

			备注:
			设备收到此指令会立刻把当前页面的ID号发送到串口，如果想要每次刷新页面自动发送页面ID,请在页面的初始化事件里写上sendme语句即可。发送格式请参看本表格后面的"串口HMI设备返回数据格式"表格。
		
    3. 添加按钮控件，并对其进行属性设置。

    在界面中添加按钮，属性编辑中，按钮的背景填充里有单色、切图、图片，如果UI设计的时候有把按钮也画上去了，就只需要选择切图，如果没有，一般选择单色，单色的按钮可选择颜色等，但是给人感觉像是win XP时候的按钮风格，实在是丑得可以，不能接受的就得像我一样在背景图里画好按钮，在编辑按钮属性里选择切图。另外说一下，选择切图时是要选择默认按钮背景和按下时切图的两个图片，不然编译时会报错。在此不再放图详细说明，自行感受即可。

    顺带一提，如果按钮上带有文字，如“设置”二字，且想改变文字的字体及大小等，可在图片素材旁的字体库添加自己制作的字体，你可以在这个软件上面工具那里的字库制作中，制作你所需要的字体库。

    添加好按钮，还得编写弹起事件代码，例如“设置”按钮，弹起后应切换到设置页面，代码：page Init  //Init是我给设置页面起的名字。

 

 

 

1.page 刷新页面
		
page pageid

			pageid:页面ID或页面名称

			实例1:page 0 (刷新ID为0的页面)

			实例2:page main (刷新名称为main的页面)

			备注：
			
1.设备上电自动刷新第0页。
			2.也可以对系统变量dp赋值来实现跳转页面(如dp=0)，系统变量dp可以设置可以读取，具体请参看系统变量列表。
		
    4. 添加文本控件，并对其进行属性设置。

     

    需要注意的两点。一是文本控件可绑定键盘，有数字键盘和输入法全键盘等，当在显示屏上点击该文本区域，可通过键盘输入改变本文内容，再通过返回该文本参数的指令即可得到改变的文本内容，十分的方便。二是因为该显示屏的内存有限，需要卡好字符长度，以节省内存。

    5. 添加进度条控件，并对其进行属性设置。

    在项目中需要使用进度条控件作为水位高低的直观显示，需要把进度条旋转90°，并改变填充颜色为蓝色。水量以百分比的形式体现，与进度条一致。

 



    6. 添加双态开关控件，并对其进行属性设置。

    双态开关用来做某功能的开关按钮，并显示其状态量。按下后可通过显示不同状态的图片来显示其状态量。





    7. 添加二维码控件，并对其进行属性设置。

 

    8. 添加定时器控件，并对其进行属性设置。



--------------------------------------分割线------------------------------------

    以上便是我在项目中所使用的所有控件，也是一些很常用的控件，实际上还有好几种常用的控件，比如滑块、复选框、单选框、指针等，特别是指针，在类似汽车行程量表这样的界面显示时很是方便，改变控件参数的方法便是通过串口通信给显示屏发送相应的字符串——控件指令代码。要区分哪些是显示屏自身的事件发生控制代码，哪些是去控制控件的指令代码。官方教学视频中都有详细介绍，看了本文还不太懂的童鞋多看看官方教学视频。

    有点啰嗦了，最后附上几个官方链接。

    1. 基本型串口HMI资料包下载地址(内含USART HMI软件+资料+应用实例): 

    http://tftdata.tjc1688.com/USART HMI/USART HMI.rar

    （因为发现使用超链接无法正确跳转到下载网址。）

    2. USART HMI视频在线观看地址：点击打开链接

    3. USART HMI社区论坛地址：点击打开链接

    4. 淘宝链接，该商品与本人无关！！！只是方便给大家看产品介绍：点击打开链接

有很多事，把它说清楚了，就简单了，比如用触摸屏开发HMI。

触摸屏是很常见的，比如说你用的智能手机，用手指在上面划划划就能显示出我们想要的页面，比如说早些年很流行的画画板，用触摸笔在上面画一画就能画出让你开心的图画，如此这般地数不过来。
1、    什么是串口触摸屏

串口触摸屏首先是一种触摸屏，是可以显示的，文字、图案等，是触摸操作的，你用手指在上面触摸、滑动就能控制屏幕、传递信息，然后它是使用串行通信的，在触摸屏与控制器之间，通过串口进行数据交换。


2、串口触摸屏的优点

串口触摸在工业控制领域应用很广泛，它：

    指令简单。用串口指令就能让触摸屏与控制器之间进行通信，进而命令其他设备动作。

    具有通用性。只要控制器支持串行通信，就能使用这种触摸屏，那么其实市面上大部分工业控制器都是可以的，类似单片机、PLC等等。

    用户操作界面（GUI）设计不难。一般用厂家提供的开发软件做GUI设计不算难，假如你有VB、C#等编程的基础，那么就更容易了，无非就是放置控件、编辑控件的属性、设置事件、编辑动作代码等就可以了。


3、串口触摸屏的应用

串口触摸屏一般用于工业控制、设备制造上等，用来代替传统的按键、旋钮、数码管等元件，在一个屏幕上就能显示和控制。


4、怎么用串口触摸屏开发HMI

串口触摸屏一般需要配合控制器一起使用，控制器向触摸屏发送显示信息在触摸屏上显示，例如数据变化、设备状态反馈等，触摸屏向控制器发送控件的操作信息让控制器知道操作者对触摸屏做了哪些操作，如某个按键按下、某个多选框被勾选等。

4.1开发流程是怎样的



一般来说，控制器种类很多，PLC、单片机、DSP、FPGA等都可以的，只要支持串口通信即可。

开发的第一步，需要熟悉产品的资料，然后按照厂家提供的规则和要求进行二次开发。接下来，把线接好，在电脑中的厂家提供的开发软件上开发GUI，同时可以进行与触摸屏对应的控制器的开发，GUI开发好后下载到触摸屏里面。一般来说，很难做到一次性就开发成功的，还需要一些调试和修改的工作。经过一段时间有效的工作，那么就完成触屏的开发。下面就详细地介绍一下。

4.2 需要哪些工具

用串口触摸屏来开发人机交互接口，一般来说除了触摸屏之外，还需要这些工具：

    开发软件：开发软件一般由厂家提供，主要功能是用于编辑触摸屏的界面。一般的触屏开发流程是在开发软件上编辑好界面（GUI）之后，然后下载到触摸屏上。开发软件上设计的界面和触摸屏上显示的界面几乎是一样的，在开发软件上做界面开发，和电脑上做软件开发的方法类似，一般就是控件+代码，先放置控件，如按键、文本框等，然后设置控件的事件和动作即可，添加必要的代码。 

    串口下载线：串口下载线有两个功能：1，用于开发软件编辑好的界面从开发软件下载到触屏上。2，用于触屏调试，和控制器程序的调试。

    串口调试助手：用于串口指令和数据调试。

4.3 先要了解什么

需要查看触摸屏的产品手册，了解以下内容：

    电源和信号电平：用什么样子的电源，信号电平是多少。一般12VDC和5VDC的比较常见，TTL的信号电平比较多一些。

    接线方式：触屏的接线方式。一般来说，串口触摸屏至少需要四根线，VCC、GND、TXD、RXD，分别是电源正、电源负、串口接收端、串口发送端。当触屏与控制器的串口连接时，一般触屏的TXD要接控制器的RXD，触屏的RXD要接控制器的TXD，然后它们需要共地。





    通信协议：串口有很多种模式，搞清楚数据位是多少位，是否有校验位，停止位的信息。如“8，N，1”就表示8为数据位，无校验，1位停止位。

    指令：指令规则是厂家提供的，表示用什么指令控制屏幕的显示，点击屏幕会发出什么样子的数据给控制器等等。

4.4 怎么使用开发软件



开发软件就是拿来做触屏界面（GUI）的，先设置好有多少个页面，然后在页面上放置控件，编辑好动作、事件代码和属性，一个触屏的界面就做好了。

图 3 是一款触摸屏的开发软件的界面：

左侧的“控件列表”，当触摸屏的型号选定之后，该屏能支持的控件就都出现在列表里面了。一般的控件有：按键、文本框、多选框、图片控件等，开发者根据需要选择。

中间是 “主界面”，一般在开发软件里主界面显示怎样的，下载到触屏里面也就是这个样子的。在开发的时候，点一下左边的“控件列表”里面需要的控件，在主界面就会新添加一个一样的控件，再用鼠标拖动位置，拖动控件的四个角的方框调整控件的大小，做成我们期待的样子就可以了。

下方的“动作和事件程序编辑”区域是为了设置控件或者页面的事件与动作，如你点击或者其他对触屏上的某个控件动作之后想让触屏干什么，对于串口触摸屏，就是设置让触屏上的串口发出怎样的数据。在编辑动作和事件的时候，先要用鼠标选定对象，比如某个控件、比如某个页面，选定后再在下方编辑动作和事件代码。

右侧的“页面列表”显示了这个触屏有几个画面。在设计的时候一般会把触屏分为几个画面，一个画面完成一个特定的功能，每一个画面可以放置若干个你需要的控件。

右侧的“属性编辑”框用于查看和设置控件的属性，如控件名、长宽高、字体大小、颜色等。使用的时候还是需要先选定，再使用。

上方的“菜单栏”是一些常用到的功能，如“编译”是在开发软件上做完GUI设计之后需要编译一下，看一下有无错误。“下载”就是把做好的GUI下载到触摸屏里面去。

一般在开发软件上设计GUI的流程如下：



4.5 控制器程序编写

这里的控制器是一定要有串口的，且串口的电平要与触屏匹配。

控制器的程序包括两部分：

    发送指令。控制器通过串口向触摸屏发送给指令，用于触屏显示。举个例子，假如触屏当前在页面1时，控制器向触屏发送字符串指令：t0.txt="控制器电路板仪器软件开发找我"，那么就可以让页面1上的文本控件t0显示文字“控制器电路板仪器软件开发找我”。其他具体的指令，查看产品手册。

    接收触屏发来的数据。控制器应当监视串口，随时接收触屏发来的数据，这些数据包括了控件的事件信息，如按键按下，页面切换等。数据格式，还是得参看产品手册。

4.6 调试

GUI做好了，控制器的程序也写好了，以为很完美，可是现实往往是打脸的。不是这里有问题，就是那里有问题，那么就需要调试了。

串口助手是个好软件能显示收发的串口数据，串口下载线也需要。在电脑上安装好串口助手，并接上串口下载线。当串口下载线的另一头与触屏连接时，串口助手就模拟控制器，当串口下载线的另一头与控制器连接时，串口助手就模拟了触屏。在串口助手上能看到收发的信息，与设想来个可视化的对比，问题一般就无所遁形了。

以上只是介绍某一种串口触摸屏的开发方法，不同的屏幕有不同的方法，根据厂家的手册来开发即可，例如，有另外一种触屏的开发基本全是用控制器的指令来控制，开发软件只用于生成触屏的背景，由计算机将图片和汉字点阵通过开发软件预先存储到串口屏的存储器中，然后由控制器通过串口发送指令调用显示。

全文完。