这些小活动你都参加了吗?快来围观一下吧!>>
电子产品世界» 论坛首页» 嵌入式开发» MCU» 广州大彩工程技术笔记-如何在串口屏上实现艺术字文本显示V1.0

共1条 1/1 1 跳转至

广州大彩工程技术笔记-如何在串口屏上实现艺术字文本显示V1.0

菜鸟
2016-04-19 17:55:23 打赏
1.适用范围...1 2.开发环境版本...2 3.功能概述...3 4.技术实现...4 4.1准备好艺术字体...4 4.2生产艺术字图标ICON..4 4.3软件界面设置艺术字...6


1.适用范围 文档适合经济型、基本型、物联型、86 盒系列等串口屏产品。 2.开发环境版本 1. VisualTFT软件版本:V3.0.0.636及以上;版本查看:打开VisualTFT,点击帮助->关于VisualTFT可以查看当前软件版本号; 最新版本可登陆www.gz-dc.com进行下载 2. 串口屏硬件版本:V2.22.649.XXX及以上。 版本查看:(1) 查看屏幕背面版本号贴纸。 (2) VisualTFT与屏幕联机成功后,右下角显示的版本号。 3.功能概述在一些特殊场合,串口屏和电脑自带的字体(宋体、雅黑、黑体等)无法满足用户需求,为了使美工图片和字体更加协调一致,用户可以使用美工图片来制作一个个字符,例如数码管字体、带背景图字体、发光字体等等。 该功能主要使用串口屏内部的组态控件:图标控件。用户预先做好所有艺术字图片后,然后通过图标生成工具,将所有的艺术字合成一个ICON文件,然后文本控件调用这个ICON文件,实现艺术字显示效果。 例如:用户单片发送数字123,串口屏内部解析后,就自动调用123对应的艺术字图片,操作简单方便。 4.技术实现 4.1准备好艺术字体美工人员预先设计好对应的0-9、a-z、A-Z和标点符号等图片,图片像素大小按照屏幕实际显示所需设计,如下图 4.1所示,所有图片像素为11*20。 4.1 艺术字图片若界面UI中,同一类的艺术字需要用到不同大小显示,则美工设计时按照最大字号 进行图片大小设计。软件自带的图标生成器支持图片的大小缩放。 4.2生产艺术字图标ICON1. 打开图标生成器。打开VisualTFT软件,点击工具,选择“图标生成”,如图 4.2所示。 4.2 打开图标生成器2. 添加艺术字图片。点击“增加帧”,将预先准备好的艺术字图片全部导入进去,如图 4.3所示。 4.3 添加艺术字图片3. 生成艺术字ICON图标。用户导入进去的艺术字图片宽和高均为原始大小显示,用户也可以进行宽度和高度的微调,如图 4.4所示。注意:低分辨的图片调至高分率会导致图片模糊。图片排列的顺序(从左到右,从上到下)为帧的次序,用户可以任意拖动进行位置调整,最后点击“生成图标”。新的艺术字图标文件如图 4.5所示。 用户也可以点击打开图标文件,检查生产的图标文件是否正确。 特别说明: 艺术字的排列顺序必须严格按照如下规约:【0-9】、【: . * - + ? /】、【A~Z】和【a~z】,否则会导致显示错误。 file:///C:/Users/DC/AppData/Local/Temp/msohtmlclip1/01/clip_image010.giffile:///C:/Users/DC/AppData/Local/Temp/msohtmlclip1/01/clip_image011.gif 4.4 生成艺术字ICON 图标 4.5 艺术字图标ICON 文件 4.3软件界面设置艺术字1. 放置1个文本控件。任意新建一个工程,建立1个画面,导入背景图,然后放置一个文本控件,如图 4.6所示。 4.6 放置1 个文本控件2. 设置艺术字属性。文本控件高度设置为20,保持与原始图片高度一致(若文本控件高度超过图片本身大小,将会显示拉伸模糊),文本初始化值15.5,选择艺术字,导入预先做好的艺术字ICON文件,居中对齐,如图 4.7所示。 4.7 设置艺术字3. 编译并运行虚拟串口屏。编译无误后,运行虚拟串口屏查看结果,如图 4.8所示。 4.8 运行虚拟串口屏查看结果4. 指令助手调试显示。打开指令助手,使用虚拟串口联机好虚拟串口屏(具体操作可以参考文档《指令助手与虚拟串口屏联机调试》),输入画面ID、文本ID和文本123,屏幕上自动调用123显示,如图 4.9所示。 4.9 指令助手调试显示5. 所有操作完毕。



关键词: stm32 串口屏 触摸屏 人机界面

共1条 1/1 1 跳转至

回复

匿名不能发帖!请先 [ 登陆 注册]