养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

使用Axure如何实现左右滑动切换的效果

时间:2024-09-22 22:21:26

在我们做APP主界面的原型时,经常要实现左右滑动的效果,今天就给大家分享下如何使用钽吟篑瑜Axure来实现左右滑动的效果,希望对大家有一些帮助,当然也可以留言找我获取rp文件

工具/原料

联想电脑

winwinwin10

AxureAxure8

动态面板、占位符

方法/步骤

1、第一步,拖动一个动态面板到手机外壳中,并调整大小到与外壳大小相同,如下图

使用Axure如何实现左右滑动切换的效果

2、第二步,双击动态面板对此面板进行命名和创建三个状态如下图:创建三个状态代表了需要切换的三个页面。

使用Axure如何实现左右滑动切换的效果

3、第三步,对这三个状态的每个状态下填充内容,如下图1,2,3

使用Axure如何实现左右滑动切换的效果

使用Axure如何实现左右滑动切换的效果

使用Axure如何实现左右滑动切换的效果

4、第三步,对主界面面板“向左拖动结束时”进行“动态面板设置”操作,如下图;此步为左滑设置

使用Axure如何实现左右滑动切换的效果

5、第四步,对主界面面板“向右拖动结束时”进行“动态面板设置”操作,如下图;此页面为向右设置

使用Axure如何实现左右滑动切换的效果

6、到此步就完成了左右滑动的效果,请看下图:

使用Axure如何实现左右滑动切换的效果

© 一点知识