工业智能多媒体串口屏 UI开发指南

如何制作UI素材工程技术笔记广州大彩光电科技有限公司修订历史目录1.适用范围 (1)2.UI素材元素的组成 (2)2.1背景图 (2)2.1.1背景图的分辨率 (2)2.1.2背景图的效果 (3)2.2组态控件效果图 (6)2.2.1按钮控件效果图 (6)2.2.2文本控件效果图 (7)2.2.3进度条控件效果图 (7)2.2.4仪表控件效果图 (8)2.2.5滑块控件效果图 (8)2.2.6图标与动画控件效果图 (9)2.2.7菜单控件效果图 (10)2.2.8显示时间效果图 (11)1.适用范围文档适合基本型、商业型、经济型、物联型等所有串口屏产品。

2.UI素材元素的组成在工程画面中，UI素材元素主要由背景图和组态控件效果图组成；背景图是指工程画面中每个界面的显示图，背景图的样式以及效果可以根据需要添加，相应的分辨率需要和串口屏的分辨率一致；组态控件效果图是指控件在不同的状态或者动作的时候呈现出不一样的效果，同一控件的效果图需要做成尺寸、分辨率一样的，只是状态效果显示不一样。

2.1背景图2.1.1背景图的分辨率背景图的制作必须和屏幕里面的分辨率一致，这样可以让背景图看起来更清晰、细腻，像素点更加好看。

在创建工程的时候，在所选的型号中会有对应的分辨率，背景图应该按照该分辨率进行制作，如图2-1所示。

图2-1工程画面分辨率如果手中有屏幕的话，可以通过查看背面的丝印层找到相应的型号，如图2-2所示。

注意：查看丝印层，例如：DC80480B070的话，分辨率是800*480的，即宽度是800，高度是480.如果是DC48270B043的话，分辨率是480*272的，这个需要特别注意，以软件里面的分辨率为准。

图2-2查看丝印层2.1.2背景图的效果背景图主要是指界面的不同背景，一般UI设置中都有主界面以及分界面，主界面上面有多个功能图标可供选择与设置，分界面就是在主界面选择之后进入的界面。

主界面的效果图，如图2-3所示。

串口屏开发流程
串口屏是一种通过串口与外部控制器通信的显示设备。

它具有简单、
方便、易于控制等诸多优点，因此在各种控制场合得到了广泛的应用。

下面来介绍一下串口屏的开发流程。

1. 硬件设计
串口屏的硬件设计需要考虑到多个方面，如选择合适的显示屏、控制
芯片、电源管理芯片等。

同时还需要设计一套可靠的调试接口，以方
便后续的调试工作。

2. 软件开发
串口屏的软件开发需要实现以下几个方面：
（1）串口通讯模块：实现串口的初始化、数据发送、数据接收等功能。

（2）显示模块：实现显示屏的初始化、显示数据的发送、屏幕亮度的
控制等功能。

（3）图形模块：实现在屏幕上绘制图形、图像等内容的功能。

（4）字库模块：实现字符显示及汉字、各类图标等显示的功能。

（5）触控模块：实现触控输入的监测和处理。

3. 调试测试
在软件开发完成后，需要进行调试测试。

测试应涉及到功能测试、性能测试、稳定性测试等多个方面。

测试的结果将决定软件是否可用，因此需要认真对待。

4. 系统集成
串口屏开发完成后，需要将它集成到系统中。

在集成时，需要考虑到串口屏的使用场合、接口方式、命令协议等因素。

同时还需要对系统进行一定的调试和优化，使其与串口屏协同工作。

综上所述，串口屏开发需要考虑到多个方面，包括硬件设计、软件开发、测试调试等。

只有在每个环节都做到尽善尽美，最终才能开发出一款高品质、稳定可靠的串口屏设备。

工业串口屏开发设计好帮手-VisualTFT软件摘要：目前TFT彩屏使用越来越广泛，越来越多的客户开始将单色屏平台升级为彩屏, 但是好好的串口屏不仅仅硬件性能强大、可靠性稳定和成本有性价比，更需要上位机有一个人性化的软件配置和下载，这样才是真正符合用户心理的串口屏。

