双态按钮控件
1. 属性
属性 |
说明 |
---|---|
id |
控件ID号,不可更改 |
global |
勾选:作用于全局,不勾选:作用于所在页; 不可脚本读写 |
name |
控件名称,可改,默认名称,tgbtn+序号 |
x |
控件起始点x坐标 |
y |
控件起始点y坐标 |
width |
控件宽度,可读写 |
height |
控件高度,可读写 |
locked |
勾选后锁定控件位置,但不影响脚本操作控件属性 |
visible |
控件是否可见,脚本:tgbtn3.visible=1,可见,tgbtn3.visible=0,不可见 |
opacity |
不透明度,opacity=0,完全透明,opacity=100,完全不透明。值介于0~100之间。默认100,非必要不建议修改此项。 |
enable |
功能使能。控制按钮是否可以使用,按钮类支持不可用状态,方便客户有条件的启动按钮。enable=0;不可用 enable=1;可用 |
maxTxtLen |
按钮上文本的最大长度。 |
txt |
按钮上显示的文本。 |
font |
按钮文本使用的字库。 |
fontColor |
按钮文本使用的颜色。 |
bgType |
背景类型,包括按下时 切换背景颜色,切换背景图。 |
bgColor |
如果背景为颜色,此处设置默认的背景颜色 |
pbgColor |
如果背景为颜色,此处设置按下时背景颜色 |
dbgColor |
禁用时所使用的背景颜色。 |
bgImg |
选择背景图片。根据图片资源名称和顺序号选择。 |
bgImgMd |
默认背景图片的对齐模式。 |
pbgImg |
选择按下时的背景图片。 根据图片资源名称和顺序号选择。 |
pbgImgMd |
按下时背景图片的对齐模式。 |
dbgImg |
选择禁用时的背景图片。 根据图片资源名称和顺序号选择 |
dbgImgMd |
禁用时的背景图片的对齐模式。 |
press |
双态按钮是否处于按下状态;1,按下;0,弹起; 此属性可脚本读写; |
2. 示例
2.1. 在脚本中访问属性(控件名以tgbtn0为例)
2.1.1. 获取控件背景类型(tgbth0.bgType)
例如 定义一个整数,获取控件背景类型
int type;
type=tgbtn0.bgType; //返回值为1背景类型为颜色切换,返回值2背景类型图片切换
2.1.2. 设置双态按钮控件的背景颜色(tgbth0.bgColor)
例如 设置控件的背景颜色为红色
tgbth0.bgColor=0xffff0000;//十六进制颜色格式
2.1.3. 设置双态按钮控件禁用时的背景颜色(tgbth0.dbgColor)
例如 设置控件禁用时的背景颜色为红色
tgbth0.dbgColor=0xffff0000;
2.1.4. 设置双态按钮控件按下时的背景颜色(tgbth0.pbgColor)
例如 设置控件禁用时的背景颜色为红色
tgbth0.pbgColor=0xffff0000;
应用技巧:利用控件不同状态下的背景颜色是设计UI是最方便有效的方法,vp提供控件在不同操作状态下的背景颜色供客户使用
2.1.5. 设置双态按钮控件的背景图片(tgbth0.bgColor)
例如 设置控件的背景图片为第二张
tgbth0.bgImg=2;
2.1.6. 设置双态按钮控件禁用时的背景图片(tgbth0.dbgImg)
例如 设置控件禁用时的背景图片为第一张
tgbth0.dbgImg=1;
2.1.7. 设置双态按钮控件按下时的背景图片(tgbth0.pbgImg)
例如 设置控件禁用时的背景图片为第二张
tgbth0.pbgImg=2;
应用技巧:利用控件不同状态下的背景图片可以设计不同风格的ui,vp提供非常自由的图片选择,图片尽量选用JPG格式,系统解码更快,运行更流畅,控件背景图片的对齐方式可以选择页面对齐,这样可以与页面背景用同一张图片,这样会最大程度的减少素材所占空间,系统运行也会更快,G系列暂时不支持带透明格式的png图片,但是S系列则支持这一选项
2.1.8. 设置双态按钮控件是否处于按下状态(tgbth0.press)
例如 设置控件是否处于按下状态
tgbth0.press=0; //0为不按下 1为按下 默认为0
应用技巧:此处为双态按钮一个典型的应用,在两种状态下分别写下脚本,通过其他事件的脚本设置双态按钮的按下或弹起状态,可以触发双态按钮对应的脚本,非常实用,当不需要双态按钮显示时,可以将双态按钮的坐标调整到显示区域之外隐藏。
2.1.9. 设置双态按钮控件的字体文本(tgbth0,font)
例如 设置控件的字体
tgbth0.font=1;
应用技巧:不同的字库,大小字体,清晰度,包含的字符都可以不同,通过改变字库,可以让文本内容变换不同风格,显示效果丰富多姿
2.1.10. 设置双态按钮控件的文本颜色(tgbth0.fontColor)
例如 设置控件的文本颜色为红色
tgbth0.fontColor=0xffff0000;
应用技巧:字体颜色是显示控件不同状态最简单使用的方法,字体颜色的改变多配合协议使用,比如控件显示数据内容时往往用户会设计一个报警范围,范围之内正常的数据可以用绿色来显示,范围之外的数据用红色来显示提醒报警。
2.1.11. 设置双态按钮控件的高度(tgbth0.height)
例如 设置控件的高度为90
tgbth0.height=90;
2.1.12. 设置双态按钮控件的宽度(tgbth0.width)
例如 设置控件的宽度为50
tgbth0.height=50;
2.1.13. 设置双态按钮控件的x坐标(tgbth0.x)
例如 设置控件的x坐标为40
tgbth0.x=40;
2.1.14. 设置双态按钮控件的y坐标(tgbth0.y)
例如 设置控件的y坐标为50
tgbth0.y=50;
应用技巧:控件的宽高和坐标,表示控件在工程中的大小和位置,数值都是以像素为单位,编辑此属性首先要了解工程对应串口屏的像素大小,利用对宽高和坐标的编辑,可以实现控件UI丰富多彩的变换。
2.1.15. 设置双态按钮控件的使能(tgbth0.enable)
例如 设置控件的使能
tgbth0.enable=1; //0为关闭 1为开启 默认为1
应用技巧:失能数值为0则控件禁用,在一些需要控件互锁的场景,或者仅仅用来显示而不需要控件使能的场景大有可为
2.1.16. 设置双态按钮控件显示文本(tgbth0.txt)
例如 设置控件的显示文本为1234
tgbth0.txt=1234; //默认txt
应用技巧:文本内容为文本控件显示的字符,通过建立不同字库,可以显示各种各种常见或者特殊的字符,能满足用户大多数的显示需求。内容属性主要两大用处,首先是显示通信的数据,可以直接显示通信协议传输的数据,也可以根据通信协议传输的数据显示不同内容,其次是最为UI的一部分,显示不同的字符内容,当显示的内容固定不变时,建议将字符内容制成背景图片,ui更加美观,也节省字库。
2.1.17. 设置双态按钮控件的可见性(tgbth0.visible)
例如 设置控件为不可见
tgbth0.visible=1; //0为可见 1为不可见
应用技巧:vp工程中控件并非时时必须显示,可视性这个属性实现了控件视觉效果的可编辑性,用户自定义可视性,可配合其他控件在脚本中编辑,也可以配合协议解析器,在通讯过程中控制控件的显示和隐藏,简单直接且行之有效。
2.1.18. 设置双态按钮控件的透明度(tgbth0.opacity)
例如 设置控件的透明度为50
tgbth0.opacity=50; //0完全透明 100完全不透明
应用技巧:透明度在UI上的用处就是能透过控件看到背景,特定风格之下的UI大有用处,但是透明度会增加系统工作量,非必要时刻不建议使用,如果背景素材希望设置成带透明的,目前网络上很多制图P图软件都可以做到这一点,将素材做成图片图片很多时候都是一个不错的选择。
3. 常见应用
显示开关状态,双态按钮的两种状态完美的契合了很多应用场景种常开或者常关的设置
用来存放特定时候需要执行的脚本,双态按钮的两种状态可以用press属性进行控制,press属性可读写,用户在按下和弹起事件中写入脚本,利用press属性执行指定的脚本
4. 常见问题
可勾选全局属性的控件,在切换页面之后,需要保持上一次的操作,需要将全局属性勾上,否则控件会恢复设置的初始状态。断电再上电之后需要保持断电之前状态的控件,要对相应的数据进行掉电保存,掉电保存操作在掉电保存文档有详细介绍。