本人初学产品,最近学习了一个关于实现手机屏幕上下滑动的交互方法,以下是本人学习笔记,以便日后工作中方便查询回忆巩固知识。
一、主要实现功能
手机屏幕上下滑动
二、具体步骤
1、打开AXURE软件(RP8 企业版),拖拽一个手机面板
2、拖拽一个动态面板,双击动态面板并且命名,可以根据模块内容命名
3、点击“模块内容”,再增加一个动态面板,用来显示需要滑动的内容
4、添加需要显示的内容,本次用图片演示
5、为需要进行滑动的模块,添加交互事件“拖动时”
6、双击“拖动时”->移动->勾选“模块内容显示区”->选择“垂直拖动”
7、然后再点击”拖动结束时“交互事件,添加条件。
8、选择”值“,"fx"选择y,然后>0,即如果向下拉动时,y的值是大于0的,此时再添加 ”移动“ 交互事件,让”模块内容显示区“回到原位坐标(0,0)
9、当”模块内容显示区“向上滑动超出”模块显示区“时,再追加一个”移动“交互事件 即y<”模块显示区“-”模块内容显示区“的长度,如:”模块显示区“长度为:603,”模块内容显示区“长度为:885。即y<603-885=-282时候,”模块内容显示区“回到坐标(0,-282)
10、然后点击确定,发布预览即可