大彩串口屏WIFI/以太网应用-TCP Client 通讯

卡米拉

http://video.gz-dc.com/WIFI%2C%E4%BB%A5%E5%A4%AA%E7%BD%91%E5%BA%94%E7%94%A8%20-%20TCP%20Client%20%E9%80%9A%E8%AE%AF.MP4

串口屏运行演示视频

一、适用范围

本文档适合大彩W系列选配带WIFI或大彩EW系列带以太网接口的串口屏产品使用。

二、开发环境版本

1. VisualTFT软件版本：V3.0.1.1136及以上的版本。

版本查看：

1) 打开VisualTFT软件启动页面如图2-1软件版本，右上角会显示的软件版本号；

图2-1软件版本

2) 打开VisualTFT，在软件右下角可以查看软件版本图2-2软件版本，最新版本可登录http://www.gz-dc.com/进行下载。

图2-2软件版本

2. 串口屏硬件版本：V3.0.598.0 及以上的版本。

版本查看：

1) 查看屏幕背面版本号贴纸；

2) VisualTFT与屏幕联机成功后，右下角显示的版本号。

三、概述

本例程中，介绍屏幕作为客户端，通过WIFI或者以太网进行SCOKET通讯的过程。本文不在阐述LUA脚本如何连接WIFI，具体可以参考WIFI系列教程，《WIFI应用-网络配置.pdf》。

四、参考资料

1. 《LUA 脚本API V1.4》可通过以下链接下载物联型开发包获取:

http:/www.gz-dc.com/index.php?s=/List/index/cid/19.html

2. 《LUA基础学习》可通过以下链接下载物联型开发包获取:

http:/www.gz-dc.com/index.php?s=/List/index/cid/19.html

3. LUA脚本初学者可以通过下面链接进行学习。

http://www.runoob.com/lua/lua-arrays.html

五、教程实现

本文主要介绍屏幕作为客户端SCOKET通讯，将分以下2点进行说明：

1. 准备工程素材；

2. 配置串口屏工程；

5.1 准备工程素材 5.1.1 准备工程素材

在实现例程前需要作以下3个准备：

1. 硬件平台；

2. 软件平台；

3. UI素材；

该例程使用大彩物联型7寸串口屏DC80480EW070_1V01_CE4为验证开发平台。如图5-1所示；

图5-1 EW系列7寸串口屏

其他尺寸W型的串口屏均可借鉴此教程。

5.1.2 软件及工具

1. VisualTFT 上位机软件

使用大彩自主研发的上位机软件VisualTFT配置工程，登录http://www.gz-dc.com/下载。如图5-2所示；

图5-2  上位机软件

2. NetAssist 网络调试助手

本例程中，使用NetAssist 网络调试助手调试工具和屏幕通讯。在本例程压缩包已包含，也可以自行网上下载。如图5-3所示。

图5-3  网络调试助手

5.2 配置工程

本章节主要介绍以下4点：

(1) NetAssist配置

(2) 工程配置

(3) SCOKET 屏幕收

(4) SCOKET 屏幕发

5.2.1 NetAssist配置

本例程中使用NetAssist网络调试助手演示，配置如下：

1) 协议类型：TCP Server

2) 本地IP地址：根据用户网络为准

3) 本地端口号：本例程中默认是“8080”

4) 连接对象：根据用户网络为准

5) 打开：打开连接，如图5-4所示：

图5-4  NetAssist 配置

注意：NetAssist网络调试助手详细使用教程可在网上查找资料了解

5.2.2 工程配置

在工程属性中，配置网络以下属性：

1) 网络：网卡模式

2) SSID名称：cp(以太网接口可不填)

3) 连接密码：12345678(以太网接口可不填)

4) DHCP：启用

5) 网络服务：服务器

6) 服务端口：8080

属性配置如图5-5所示；

图5-5  WIFI配置

5.2.3 修改服务器IP、PORT

1. 画面配置

在画面ID5中，添加两个文本控件（控件ID7、控件ID13，可弹出键盘输入设置）和一个按钮控件（控件ID9），其中控件ID7显示“服务器IP”、控件ID13显示“端口”。控件ID9为按钮按下时获取当前屏幕配置的“服务器IP”和“端口”。如图5-6所示：

