设计Axure原型设计Axure连载

【原创教程】AXURE-组件-005-SCAN

2019-03-29  本文已影响0人  duomi88

hi,大家好,我是18岁fantasy,本期小组件为一个类似微信二维码的扫描组件,效果如下:

显示效果

实现方式

1.图层分析主要有一个动态面板、外面框(制作过程请看下文)、扫描线条(置于动态面板内)和一个背景组成,具体如下:

图层 图层顺序

2.外边框制作。主要用到边框可见性设置,如下所示:

可见性设置

制作好一个角之后,其他的角用旋转角度即可获得。

3.添加事件。添加页面载入时触发事件,触发扫描条上下移动(扫描线条初始位置正好低于动态面板高度,正好隐藏,移动时要加上扫描线条高度)。

事件

以上便是本次小组件的全部内容,喜欢就下载并关注我吧。

原件下载

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

提取码:mbv1

~~~

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

点击关注"18岁fantasy",定期会将组件整理成完整文件统一发布。

原创内容,转载请注明出处。

上一篇下一篇

猜你喜欢

热点阅读