教程内容:
使用圆角矩形制作蒙版,通过修改显示区域来制作轮播指示器
制作指示器
绘制三个10*10圆形制作默认状态
绘制一个等边10*10矩形,改变圆角制作成一个圆,填充蓝色,做为激活状态
复制一个蓝色矩形,做为蒙版,选中两个蓝色矩形点击制作蒙版。
为了更详细说明,我们蒙版矩形命名为蒙版,蓝色矩形命名为激活
将蓝色激活组覆盖到灰色圆上。
第1个画板
激活组:
蒙版:10*10
激活:29*10
第2个画板:
蒙版:29*10
激活:10*10
第3个画板:
复制第1个画板的参数即可
这样就实现了显示区域从小到大,但显示内容从大到小产生了反差
制作交互
分别链接画板
制作点击自动动画,渐入渐出0.8秒
制作切换的插图
三个画板使用的是同一个插图组
将三个插图依次平铺并绘制一个矩形框制作蒙版显示区域
将插图蒙版组放置到三个画板中
每个画板拖移显示不同的插画即可
制作完成
点击前往查看→查看视频教程获取源文件