目 录
1.适用范围... 5
2. 开发环境版本... 6
3. 功能概述... 7
4. 技术实现... 8
4.1 进度条控件属性... 8
4.2 滑块控件属性... 9
4.3 例程操作... 11
1. 适用范围
文档适合经济型、基本型、物联型、86盒系列等串口屏产品。
2. 开发环境版本1. VisualTFT软件版本:V3.0.0.636 及以上;
版本查看:打开VisualTFT,点击帮助->关于VisualTFT可以查看当前软件版本号;
最新版本可登陆www.gz-dc.com进行下载
2. 串口屏硬件版本:V2.22.649.XXX及以上。
版本查看:(1) 查看屏幕背面版本号贴纸。
(2) VisualTFT与屏幕联机成功后,右下角显示的版本号。
3. 功能概述
进度条控件,可以比较形象地对数据进行显示,反映外部上传到屏幕的数据真实现状。
滑块控件,通过对滑块的拖动,可以对外部设备进行控制,比如控制灯的亮度、控制电动机的转速。
4. 技术实现4.1 进度条控件属性
熟悉控件的属性窗口可以更好地对控件进行设置,如图 4‑1所示为进度条控件的属性窗口,主要可以对数值、类型、背景、前景进行设置。
图 4‑1 属性窗口
1. 数值
起始值:进度条最小的那个数值。
终止值:进度条最大的那个数值。
数值显示:设置数值文字的显示方式,可以设置数值的文字大小、文字颜色、是否显示百分号。
2. 类型
进度条类型:有“水平/左”、“水平/右”、“垂直/左”、“垂直/右”四种可选,如图 4‑2所示分别为四种进度条的类型。
图 4‑2 进度条类型
3. 背景
背景类型:有“透明”、“单色背景”、“背景图片”可选,选择“单色”可以设置单色的颜色、选择“背景图片”,可以自定义背景图。
4. 前景
前景类型:跟背景设置一样,有“透明”、“单色背景”、“背景图片”可选,选择“单色”可以设置单色的颜色、选择“背景图片”,可以自定义背景图。
4.2 滑块控件属性
熟悉控件的属性窗口可以更好地对控件进行设置,如图 4‑1所示为滑块控件的属性窗口,主要可以对数值、行为、标尺、背景、游标进行设置。
图 4‑3 属性窗口
1. 数值
起始值:标尺最小的那个数值。
终止值:标尺最大的那个数值。
初始值:游标一开始所在的那个数值。如图 4‑4所示,游标一开始指的数值是20,初始值就为20。
图 4‑4 初始值
2. 行为
拖动输入:可以设置是否可拖动滑块。分为“禁止”、“标尺区域”、“游标区域”。如图 4‑5所示。
图 4‑5 拖动输入
A:禁止,滑块禁止拖动
B:标尺区域,可以在标尺区域内滑动滑块。
C:游标区域,只能在游标区域内滑动滑块。
通知:当拖动滑块时屏幕上传数据。
3. 标尺
方向:分为“垂直”和“水平”。两种方向的标尺如图 4‑6所示。
图 4‑6 方向
标尺类型:分为“偏移”和“居中”。设置“偏移”标尺往一边偏移;设置“居中”标尺居中。如图 4‑7所示。
图 4‑7 标尺类型
刻度:标尺上的刻度的个数。如图 4‑8所示,两个控件分别5个刻度和10个刻度。另外还可以对刻度颜色进行更改。
图 4‑8 刻度
显示数值:显示标尺上的数字,可选择“是”或者“否”。
起始留白:标尺开端离边缘的距离。如图 4‑9所示,分别起始留白50和25分辨率。
图 4‑9 起始留白
终止留白:标尺终端离边缘的距离。如图 4‑10所示,分别终止留白50和25分辨率。
图 4‑10 终止留白
4. 背景
背景类型:分为“透明”、“单色背景”、“背景图片”、“系统默认”四种,其中”单色背景”可以设置自定义背景颜色,“背景图片”可以设置自定义图片。
图 4‑11背景类型
5. 游标
游标类型:分为“系统”和“图片”,其中“图片”可以用自定义图片进行设置。
游标方向:游标方向有“左/上”、“右下”、“两边”,三种方向分别如图 4‑12所示。
图 4‑12 游标方向
偏移:游标偏离标尺上方的距离。如图 4‑13所示,分别偏移14和30分辨率。
图 4‑13 偏移
游标宽:游标的宽度,可以自定义。
游标高:游标的高度,可以自定义。游标高度不可以超过滑块控件的边界。
4.3 例程操作
注:这里例程进度条控件和滑块控件两个控件插入在一张画面中进行演示。
1、新建一个画面,设置好画面的背景图,然后在如图 4‑14所示的标示区域分别插入一个进度条控件和一个滑块控件。
图 4‑14 设置画面
2、插入进度条控件和滑块控件,如图 4‑15所示。然后分别对两个控件进行属性设置。
图 4‑15 插入控件
3、对插入的进度条控件进行属性设置:数据显示→末端显示;显示百分号→“是”;背景类型→透明
图 4‑16 设置进度条控件
4、对插入的滑块控件进行属性设置:背景类型→透明;偏移→“9”;游标宽→“32”;游标高→“30”,如图 4‑17所示。
图 4‑17 设置滑块控件
5、编译无误后,模拟虚拟串口屏进行效果测试。如图 4‑18所示。
图 4‑18 虚拟串口屏
有奖活动 | |
---|---|
【有奖活动——B站互动赢积分】活动开启啦! | |
【有奖活动】分享技术经验,兑换京东卡 | |
话不多说,快进群! | |
请大声喊出:我要开发板! | |
【有奖活动】EEPW网站征稿正在进行时,欢迎踊跃投稿啦 | |
奖!发布技术笔记,技术评测贴换取您心仪的礼品 | |
打赏了!打赏了!打赏了! |