axure拖动页面_axure教程之图片拖动放大缩小

大家好，我是axure大马猴，今天给大家带来一个拖动图片可以改变大小尺寸的教程。

教程很简单的，几步就搞定了。

动态效果演示：

教程开始：

1、首先准备元件，两个文本标签分别起名字width、height(用于获取图片的宽度跟高度)，一张图片(转换为动态面板)。

如图：

2、两个文本标签，分别载入时候获取图片的宽度即width、高度height，然后隐藏。

如图：

3、图片转为动态面板后，设定事件动态面板拖动时，设置图片的宽度=文本标签width+TotalDragX(这个函数的意思是：鼠标指针拖动元件从开始到结束的X轴移动距离。)设置图片的高度=文本标签height+TotalDragY(意思是：鼠标指针拖动元件从开始到结束的Y轴移动距离)。

如图：

4、继续设定动态面板事件，拖动结束时，设置文本标签width=当前图片的宽度，设置文本标签height=当前图片的高度。

如图：

总结：拖动图片改变尺寸不难，大家熟练掌握TotalDragX、TotalDragY指针函数即可。