Kite Compositor制作下雨打雷特效详细教学

Kite Compositor mac版软件小巧、简单好用，功能觉得完爆其他同级别软件，是参与 iOS 设计工作的必备软件。mac Kite Compositor还能够让你了解图形本身渲染 、动画的原理，是一款非常优秀的动画和原型设计工具。

基本介绍

首先，打开demo，如下图：

Weather.kite

我们点击顶部“工具栏”中的“播放”按钮后，就可以在Mirror中运行了。通过操作我们知道该demo供有4个动效：

1、下雨

2、打雷

3、上下滑动至“65度”显示或消失

4、中间不同时间段温度条的左右滑动

下雨动效

我们在左侧layer菜单中，找到“Rain”这个图层，然后看到下面有个“Emitters（粒子发射器）”，之后点击就可以看到粒子发射器的属性：

粒子发射器属性

下雨的动效果，就是这个粒子发射器实现的，怎么样？是不是觉得特别easy？粒子发射器的属性有好多，比如可以设置发射器的形状（Emitter Shape）、模式（Emitter Mode）、渲染模式（Render Mode ）等，以及设置粒子的贴图（Contents）、贴图缩放（Contents Scale）、Birthrate（粒子创建速率）、Lifetime（粒子存活时间）等，重点介绍几个属性如下：

1、Emitter Shape（发射器的形状）：选项有point、line、rectangle、circle、cuboid、sphere。
2、Emitter Mode（发射器模式）：选项有points（发射器XY平面中心点发出）、outline（发射器边缘发出）、surface（发射器表面发出）、volume（发射器立体中心点发出）。
3、Render Mode （渲染模式）：选项有unordered（粒子无序出现，多个发射源将混合）、oldestFirst（声明久的粒子会被渲染在最上层）、oldestLast（最新发射的粒子会被渲染在最上层 ）、backToFront（粒子的渲染按照Z轴的前后顺序进行）、Additive（进行粒子混合 ）

下雨特效

我们在左侧layer菜单中，找到“Rain”这个图层，然后看到下面有个“Emitters（粒子发射器）”，之后点击就可以看到粒子发射器的属性：

粒子发射器属性

下雨的动效果，就是这个粒子发射器实现的，怎么样？是不是觉得特别easy？粒子发射器的属性有好多，比如可以设置发射器的形状（Emitter Shape）、模式（Emitter Mode）、渲染模式（Render Mode ）等，以及设置粒子的贴图（Contents）、贴图缩放（Contents Scale）、Birthrate（粒子创建速率）、Lifetime（粒子存活时间）等，重点介绍几个属性如下：

1、Emitter Shape（发射器的形状）：选项有point、line、rectangle、circle、cuboid、sphere。
2、Emitter Mode（发射器模式）：选项有points（发射器XY平面中心点发出）、outline（发射器边缘发出）、surface（发射器表面发出）、volume（发射器立体中心点发出）。
3、Render Mode （渲染模式）：选项有unordered（粒子无序出现，多个发射源将混合）、oldestFirst（声明久的粒子会被渲染在最上层）、oldestLast（最新发射的粒子会被渲染在最上层 ）、backToFront（粒子的渲染按照Z轴的前后顺序进行）、Additive（进行粒子混合 ）

打雷特效

我们还是在左侧layer菜单中，找到“Current Local Conditions”这个图层，之后找到这个层下的“Actions”-》“Mouse Up → Cycle Lightning Strikes”，Cycle Lightning Strikes就是触发打雷的动作

随后我们点击它，可以找到这个动作指向的打雷动作“Lightning Strike 1 -》 Strike”和“Lightning Strike 2 -》 Strike”

随后，我们通过“Lightning Strike 1”和““Lightning Strike 2”两个图层下的“Actiions”找到“Strike”，然后可以看到打雷动效为“Show Bolt”。那这个打雷动效是怎样实现的呢？

首页，我们先看下“Lightning Strike 1”图层是什么样子的，如下图，选中的（深蓝色标注）的形状：

Lightning Strike 1

Lightning Strike 2与Lightning Strike 1类似，因为是两道闪电，实现方式都一样，就不再一一介绍了。看到这个形状，相信大家进本上已经猜出来打雷的动效是怎么实现的了……没错，就是通过描边实现的，在0.05秒内，将strokeEnd由0变为1，此时闪电在0.05秒中显示出来，

opacity是控制闪电的消失，即在0.1459秒后，闪电开始消失，1.3891秒后，闪电消失完毕。第二道（Lightning Strike 1）闪电效果与第一道一样，就不在介绍了。
后续两个动效（上下滑动至“65度”显示或消失、中间不同时间段温度条的左右滑动）很简单就不再做介绍了。

Kite Compositor mac版，欢迎有需要的朋友点击本文章上面的相关软件下载使用！祝您使用愉快！