Axure教程 | 移动端APP下拉刷新(附下载地址)

移动端APP原型动效库——将常用的动态效果剥离出来,做成元件动效库,需要的时候可以随时调用。

原型在线地址:http://www.pmdaniu.com/rp/view?id=ACNRMQFhUG0MOFRqAytWAw

源文件下载地址:http://www.pmdaniu.com/rp/detail/34859

一、思路解析

1、设置2个动态面板:下拉刷新动态面板(高度:65px,以下简称“刷新面板”),内容动态面板(高度调整为内容尺寸,以下简称“内容面板”);

2、刷新面板初始坐标(0,0),内容面板初始坐标(0,65)

3、垂直拖动内容面板时,刷新面板底部移动至内容面板头部,设置提示语为:“下拉刷新”;

4、拖动内容面板y坐标大于等于130时,刷新面板改变提示语为:“松手刷新”;

5、拖动结束时,若内容面板头部y坐标大于等于130,则移动刷新面板至(0,65),移动内容面板至(0,130),改变刷新面板提示语为:“刷新中...”,并在此坐标等待1000毫秒,最后再将两面板移回至初始位置;

6、拖动结束时,若内容面板头部y坐标大于65小于130时,则将两面板移回至初始位置。

#、对于时间比较紧的朋友,可以直接复制去用,无需学习怎么做;若要修改提示语,直接进入中继器修改即可。


二、步骤解析

原型在线地址:http://www.pmdaniu.com/rp/view?id=ACNRMQFhUG0MOFRqAytWAw

源文件下载地址:http://www.pmdaniu.com/rp/detail/34859


相关阅读

注: 本文由 @张亮 原创发布于产品壹佰,未经许可,禁止转载。

3条评论 添加新讨论

11月01日评论

看起来很棒啊,我目前是在使用Mockplus做原型,也是非常给力!

回复
  1. 6天前评论 回复
  2. 11月14日评论 回复
登录后参与讨论
Ctrl+Enter 发表