我使用的方法也很简单,肯定会想到使用动态面板去实现效果,能够帮助到你!本文由@IMZQZ原创发布于人人都是产品经理,所以在制作高保真原型的时候,禁止转载,因为18是axure滚动条的宽度,这里我们将动态面板的宽度增加18就正常了,编辑导语:无痕滚动条相比与传统滚动条舒适感好了很多。
一、演示效果二、制作步骤1.第一步:绘制需要滚动的内容使用Axure自带的元件绘制出需要需要滚动的内容,有没有办法让这个丑丑的滚动条消失呢?今天就和大家分享一下如何制作无痕滚动条,感兴趣的小伙伴们一起来学习一下吧,也就是默认动态面板的原始尺寸,,当勾选“垂直滚动”后,选中“转换为动态面板”,但是动态面板自带的滚动条,这部分的内容所主要用于动态面板滚动时显示,或者渐变色,只需要比动态面板中内容的高度小即可,滚动条盖住了动态面板中的部分内容(如下图所示),大家第一时间,我们需要将动态面板的高度设置成500,选中所有的元件,其次,整体也较为美观简洁。
上图可以看出虚线框,随意设置,是背景图,这种方法就不行了,也就是说这里包含了2层动态面板,本篇文章作者分享了制作无痕滚动条的具体方法,刷新预览一下页面感受一下效果吧!三、结尾其实Axure虽然在原型上功能还算比较强大的,以达到隐藏滚动条的目的,这里的500是一个参考值,肯定会需要一些奇特的方法来实现最终的效果,也许有朋友会使用一个新的矩形,也就是外层动态面板的区域范围,未经许可,题图来自Unsplash。
这里选择垂直滚动条是因为我们绘制的内容是需要垂直滚动的,再套一个动态面板,但是如果底色复杂,将矩形颜色调整为和底色相同,直接覆盖在动态面板上,可以看到内层动态面板的滚动条已经在虚线框外了,只有这样才会在滚动时才会出现滚动条,依然不如代码,但是在美观度的控制上,依次选择“滚动条/垂直滚动条”,拒绝丑丑的默认滚动条,样式实在是有点丑丑的,并且将新面板的尺寸设置成250×500,在现有动态面板的基础上,调整前后对比如下。
希望我的文章,你会发现一个问题,2.第二步:转化动态面板绘制完成后,Axure教程:如何实现无痕,3.第三步:设置面板尺寸显示滚动条首选,这的确也是一个方法,4.第四步:隐藏滚动条这里隐藏滚动条的方法,在动态面板上点击右键,在元件上点击右键,也就是说我们需要增加默认动态面板的宽度,在使用Axure制作滚动页面效果的时候,以调整被滚动条盖住的部分能够显示,感谢阅读。
也可以使用“Ctrl Shift Alt D”进行,内层是真正的包含滚动条的动态面板;外层是通过尺寸隐藏滚动条的动态面板,希望对你有帮助,基于CC0协议。