mcu_lover 发表于 2020-8-16 23:01:24

HMI文本显示器(5) 设计器 之静态图片控件属性

本帖最后由 mcu_lover 于 2020-8-16 23:05 编辑

好的显示效果及交互,离不开丰富的HMI控件。为了达成这个目的,我们设计了功能强大得静态文本控件。
与文本显示相呼应的是图片的显示。支持任意图片的显示,也是衡量一个HMI功能是否完善的体现。

在前面设计文本显示控件时候,我们规划了很多有用的属性,比如各种类型的外框,比如是否反显,是否闪烁显示,是否滚动显示等等。
鉴于文本与图片,在本质上其实差异不大。因此在设计静态图片控件显示的属性时候,我们也把它包含进去了,如下图所示:


这些属性的效果,在静态文本控件里面有详细的描述,这里不再重复说明。

为了对图片统一进行管理,我们设计了图形库。图形控件的显示内容来源于图形库。为了生成图形库,我们需要开发一个图形库的操作软件,
对图片导入,删除,以及基本的图像处理操作。如下图所示:






有了这个图形库管理软件,我们就可以把任意的图片添加到我们常用的图形库中,方便设计。这个操作,类似于我们进行PCB设计中的原理图库或者PCB库文件,
先提前做好,要使用时候直接选择即可。

有了图像库功能之后,静态图片控件关于图形操作的属性如下所示:



图形库用于浏览选择想要显示的图片
对齐操作用来对图片进行水平方向和垂直方向的排版操作。
偏移模式是当对齐操作进行之后,如果还想进行人为的像素点坐标偏移,则可以在这里进行选择。
延展模式,用于图片的显示模式,例如实际大小,保持纵横比,拉伸到整个区域等等。鉴于我们这里一般是单色点阵图,所以一般以实际大小显示为主。



最后我们看看代码中静态图片的属性如何定义:



是不是看起来特别的简单?其实各类属性的简单与否,主要在于下位机的实现难易程度。在下位机设计时候再具体展开。

pango 发表于 2020-8-20 20:11:18

持续关注楼主的动态{:lol:}

citroen988 发表于 2020-8-28 14:07:04

这个上位机是qt开发的吗?

mcu_lover 发表于 2020-8-28 17:06:10

citroen988 发表于 2020-8-28 14:07
这个上位机是qt开发的吗?

MFC 啊。

hczyn 发表于 2020-8-29 16:54:18

下位机采用什么方案?
页: [1]
查看完整版本: HMI文本显示器(5) 设计器 之静态图片控件属性