首页
Portal
爱评测报告
行业
产品
推荐
设备
讨论&分享
BBS
搜索
帖子
门户
马上注册
找回密码
登录网站
用QQ登录
爱评测-移动互联网评测
»
讨论&分享
›
学习及教程
›
Axure教程及讨论
›
小楼axure 图文教程(二十)动态面板拖动效果(函数Drag ...
返回列表
查看:
4767
|
回复:
2
小楼axure 图文教程(二十)动态面板拖动效果(函数DragX,DragY) ...
[复制链接]
tianzc
tianzc
当前离线
积分
5648
1313
主题
1337
帖子
5648
积分
管理员
积分
5648
发消息
电梯直达
楼主
发表于 2015-1-17 01:21:26
|
只看该作者
|
倒序浏览
|
阅读模式
[/url]
小楼axure 图文教程(二十)动态面板拖动效果(函数DragX,DragY)
今天是axure rp6.5新手教程的最后一节了,写了这么长时间,也不知道给大家帮上忙了吗?在这最后一节,把之前没有讲的两个特殊函数说一说。至于在这20章教程里面没有写到的东西,将会在axure7.0的教程里慢慢补全,敬请期待!
[url=http://www.webppd.com/attachment.php?aid=7295&k=e357931944835887af36a1c361eb96bf&t=1421429377&sid=1262AUraieEaP5EmiaCAI9VtM62k9AaPdtE2BIJxTMWi8co]
小楼axure 图文教程(二十)动态面板拖动效果(函数DragX,DragY).rp
(53.24 KB)下载次数: 46
2013-7-31 12:54
今天的教程示例如下:
如图,是通过拖动任意一个面板,让另外一个面板镜像移动。
看似有些复杂的效果,其实非常简单就实现了。
首先介绍两个函数:
DragX:获取被拖动面板左右瞬时挪动的距离;
DragY:获取被拖动面板上下瞬时挪动的距离;
我们只需要在两个动态面板里各写上两个动作就好了。
左面的面板,我们当面板拖动时,将它设置为拖动状态,这样就能随意拖动了;
然后,让左面面板拖动的时候,右面的面板移动相对距离,因为我们是让两个面板上下方向(Y轴)同方向移动,而左右方向(X轴)朝相反的方向移动。所以在相对距离里面X轴我们要把DragX前面加上负号,这样就是反方向移动了。Y轴就直接获取DragY的函数值就可以了。
同理,我们在右边的面板上,也写上这两个动作,这样拖动右面板的的时候左面板也镜像移动了。
好了,让我们看看效果!
呵呵,
Axure
6.5教程完结,这周末之前,axure7.0教程就要开始和大家见面了,敬请期待!
我一定会回来的!!!!!!!!!!!!
本文出自 诉客 ▪
产品
经理的心声,转载时请注明出处及相应链接。
本文永久链接:
http://www.soger.net/236.html
收藏
分享
评分
下载次数
,
动态
,
左右
本帖子中包含更多资源
您需要
登录
才可以下载或查看,没有帐号?
马上注册
x
分享到:
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
0
相关帖子
•
[过渡效果] 左右滑动切换头像,并且中间头像变大
•
[错误剖析] 网易云音乐Mac版设计上的小问题
•
[错误剖析] 从iOS7开始的多任务切换左右滑动的并不好用
•
axure7.0教程_小楼作品(一)中继器的使用(1)
•
axure7.0教程_小楼作品(四)中继器的使用(4)
•
[图标] iPad部分图标
•
axure中拖动动态面板
•
[正确表达] 一个横向二级导航菜单
•
看微信公众平台产品经理教你做产品
回复
使用道具
举报
zhchhy
zhchhy
当前离线
积分
195
7
主题
90
帖子
195
积分
新人
新人, 积分 195, 距离下一级还需 5 积分
新人, 积分 195, 距离下一级还需 5 积分
积分
195
发消息
沙发
发表于 2015-7-22 11:49:32
|
只看该作者
怎么这么没人气。
回复
支持
反对
使用道具
举报
zhchhy
zhchhy
当前离线
积分
195
7
主题
90
帖子
195
积分
新人
新人, 积分 195, 距离下一级还需 5 积分
新人, 积分 195, 距离下一级还需 5 积分
积分
195
发消息
板凳
发表于 2015-7-22 11:56:25
|
只看该作者
怎么这么没人气。
回复
支持
反对
使用道具
举报
返回列表
高级模式
B
Color
Image
Link
Quote
Code
Smilies
您需要登录后才可以回帖
登录
|
马上注册
本版积分规则
发表回复
回帖后跳转到最后一页
Function
小黑屋
Archiver
手机版
关于!
rss订阅
关于爱评测
爱评测FAQ
站点地图
爱评测 aipingce.com
快速回复
返回顶部
返回列表