广州大彩光电科技有限公司推出的工业串口屏开发软件VisualTFT，是国内首个自主创新设计强大串口屏开发IDE环境。

软件上市后，立刻在串口屏整个行业带来了标杆作用，同行类纷纷开始效仿。

那如何使用VisualTFT软件来快速完成串口屏设计呢？任何大彩串口屏用户，使用VisualTFT软件后，只需要3个步骤，即可在30分钟内完成复杂的人机交互设计，真正的“所见即所得，零代码编程”。

(1)准备美工素材。

通过专业美工将开机画面、文本背景、按钮图标、提示框等全部设计好。

(2)利用配套的VisualTFT软件进行画面编辑、控件配置和图片下载。

首先利用上位机VisualTFT软件，将预先设计好的美工图片进行界面排版和控件配置，编译无误后然后运行内置的“虚拟串口屏”进行模拟仿真，最后通过USB将整个工程图片和配置信息下载到串口屏内部存储器中。

下载之前，PC会对工程中的每个画面、图片和控件分配一个唯一的ID号。

(3)用户单片机监听和发送相应的串口指令控制画面显示。

一旦按下屏幕按钮后，用户单片机串口就会收到串口屏上传的按钮ID信息或坐标值，通过对ID进行解析，即可判断出当前按钮所在的画面位置和功能属性，然后主机就可以发送一些相关指令去控制画面显示。

对于无触摸产品，用户则无需时刻监听按钮ID上传信息，直接发送显示指令即可。

由于串口屏内部有6K字节的指令缓冲区，用户主机可无等待、连续发送多条指令后退出串口程序。

整个过程操作简单，程序代码量大大降低。

MCGS高级开发指南 1目录第一章MCGS的可扩充性 (4)1.1 概述 (4)1.2 可扩充的设备驱动构件 (6)1.3 可扩充的功能构件 (7)1.4 MCGS实时数据库对象 (8)1.5 MCGS存盘服务对象 (10)1.6 通过OLE自动化和其它应用程序交互 (12)1.7 通过DDE和其它应用程序交互 (14)1.8 直接操作MCGS的存盘数据库 (16)第二章开发MCGS功能构件 (17)2.1 功能构件的实现方法 (17)2.2 功能构件接口规范 (18)2.3 利用开发向导生成框架 (19)2.4 利用样例程序移植 (22)2.5 测试和挂接功能构件 (25)第三章开发MCGS设备驱动 (27)3.1 设备驱动构件的实现方法 (27)3.2 设备驱动构件接口规范 (28)3.3 利用开发向导生成框架 (32)3.4 利用样例程序移植 (35)3.5 测试和挂接设备驱动构件 (37)3.6 IO端口的操作 (40)3.7 串行口的操作 (43)3.8 设备驱动构件的运行机制 (44)3.9 增加设备构件的属性 (45)MCGS高级开发指南 23.10 定制设备属性设置对话框 (47)3.11 编制简单的设备驱动构件 (48)第四章MCGS系统内部数据对象 (52)4.1 $Year (53)4.2 $Month (53)4.3 $Day (53)4.4 $Hour (53)4.5 $Minute (54)4.6 $Second (54)4.7 $Week (54)4.8 $Date (54)4.9 $Time (55)4.10 $Timer (55)4.11 $RunTime (55)4.12 $PageNum (55)4.13 $UserName (56)第五章MCGS系统内部函数 (57)5.1 数学函数 (57)5.2 字符操作函数 (59)5.3 窗口操作函数 (61)5.4 设备操作函数 (62)5.5 策略操作函数 (63)5.6 事件操作函数 (64)5.7 报警操作函数 (64)5.8 存盘操作函数 (67)5.9 用户权限操作函数 (70)5.10 系统操作函数 (71)第六章MCGS中提供的对象 (205)MCGS高级开发指南 36.1 实时数据库对象 (205)6.2 存盘服务对象 (223)MCGS高级开发指南 4 第一章MCGS的可扩充性1.1 概述MCGS组态软件是一套功能丰富、简单易用的组态软件，大部分工程师都可以很容易的使用这套组态软件来完成一个完整的工程项目。

