Axure实现滚动效果

      在提笔之前心里是有点内疚的,(前面废话有点多可以直接看第四自然段实例...)因为在初次写第一篇文章的时候就下定了目标决定要坚持写文章,互相学习,哪怕每周写一篇,但是直到现在人算不如天算,两个星期过去了,时间真的好紧过的好快啊,我过来补上我的两篇文章了,今天向大家分享的干货是:Axure实现滚动效果

      在决定写这个之前,是因为我要做这个效果,但是我百度了很久只有手机版滑动效果,算了,我只有自己琢磨了,琢磨半天知道发现竟然弄出来了,其原理非常简单,不免心里有种满足感,心中想竟然没有人分享出来,连搜到搜不到,那么就由我来写吧,在写之前又搜了遍,诶,怎么回事~  竟然是一搜一大把啊,我的天哪,原来是我这次搜索的关键词和上次不一样,上次搜索的是“Axure实现滚动效果”,出来一堆手机上下滑动效果的实例,这次我搜索的关键词是“Axure实现滚动条”,我去,真的很多,这也是涨了个教训,顺便分享给大家,不要同一类搜索词搜不到自己想要的结果就放弃了,换个类似的搜索词可能会有意向不到的意外和惊喜哦!

       但是在发现了已经有很多这种实例了为什么我还想继续提笔写呢?主要是我自己就当做做做笔记,记录下心情啦!就像没有自己亲自写过、去体会过的东西跟你听到的、看到的就会有一种不一样的感受,在者这个文章关键词就是我搜不到的那个关键词啦,哈哈哈~


        好像废话说的太多了,有点尴尬~  直接进入主题吧:

1、先拉出一个动态面板,双击弹出面板状态管理,点击State1进去


Axure实现滚动效果_第1张图片

2、在里面再次拉出一个动态面板,双击弹出面板状态管理,点击State1进去

Axure实现滚动效果_第2张图片

3、在里面填充你要画的内容,在这里我随意拖动几个控件看效果,尽管超出往下画没关系!


Axure实现滚动效果_第3张图片

4、回到刚刚设置的内层(第二层)动态面板,发现只显示动态面板大小的内容,其他内容没显示,不要担心,设置右边的自动显示垂直滚动条!



Axure实现滚动效果_第4张图片

5、回到刚刚设置的最外层的动态面板,里面显示的是内层动态面板的内容,我们把他向左移动一点


Axure实现滚动效果_第5张图片


Axure实现滚动效果_第6张图片

接下来大功告成~   F5就能看效果啦!还是不能明白的可以直接私聊我哦,在职产品Dog在帮助别人的同时也是帮助自己啦,最后祝大家工作顺利,心情愉快!

你可能感兴趣的:(Axure实现滚动效果)