LabVIEW论坛
直播中

荣琪

8年用户 689经验值
擅长:可编程逻辑 测量仪表 嵌入式技术
私信 关注
[资料]

荣小菜补钙记第59期_LabVIEW之二维图片拖拽与缩放


荣小菜补钙记第59期_labview之二维图片拖拽与缩放
同步更新于 WeChat：荣小菜在补钙
大家好，我是荣小菜，本期用一个小Demo讲解在二维图片控件中实现图片拖拽的缩放。

1.     缩放功能
实现二维图片缩放功能通过设置图片控件的“缩放因子”属性实现，通过触发鼠标滑轮事件，上滚时Delta值为1，下滚时Delta值为-1，每次滚动缩放因子变化|0.1|，设置缩放因子上限为10(放大10倍)，下限为0.1(缩小10倍)。

缩放程序1.PNG
滑轮动作
                              
2.     拖拽功能
拖拽主要由鼠标按下，鼠标移动，鼠标释放3个动作实现。
先看鼠标按下，鼠标按下后进入可拖拽状态，并通过当前原点坐标和鼠标坐标计算两者相对坐标，“相对位置”后续将继续使用。
注意1：原点坐标为图片左上角坐标。
注意2：本Demo实现两种拖拽方式，可选择是否反转。
按下1.PNG
鼠标按下
实现图片移动的关键是根据鼠标移动修改图片原点位置
鼠标移动时，使用“当前鼠标坐标”与上一步骤中计算出的“相对位置”即可算得图片“原点坐标”。
实现反转拖拽，则将减数和被减数位置互换即可。
移动1.PNG
鼠标移动
完成拖拽后，鼠标释放，此时程序进入“不可拖拽”状态，鼠标移动事件可以被触发，但不执行相关逻辑。当然，比起这种使用布尔状态量的方法，我们也可以通过动态注册、注销事件的方式实现，详见LabVIEW自带范例“动态事件生成”。
释放1.PNG
鼠标释放
3.     复用性
稍微做一些复用性的设计，这里简单设计三个可重用Vi，分别为“INIT”、“CORE”和“STOP”，用户想要让某图片控件具备缩放和拖拽功能，只需使用这3个函数即可(见MAIN函数)。需要注意的是，每用一个INIT函数和CORE函数，必须使用一个STOP函数来停止。下面进行详细讲解。
Main.PNG
MAIN程序框图

先看“INIT”函数，关键点为通过控件引用注册系列动态事件，每次调用该函数即可为不同控件注册相关功能事件；另一关键点为注册STOP用户事件，我们可以通过触发该事件来停止CORE中的循环(该设计在操作者框架中十分常用)。
INIT.PNG
INIT后面板
调用INIT后必须接着调用CORE函数，该函数主要功能在第1、2节中已经讲解，此处重点是实现动态事件的逻辑流程和响应STOP用户事件的停止流程。当STOP用户事件触发时，销毁注册的动态事件和用户事件。
CORE.png
CORE后面板
最后看STOP函数，简单但关键，必须调用，产生STOP用户事件，是程序顺利停止的关键。
stop.PNG
STOP后面板
4.     Demo演示
下面进行Demo演示，缩放、正向拖拽、反向拖拽。

  
主要功能演示.gif
Demo
本期就到此结束啦，测试Demo已上传，感兴趣的同学可以看看，也期望各位大神能帮忙前来指教，进一步分享更多更有趣的程序。
分享开源免费，共同学习进步^_^






  • 离开1.PNG
  • Main前.PNG

回帖（2）

荣琪

2023-5-26 22:09:07
不知道为什么我这边没有上传附件的选项了，目前只能用网盘发Demo，微信公众号有同步更新的文章，里面有链接。
举报

3708407

2023-11-5 21:05:16
看不到程序附件在那里啊，，，
举报

更多回帖

2 0 2

相关帖子

鼠标 图像缩放
发帖
电子发烧友APP
|投诉反馈|电子发烧友网
© 2021 bbs.elecfans.com
湘ICP备2023018690号
×
20
完善资料，
赚取积分