多媒体界面的设计汇报人：2023-12-28•引言•界面布局与设计•交互设计目录•内容与信息架构•设计原则与实践•设计工具与技术01引言主题介绍多媒体界面设计是指利用图形、文字、声音、动画等多种媒体元素，为用户创造一个友好、易用的交互界面的过程。

随着数字媒体技术的不断发展，多媒体界面设计在各个领域的应用越来越广泛，如教育、娱乐、商业等。

良好的多媒体界面设计可以提高用户体验，增强用户对产品的信任感和满意度。

有效的多媒体界面设计可以引导用户快速了解产品功能和操作方式，提高用户的使用效率和满意度。

创新、独特的多媒体界面设计可以提升产品的品牌形象和市场竞争力，为产品带来更多的商业机会。

设计的重要性02界面布局与设计1 2 3界面布局应简洁明了，避免过多的元素和信息，突出核心内容，使用户能够快速找到所需信息。

简洁明了保持界面布局的一致性，使用户在不同页面之间切换时能够快速适应，提高用户体验。

一致性通过合理的层级关系，将信息按照重要性进行排序，使用户能够按照逻辑顺序浏览信息。

层次感界面布局图标和按钮应直观易懂，能够快速传达其功能和意义，避免用户猜测或尝试。

直观性统一风格大小与形状图标和按钮应保持统一的设计风格，与整体界面设计相协调，提高视觉效果。

根据使用场景和功能需求，合理设计图标和按钮的大小与形状，以满足用户操作习惯和视觉需求。

030201图标与按钮设计色彩能够表达情感和氛围，应根据界面主题和功能选择合适的色彩搭配，提高用户体验。

情感表达字体选择应考虑易读性和可读性，确保用户在浏览信息时不会感到疲劳或难以阅读。

易读性色彩和字体应与品牌形象相符合，提升品牌认知度和形象。

品牌形象色彩与字体选择03交互设计通过平滑的动画效果实现页面之间的过渡，提高用户体验。

动画过渡在界面中加入动态元素，如飘动的图标、闪烁的光效等，以增强视觉效果。

动态元素通过交互动画实现用户与界面的互动，如按钮按下时的反馈动画。

交互动画动画效果选择合适的背景音乐，营造氛围，增强用户体验。