图5-6 画面配置

2. LUA脚本编辑

本例程中，获取和设置port、Server IP的代码如程序清单 1所示：

程序清单 1 修改服务器参数

1. --用户通过触摸修改控件后，执行此回调函数。
   
2. --点击按钮控件，修改文本控件、修改滑动条都会触发此事件。
   
3. function on_control_notify(screen,control,value)
   
4. 
   
5.     if screen == sc_wifiset
   
6.     then
   
7.         ......
   
8. 
   
9.     elseif screen == sc_tcp
   
10.     then
    
11.         if control == 3
    
12.         then
    
13.             ......
    
14. 
    
15.         elseif control == 7
    
16.         then
    
17.             --获取键盘输入的IP
    
18.             server_ip = get_text(sc_tcp, 7)
    
19.             local wificom = 0
    
20.             local mode    = 1
    
21.             --修改服务器IP
    
22.             set_network_service_cfg(wificom, mode, server_port, server_ip)
    
23.             --保存配置
    
24.             save_network_cfg()
    
25. 
    
26.         elseif control == 9 and value == 0
    
27.         then
    
28.             --获取服务器IP、端口
    
29.             local wificom,mode,port,server_addr=get_network_service_cfg()
    
30.             server_ip   = server_addr
    
31.             server_port = port
    
32.             --显示到相应文本
    
33.             set_text(sc_tcp,  7, server_ip)
    
34.             set_text(sc_tcp, 13, server_port)
    
35. 
    
36.         elseif control == 13
    
37.         then
    
38.             local wificom = 0
    
39.             local mode    = 1
    
40.             --获取键盘输入的IP
    
41.             server_port   = get_text(sc_tcp, 13)
    
42.             --修改服务器端口号
    
43.             set_network_service_cfg(wificom, mode, server_port, server_ip)
    
44.             --保存配置
    
45.             save_network_cfg()
    
46.         end
    
47.     end
    
48. end

复制代码

核心API函数

1) set_network_service_cfg(wificom, mode, port, server_addr)

设置网络服务参数

• wificom -默认为0，为1时启用透传模式（即无线串口屏）
• mode -0禁用网络服务，1客户端模式，2服务器模式
• port -服务端口，默认5050
• server_addr -服务器地址，(屏作客户端时)
  
  

2) get_network_service_cfg()

    获取网络服务参数，返回4个参数，说明同上

    wificom, mode, port, server_addr = get_network_service_cfg()

基本思路：当按钮控件ID9按下的时候，触发触摸控件回调函数on_control_notify()，在调用get_network_service_cfg ()获取当前屏幕的网络服务配置，并显示在ID7、ID13的文本控件中。当对文本控件ID7、ID13输入时候，调用set_network_service_cfg()修改配置和保存save_network_cfg()即可。

5.2.4 SOCKET 屏幕收

1. 画面配置

在画面ID5中，添加1个文本控件（控件ID5），作为显示接收到的服务器数据，配置如图5-7所示：

图5-7 画面配置

2. LUA脚本编辑

本例程中，当屏幕接收到服务的数据以16进制的格式显示出来，代码如程序清单 2所示。

程序清单 2 SOCKET 屏幕收

1. --当客户端SOCKET接收到数据时，系统自动回调此函数。
   
2. --接收的字节数组packet，下标从0开始
   
3. function on_client_recv_data(packet)
   
4.     --用于显示接收服务器的数据
   
5.     local client_rec = ‘’
   
6. 
   
7.     for i= 0,#(packet) do
   
8.         --拼接数据
   
9.         client_rec = client_rec .." ".. string.format("%02X",packet[i])
   
10.     end
    
11.     --显示数据
    
12.     set_text(sc_tcp,5,client_rec)
    
13. 
    
14.     --返回1时候，数据不会通过串口发送至用户主板
    
15.     return 1
    
16. end

复制代码

核心API函数

1) on_client_recv_data(packet)

    当客户端SOCKET接收到数据时，系统自动回调此函数。

• packet：接收的字节数组packet，下标从0开始
  

基本思路：当服务器向屏幕发送数据时，屏幕自动回调on_client_recv_data()。本例程中，对接收服务器的数据仅作显示。实际应用中，用户可根据服务器的数据响应不同的动作，如更新文本、设置按钮、进度条、通过串口给MCU动作等等。

