Aure PR 7.0 实现页面纵向滑动效果

因此我们的条件动作即为:

  1. 当 “[[This.y]]” >= 64时,“拖动面板”重新回到(0,64)处。
  2. 当“[[This.y]]”
    为什么是64?因为:20+44=64.元件的纵坐标定义为元件左上顶点的纵坐标,当面板处于顶导分隔线下方时触发条件,因此当元件纵坐标大于顶导下沿时,触发条件从而使面板重新回到紧贴顶导下沿处。

为什么是-345?因为:64-[(64+977)-632]=-345.请读者自己根据几何关系进行计算。

因此条件设立对话框后面的选项应该按下图选择或填写,此时条件为:if "[[This.y]]" >= "64".

点击确定回到用例编辑对话框,选中“拖动面板”元件,移动“到绝对位置”,坐标为(0,64),设置“弹性”动画,时间为“500”毫秒。注意设置弹性动画很重要。

然后我们为“拖动面板”再添加一个条件动作:如果拖动结束时面板纵坐标小于等于-345时,面板重新以弹性动画的方式回到(0,-345)处。在此不再一一讲解过程,请读者自行设置。

至此我们就完成了列表纵向滑动效果的设置,我们可以按F5先在本地的浏览器中进行预览,鼠标拖动查看效果。

(5) 发布到 AxShare

我们可以把刚才制作的原型发布到 Axshare ,以方便在手机等移动设备上查看。

点击菜单栏上的“发布”-> “发布到 AxShare”:

按照如下参数进行设置:

注意一定要选择不显示站点地图。发布完成之后,我们就可以通过手机浏览器来感受一下我们设计的原型的效果了。

本文的原型文件下载链接:

作者源文件:https://pan.baidu.com/s/1borIg8Z

官方源文件:http://pan.baidu.com/s/1bkYIfW

本文的原型移动端的URL:http://tfforx.axshare.com/# c=2

 

关键字:Axure, Axure教程

本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击下方“内容举报”进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部