目录一．硬件连接 (1)1.屏命名规则 (1)2.C系列屏 (1)2.1. 实物图如下图1（具体型号请参考对应数据手册）所示： (1)2.2. 串口引脚接法说明： (2)2.3.用户接口方式 (2)3.T系列屏 (2)3.1 .实物图如下图2（具体型号请参考对应数据手册）所示： (2)3.2 .10pin串口引脚接法说明： (3)3.3. 8pin串口引脚接法说明： (3)3.4. 用户接口方式 (3)4.S系列屏 (4)4.1. 实物图如下图3（具体型号请参考对应数据手册）所示： (4)4.2. 10pin串口引脚接法说明： (4)4.3. 8pin串口引脚接法说明： (4)4.4. 用户接口方式 (5)5.18系列屏 (5)5.1. 实物图如下图4（具体型号请参考对应数据手册）所示： (5)5.2. 6pin串口引脚接法说明： (6)5.3. 用户连接端子 (6)二．软件设计 (6)1.开发原理 (6)2.开发前准备资料 (7)2.1 软件 (7)2.1.1 配置软件 (7)2.1.2 0号字库软件 (9)2.1.3 汉字字库生成软件 (10)2.1.4 迪文ICO生成图标库软件 (11)2.1.5 迪文图片分辨率转换软件 (14)2.2 硬件 (16)2.2.1 连接线 (16)2.2.2 下载工具 (17)3.软件开发步骤 (18)3.1. 软件界面介绍 (18)3.2. 通讯说明 (18)3.2.1 数据帧架构 (18)3.2.2 指令集及说明 (19)3.2.3 0x80、0x81指令说明 (19)3.2.4 0x82、0x83指令说明 (20)3.3. 例程说明 (20)3.3.1. 屏按键功能（与上位机交互） (21)3.3.2. 屏显示/不显示变量功能（启动描述指针功能） (21)3.3.3. 数据存储功能（掉电保存） (23)3.3.4. 上电初始化 (24)3.3.5. 不带触摸的屏实现触摸屏功能 (25)4.SD卡升级内核程序 (27)4.1. SD卡升级内核应满足以下任一条件： (27)4.2. SD卡升级注意事项 (27)三．注意事项 (27)一．硬件连接1.屏命名规则图12.2. 串口引脚接法说明：图23.2 .10pin串口引脚接法说明：4.S系列屏4.1. 实物图如下图3（具体型号请参考对应数据手册）所示：图3后的短接焊盘来改变电平为3.3V的COMS电平；供电可以通过焊接屏后的短接焊盘来改变供电范围，具体参数请参考对应型号数据手册；4.3. 8pin串口引脚接法说明：4.4. 用户接口方式10 Pin_1.0mm FCC , 8 Pin_2.54mm5.18系列屏5.1. 实物图如下图4（具体型号请参考对应数据手册）所示：图45.2. 6pin 串口引脚接法说明：引脚名称 说明 GND 接地485_- 接485接口的B 端 485_+ 接485接口的A 端232_Tx 屏发送端，接控制端的接收端 232_Rx 屏接收端，接控制端的发送端VIN 典型12V 供电，宽压供电，具体型号屏请以对应数据手册为准SD 卡座SD 卡下载接口，凤凰端子边上5.3. 用户连接端子6Pin_3.81mm 凤凰端子；二．软件设计1.开发原理开发原理概述：使用迪文DGUS 配置软件将变量和需要实现的功能关联起来，然后通过控制端给该设置的变量赋值来实现对应的功能，或读取变量值来查看屏当前相关功能的状态； 变量地址：是针对屏来进行定义的，类似组态软件的地址定义，又不相同，主要区别在于组态软件的地址是有特定含义的（即和屏内部的某个功能已绑定），而采用DGUS 屏的变量地址可以与任意功能来进行关联（不出现变量地址交叉的情况即可），变量地址范围为0x0000——0x6FFF ；变量地址 屏显示、触控功能 单片机 绑定 对变量读写 配置软件设置设置配置时定义变量地址2.开发前准备资料2.1 软件2.1.1 配置软件配置软件的主要目的是配置屏的触控、通讯参数设置及显示参数设定；配置软件如下图5所示：图5软件使用操作步骤：1.新建一个工程文件，如下图6所示选择屏的分辨率及存储位置；分辨率举例说明：屏型号：DM T80480T070_06WTT：16位色；80480 ：800 x 480的分辨率；注：由于所有K600+的屏都是16位色，软件已屏蔽位色选择功能，若屏需要竖起来显示（及该为480 x 800的方式），可以修改软件目录下Config文件夹上的Terminal文件来修改分辨率，修改为480 x 800 ，如下截图7所示（设置R10=480X800）：图6图72.注：若图片不是按照存储位置方式命名，添加进来图片后，软件左边“位置”一列，对应的是设置触控及显示的位置，如将上图位置修改为1，再做设置，那么0界面（即首页）的触控及显示设置都将到次页（即1界面）上。

三易串口屏数据手册SANY-WV-S70-0X版本修订记录版本日期修订内容简要编写审核1.0 2020-06-18 初次编撰周新富吴兰斌目录产品简介： ................................................................................................................................................ 错误!未定义书签。

硬件介绍 .................................................................................................................................................... 错误!未定义书签。

调试工具 .................................................................................................................................................... 错误!未定义书签。

详细规格 .................................................................................................................................................... 错误!未定义书签。

产品定制 .................................................................................................................................................... 错误!未定义书签。

多媒体交互系统中的用户界面设计指南随着多媒体技术的发展，多媒体交互系统在我们的日常生活中变得越来越普遍。

无论是在家庭娱乐领域、教育培训行业还是商业广告界，多媒体交互系统都起到了至关重要的作用。

而一个成功的多媒体交互系统，离不开一个用户友好、直观、易用的用户界面设计。

本文将为您介绍多媒体交互系统中的用户界面设计指南，希望能够对设计师们在这一领域中提供一些有用的指导。

