美文网首页Axure知识汇总Axure连载Axure原型设计
「连载100篇」AXURE-组件-026-水波球效果

「连载100篇」AXURE-组件-026-水波球效果

作者: duomi88 | 来源:发表于2019-04-27 16:49 被阅读1次
封面

hi,大家好,我是18岁fantasy,axure组件和实例100篇连载。本期小组件为一个水波球显示效果,可作为运维系统的安全检验结果展示,主要用到axure的图层布尔计算,动态面板以及移动效果等知识点。

文章结尾提供本期组件的原件下载地址,随时可下载。

显示效果

显示效果


实现方式

1.图层分析。通过将动态面板背景设置为和遮罩层相同的颜色,来达到实际效果。具体如下(主要图层的制作建下文):

图层 顺序

2.遮罩层制作(布尔计算)

遮罩层制作

3.水波的制作(关键部分)

可以使用钢笔工具绘制边缘起伏的圆形来实现。具体如下:

事件设置

看明白以上图形的制作,时间就很简单了。主要原理为:

1,页面加载时,以中心为锚点,持续的旋转动态面板内的水波圆形即可。

具体如下:

事件设置

~以上便是本次小组件的全部内容~

原件下载

链接:https://pan.baidu.com/s/1McNutn5R32vam27_iZRveQ

提取码:ulv1

~~~

18岁提示:以上文件完成于axure 8版本。

定期会将组件整理成完整文件统一发布。

原创文章,转载请标明出处。

感谢阅读和关注!

相关文章

网友评论

    本文标题:「连载100篇」AXURE-组件-026-水波球效果

    本文链接:https://www.haomeiwen.com/subject/nduknqtx.html