首页
新闻动态
产品展示
资料下载
联系我们
新闻动态
新闻动态
当前位置：
网站首页
>
新闻动态
>
新闻动态
新闻动态
png透明图标在串口屏上的应用
分享到：
点击次数：
更新时间：2021-12-18 11:29:05 【
打印此页
】 【
关闭
】
导读：
优秀的UI设计，离不开串口屏的软硬件支持，同样也离不开精美的图片图标素材和合适的文件格式。常用的图标格式有bmp、jpg、png三种格式，特点也各不相同。png图标支持透明显示效果，可以为图像定义不同的透明层次，使得彩色图像的边缘能与任何背景平滑地融合，从而彻底地消除锯齿边缘。而jpg/bmp图标不支持透明层次定义，在需要用到透明显示时，只能采取滤除指定背景颜色的方法实现，就会导致图标边沿与背景融合不顺畅，甚至出现锯齿等现象。
SDWb、SDWap系列串口屏均支持png格式的图标。
一、VGUS组态软件中如何使用png图标
在VGUS组态软件中，任何与图标相关的控件均支持png格式的图标显示。用户端无需任何修改，只需要在上位机开发软件中，添加相应的素材即可。控件的设置方法与以前一致，只需要设置对应图标文件和图标ID号。
png图标素材以及变量图标控件设置分别如图1、图2所示。
图1 图标素材文件列表示意图
图2 变量图标控件属性设置
二、png图标应用案例
2.1 滑动调节背光亮度
图3所示为滑动调节背光亮度的案例，由滑块控件和进度条控件组合设计实现。设计中用到了两个png格式的图标，一个是圆形的滑块图标，另一个是长条形的蓝色进度条图标。图中滑块图标和进度条图标的边缘都能够自然的和背景融合在一起。
图3 透明图标在滑块、进度条控件上的应用展示
图4 滑块图标素材
图5 进度条图标素材
2.2 表盘应用案例
图6所示为表盘应用案例，该案例通过图标旋转控件实现，需要一张带刻度的背景图片，一张png格式的指针图标。由于指针采用的是png格式图标，指针与背景能够完美的融合在一起。
图6 透明图标在旋转图标控件上的应用展示
图7 表盘指针素材
2.3 表盘时钟应用案例
图8所示为表盘时钟应用案例，该案例通过表盘时钟控件设计实现，图中使用了一张带时间刻度的背景图片，时针、分针、秒针三张png格式图标。由于使用的是png格式图标，所以时针、分针、秒针图标能够很好的与背景图标融合。
图8 透明图标在表盘时钟控件上的应用展示
图9 表盘时钟指针图标素预览
2.4 艺术字应用
图10为艺术字控件应用效果展示，该案例需要使用0-9数字对应的png格式图标。由于图标全部采用了png格式，所以能够很好的与背景图片融合。
图10 透明图标在艺术字控件上的应用展示
图11 艺术字png图标素预览
上一条：
如何调整电容触摸屏的灵敏度
下一条：
串口屏内存不够用怎么办