1. 界面布局和导航1.1 易于理解的布局：用户界面应该以一种有逻辑性的方式来呈现信息，让用户能够轻松地找到自己所需的功能。

1.2 目录和导航栏：通过清晰的目录和导航栏，使用户能够快速浏览和访问系统中的不同功能和内容。

1.3 优化响应时间：保证系统的响应时间在可接受范围内，否则用户体验会大打折扣。

2. 图形和视觉设计2.1 一致的风格和颜色：为用户界面选择一致的风格和颜色，以增强用户对系统的可识别性和易用性。

2.2 合理使用图形元素：使用图形元素来凸显重要信息和功能，但要注意不要过度使用，以免造成混乱和视觉疲劳。

2.3 强调重点：通过对信息的大小、颜色、样式等方面的调整，强调重点，帮助用户更快地理解和使用系统。

3. 交互设计3.1 易于操作的控件：使用常见的交互控件，如按钮、输入框和滑块等，以使用户能够直观地操作系统。

3.2 简化输入过程：尽量减少用户的输入操作，可以通过默认设置或自动填充等技术简化输入过程。

3.3 反馈和提示：在用户操作时给予明确的反馈和提示，让用户知道他们的操作是否成功。

4. 多媒体元素使用4.1 视频和音频播放：确保视频和音频的播放控制按钮清晰可见，并提供音量控制和进度条等功能，以方便用户控制媒体的播放。

4.2 图片和图标：使用高清晰度的图片和有意义的图标，以增加用户对界面内容的理解和认同。

4.3 动画和过渡效果：适量使用动画和过渡效果，以提高用户对界面的吸引力和可视化效果。

5. 可访问性和可用性5.1 考虑不同用户群体的需求：用户界面设计应兼顾不同年龄、性别、能力、文化背景等用户群体的需求，确保其易用性和可访问性。

TI6304是一款先进的开发板，广泛应用于各种嵌入式系统的开发和测试。

本手册将详细介绍TI6304开发板的操作方法，包括硬件接口、软件开发环境、常见问题解决等内容。

一、硬件接口1. 电源接口：TI6304开发板采用标准的5V直流电源，用户可通过Micro USB接口或者外部电源适配器进行供电。

2. 通信接口：TI6304开发板提供丰富的通信接口，包括USB接口、以太网接口、SPI接口、I2C接口等，用户可根据实际需求选择合适的接口进行通信。

3. 扩展接口：TI6304开发板提供多个扩展接口，包括GPIO接口、UART接口、CAN接口等，用户可通过这些接口连接外部设备进行数据交换和控制。

4. 显示接口：TI6304开发板支持HDMI输出，用户可通过HDMI接口连接显示设备进行图像输出。

二、软件开发环境1. 编译工具链：TI6304开发板支持多种编译工具链，包括GCC、Keil、IAR等，用户可根据实际需求选择合适的工具进行软件开发。

2. 调试工具：TI6304开发板支持JTAG调试接口，用户可通过JTAG接口连接调试工具进行程序调试和性能分析。

3. 操作系统支持：TI6304开发板支持多种操作系统，包括Linux、RTOS等，用户可根据实际需求选择合适的操作系统进行开发和测试。

三、常见问题解决1. 开机问题：如果TI6304开发板无法正常开机，用户需首先检查电源供应是否正常，然后检查硬件连接是否正确，最后可通过调试工具进行故障诊断。

2. 通信问题：如果TI6304开发板无法正常进行通信，用户需首先检查通信接口的连接是否正常，然后检查通信协议是否设置正确，最后可通过调试工具进行通信协议分析。

通过本手册的学习，相信用户能够更加熟练地操作TI6304开发板，更加高效地进行嵌入式系统的开发和测试工作。

如用户在使用过程中遇到其他问题，请随时通联我们的技术支持团队，我们将竭诚为您提供帮助。

四、高级功能介绍TI6304开发板在基础功能的基础上，还具有许多高级功能，包括但不限于：1. DSP功能：TI6304开发板内置了强大的数字信号处理器（DSP），用户可以利用DSP功能进行音频处理、图像处理等高级数字信号处理任务。