5.2.5 SOCKET 屏幕发

1. 画面配置

在画面ID5中，添加1个文本控件（控件ID3），当用户点击文本控件弹出键盘，并将输入的数据发送至服务器，画面配置如图5-8所示：

图5-8 画面配置

2. LUA脚本编辑

本例程中，当获取用户键盘输入值后，以16进制发送到服务器，代码如程序清单 3所示。

程序清单 3 SOCKET 屏幕发

1. --自定义函数，填充缓冲区并发送
   
2. function my_sendToserver(sendData)
   
3. 
   
4.     --发送缓冲区
   
5.     local send_buff = {}
   
6.     --计算字符串函数
   
7.     local send_len  = string.len(sendData)
   
8. 
   
9.     for i = 1, send_len
   
10.     do
    
11.         --将字符转换成16进制
    
12.         send_buff[i - 1] = tonumber(string.byte(sendData, i, i))
    
13.     end
    
14.     --发送服务器
    
15.     client_send_data(send_buff)
    
16. end
    
17. --用户通过触摸修改控件后，执行此回调函数。
    
18. --点击按钮控件，修改文本控件、修改滑动条都会触发此事件。
    
19. function on_control_notify(screen,control,value)
    
20. 
    
21.     if screen == sc_wifiset
    
22.     then
    
23.         ......
    
24. 
    
25.     elseif screen == sc_tcp
    
26.     then
    
27.         if control == 3
    
28.         then
    
29.             --获取键盘输入的数据
    
30.             local sendData = get_text(sc_tcp, 3)
    
31.             my_sendToserver(sendData)
    
32. 
    
33.         elseif control == 7
    
34.         then
    
35.             ......
    
36. 
    
37.         elseif control == 9 and value == 0
    
38.         then
    
39.             ......
    
40. 
    
41.         elseif control == 13
    
42.         then
    
43.             ......
    
44.         end
    
45.     end
    
46. end

复制代码

核心API函数

1) client_send_data(packet)

    通过客户端SOCKET发送报文到服务器

• packet：发送字节数组packet，下标从0开始。
  
  

5.3 下载工程

在我司的上层软件Visual TFT中集成了LUA程序的编译器，可以实现在编译工程的同时将LUA脚本程序一起编译，并且将编译后的图片和程序集合在一个名为DCIOT.PKG的文件中。编译后只需要把DCIOT.PKG文件拷贝到U盘中，插入串口屏并重新上电即可将图片和程序下载到屏中。

欢迎联系我司销售咨询

清茶

支持MQTT吗？还是要自行开发？

Cp`sir

清茶 发表于 2020-12-17 09:50
支持MQTT吗？还是要自行开发？

目前不支持，需要自行开发

南妖

这个例程在哪下载？

Lyming

希望增加断开TCP连接的API，连接另一个服务端，通过保存网络配置来实现，等待wifi连接的时间太久了，希望能增加一下，谢谢！

day929

您好，这个例程，我下载到DC10600KEW070触摸屏中，始终无法与服务器建立通讯。用的助手来模拟的服务器

If后要接end

day929 发表于 2023-8-11 10:15
您好，这个例程，我下载到DC10600KEW070触摸屏中，始终无法与服务器建立通讯。用的助手来模拟的服务器 ...

看一下，工程里面设置的服务器IP和端口号是否正确，屏幕是否和服务器位于同一个局域网内

day929

If后要接end 发表于 2023-8-11 17:16
看一下，工程里面设置的服务器IP和端口号是否正确，屏幕是否和服务器位于同一个局域网内 ...

我用调试助手分别按这个设置，一个做客户端一个做服务器模拟，是可以的，把屏插上去后，还是没用，顺便问一下，大屏支持BACnet通讯吗

If后要接end

day929 发表于 2023-8-11 17:22
我用调试助手分别按这个设置，一个做客户端一个做服务器模拟，是可以的，把屏插上去后，还是没用，顺便问 ...

不支持BACnet通信，可以获取一下屏幕的IP看看

day929

If后要接end 发表于 2023-8-11 18:01
不支持BACnet通信，可以获取一下屏幕的IP看看

这个是获取的地址