627

admin

1. 我是一个软件工程师，我想编写一个MQTT物联网通讯的小程序，互动体验感强的响应式界面，可以让用户直观感受到科技的魅力。程序需求如下：
   
2. 
   
3. 一、标题：AI赋能_MQTT，居中用彩色字体显示，双击标题内容本程序窗口居中弹窗可以进行内容修改。
   
4. 
   
5. 二、标题下方用竖向tab标签页分开：1、配置参数区域，2、发布操作区域。
   
6. 1、服务器配置参数区：输入框4个，名字后面冒号的内容为默认值：
   
7.     服务器：i.37ck.cn、端口：1883、 用户名：37ck、密码：20200808。
   
8.     连接服务器按钮：点击连接按钮后，程序自动连接MQTT服务器，连接成功后，显示连接成功提示。
   
9.     断开连接按钮：点击断开按钮后，程序自动断开MQTT服务器，连接断开后，显示连接断开提示。
   
10.     配置参数开关按钮：点击按钮隐藏配置参数区内容，再次点击按钮则显示各项配置参数区，默认状态为隐藏配置参数区。
    
11. 2、发布操作区：有2个可编辑的下拉框，名字后面冒号的内容为默认值：
    
12.     主题：37ck/37创客，该项为下拉框，下拉内容有：37ck/安全蜂速、37ck/富教小学、37ck/文田中学、37ck/莘村中学。
    
13.     指令：AI赋能MQTT，该项为下拉框，下拉内容有：上课啦、开灯、关灯、红灯、绿灯、黄灯、喇叭、下课啦、放学啦、课间休息、紧急通知、到安全等待区、正赶往等待车位。
    
14.     订阅主题按钮：点击按钮订阅服务器的对应主题，订阅成功后显示订阅主题的状态信息在返回框。
    
15.     发送按钮：点击发送指令信息到服务器的主题上。
    
16. 
    
17. 三、最底部状态区域为发送和返回情况区域，各占50%的宽度，具体如下：
    
18. 返回框：显示物联网通讯的记录信息，并一直记录下去，最新记录在第一行显示，直到用户点击清空按钮。
    
19. 发送框：记录发送过的指令，并一直记录下去，最新记录在第一行显示，直到用户点击清空按钮。
    
20. 
    
21. 四、实时接收弹窗：居中弹窗用来显示当前主题实时接收到信息是的内容，用可爱点的字体和背景颜色显示，加入一个输入框设置显示秒数后自动关闭窗口，默认时间为5秒后自动关闭弹窗。

复制代码