Axure实现手机滑动效果

Axure实现手机滑动效果

Axure RP能制作出低保真原型和高保真原型,低保真原型利用线框图构建出软件的大致结构,利用交互效果来表达用户的实际操作方式,低保真原型能在耗费一定的时间完美清晰的表达出软件的实际功能;高保真原型做出的效果几乎和实际效果一致,但是它需要投入精力,完整表达设计理念和体验。

小编今天想给大家讲一讲如何在Axure中实现手机触摸屏幕滑动效果,手机上的滑动切换是比较典型的,首页是关注,然后可以滑动切换到任何页面。

首选我们在Axure中拖入一个手机元件,然后再拖入一个动态面板:

Axure手机元件和动态面板

这里动态面板需要两个动态,一个是关注,一个是热门。首先在关注里面设置一下,拖入一个关注图片,都是提前截图。

Axure设置第一张图片

将图片大小拖拽至与动态面板同样大小(上方留空白),然后拖入两个一级标题,分别为,关注和热门。默认为关注,将关注标红。

Axure设置图片

再将动态二设置一下,同样加入一张图片,同样输入关注和热门,可以直接将动态一里面的复制过来,然后关注字体颜色为黑,热门二字标红。

Axure设置第二张图片

然后设置交互,将面板状态添加条件为1,然后选择设置面板状态,将动态面板设置为2,向左滑动,点击确定即可。

Axure设置交互

然后再添加交互,向右拖动结束时,添加条件为2,设置面板状态状态向右滑动,点击确定。

Axure向左滑动

以上Axure中实现手机触摸屏幕滑动效果就完成了,可以点击预览一下,更多感兴趣的教程,点击文章:Axure如何实现鼠标移入字体变色的效果

在线客服
客服邮箱
客服电话
17051276424