把汉化补丁放到游戏目录 axure8破解安装教程

下面教大家使用axure来实现手机app里页面上下滑动特效 。
第一步:
(1)将矩形拖到名为“滑动效果”的页面中,调整好位置,设置矩形的宽为:326,高为:640,圆角半径为:38,这样完成一个手机雏形的设置 。

把汉化补丁放到游戏目录 axure8破解安装教程


(2)在拖一个矩形到上面做好的图形中,设置矩形宽为:320,高为:568,调整好位置,这样一个手机平面就完成了 。

把汉化补丁放到游戏目录 axure8破解安装教程


第二步:
(1)拖入一个动态面板到页面中,动态面板的大小位置与上面矩形保持一致,动态面板宽:320,高:568

把汉化补丁放到游戏目录 axure8破解安装教程


(2)双击动态面板“State1”,进入到动态面板编辑状态

把汉化补丁放到游戏目录 axure8破解安装教程


(3)再拖入一个动态面板到“State1”动态面板中,宽:320,高:800,并改名为:动态面板2

把汉化补丁放到游戏目录 axure8破解安装教程


(4)双击“动态面板2”下的“State1”,然后在动态面板里增加6张图片,填满动态面板

把汉化补丁放到游戏目录 axure8破解安装教程


(5)双击“滚动效果”页面,选中“动态面板”

把汉化补丁放到游戏目录 axure8破解安装教程


(6)这一步是添加滚动效果的一步,在属性下面选择“拖动时”属性,在弹出的用例编辑框里,左侧添加动作中选“移动”,右侧配置动作选中“动态面板2”,下方移动选择“垂直拖动”

把汉化补丁放到游戏目录 axure8破解安装教程


到这一步,完成了效果的制作,播放效果如下:

把汉化补丁放到游戏目录 axure8破解安装教程


大家有没有发现一个bug?就是在拖动图片的时候,可以无限制的拖动,顶部底部会出现白边,这是为什么呢?是因为没有做边界的限制,下面咱们来把边界加上 。
第三步:设置滑动上方边界
(1)拖动一个热区到“滑动效果”页面,命名为“热区1”,设置宽:250,高:24,热区的位置如图所示,要与上方图片对其

把汉化补丁放到游戏目录 axure8破解安装教程


(2)选中“动态面板”,选择属性里的“拖动结束时”,在弹出的用例编辑框里,选择“添加条件”,弹出的“条件设立”里,依次选择“元件范围、动态面板2、未接触、元件范围、热区1”,点击确定

把汉化补丁放到游戏目录 axure8破解安装教程


(3)选择添加动作里的“移动”,选择配置动作里的“动态面板2”,选择移动里的“绝对位置”,点击确定

把汉化补丁放到游戏目录 axure8破解安装教程


此时,上方边界已完成,效果如下:

把汉化补丁放到游戏目录 axure8破解安装教程


大家可以看到,在往下拖动的时候,当拖到顶部时,出现空白,鼠标松开后,自动有弹回到起点,这就是上方的边界效果 。
但下方的边界还没有做,下面继续完成下方的边界 。
第四步:设置滑动下方边界
(1)拖动热区到手机屏幕底部,设置宽:250,高:24,命名为“热区2”

把汉化补丁放到游戏目录 axure8破解安装教程

推荐阅读