查看: 6594|回复: 4

小楼axure 图文教程(二十)动态面板拖动效果(函数DragX,DragY)

[复制链接]

0

主题

83

回帖

25

积分

会员

axure元件研究生

Rank: 5Rank: 5

积分
25
发表于 2013-7-31 12:54:27 | 显示全部楼层 |阅读模式
尹广磊公众帐号
今天是axure rp6.5新手教程的最后一节了,写了这么长时间,也不知道给大家帮上忙了吗?在这最后一节,把之前没有讲的两个特殊函数说一说。至于在这20章教程里面没有写到的东西,将会在axure7.0的教程里慢慢补全,敬请期待!
小楼axure 图文教程(二十)动态面板拖动效果(函数DragX,DragY).rp (53.24 KB, 下载次数: 66)
今天的教程示例如下:

如图,是通过拖动任意一个面板,让另外一个面板镜像移动。
看似有些复杂的效果,其实非常简单就实现了。
首先介绍两个函数:
DragX:获取被拖动面板左右瞬时挪动的距离;
DragY:获取被拖动面板上下瞬时挪动的距离;
我们只需要在两个动态面板里各写上两个动作就好了。
左面的面板,我们当面板拖动时,将它设置为拖动状态,这样就能随意拖动了;
然后,让左面面板拖动的时候,右面的面板移动相对距离,因为我们是让两个面板上下方向(Y轴)同方向移动,而左右方向(X轴)朝相反的方向移动。所以在相对距离里面X轴我们要把DragX前面加上负号,这样就是反方向移动了。Y轴就直接获取DragY的函数值就可以了。

同理,我们在右边的面板上,也写上这两个动作,这样拖动右面板的的时候左面板也镜像移动了。

好了,让我们看看效果!
呵呵,axure 6.5教程完结,这周末之前,axure7.0教程就要开始和大家见面了,敬请期待!
我一定会回来的!!!!!!!!!!!!
本文出自 诉客 ▪ 产品经理的心声,转载时请注明出处及相应链接。
本文永久链接: http://www.soger.net/236.html
小楼个人博客:www.soger.net启用新域名:www.iaxure.com,原创元件、原型、文章、教程,无私与大家分享!

0

主题

1

回帖

11

积分

会员

Rank: 5Rank: 5

积分
11
发表于 2013-8-11 00:43:05 | 显示全部楼层
到主页上都看了一遍,很有帮助,谢谢。

0

主题

19

回帖

11

积分

会员

产品经理一枚

Rank: 5Rank: 5

积分
11
QQ
发表于 2013-9-17 23:50:14 | 显示全部楼层
好吃力啊~~能明白你说的意思 但是看实例却做不出来
求职:移动端产品经理  深圳  QQ:160226466

0

主题

9

回帖

12

积分

会员

Rank: 5Rank: 5

积分
12
发表于 2013-9-18 12:57:00 | 显示全部楼层
3# lucyxie


很简单啊,so easy~!

0

主题

1

回帖

11

积分

会员

Rank: 5Rank: 5

积分
11
发表于 2013-9-30 15:49:07 | 显示全部楼层
怎么将动态面板设置为移动状态 我的6.5版本的,好像设置不来。只有移动相对或绝对位置。
您需要登录后才可以回帖 登录 | 新用户注册

本版积分规则

QQ|手机版|友情链接|版权声明|关于我们|Axure中文社区 |网站地图

GMT+8, 2024-5-13 13:39

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表