持续创作,加速成长!这是我参与「日新计划 6 月更文挑战」的第 21 天,点击查看活动概况
前言
这是一套 张风捷特烈 出品的 Flutter&Flame
系列教程,发布于社区。假如你在其他平台看到本文,能够依据关于链接移步到中查看。因为文章可能会更新、修正,一切以文章版本为准。本系列源码于 【toly_game】 ,假如本系列对你有所协助,期望点赞支撑,本系列文章一览:
- 【Flutter&Flame 游戏 – 壹】开启新世界的大门
- 【Flutter&Flame 游戏 – 贰】操纵杆与人物移动
- 【Flutter&Flame 游戏 – 叁】键盘事情与手势操作
- 【Flutter&Flame 游戏 – 肆】精灵图片加载方式
- 【Flutter&Flame 游戏 – 伍】Canvas 参上 | 人物的血条
- 【Flutter&Flame 游戏 – 陆】暴击 Dash | 文字构件的运用
- 【Flutter&Flame 游戏 – 柒】人随指动 | 动画点触与移动
- 【Flutter&Flame 游戏 – 捌】装弹完毕 | 人物武器发射
- 【Flutter&Flame 游戏 – 玖】探究构件 | Component 是什么
- 【Flutter&Flame 游戏 – 拾】探究构件 | Component 生命周期回调
- 【Flutter&Flame 游戏 – 拾壹】探究构件 | Component 运用细节
- 【Flutter&Flame 游戏 – 拾贰】探究构件 | 人物管理
- 【Flutter&Flame 游戏 – 拾叁】碰撞检测 | CollisionCallbacks
- 【Flutter&Flame 游戏 – 拾肆】碰撞检测 | 之前代码优化
- 【Flutter&Flame 游戏 – 拾伍】粒子系统 | ParticleSystemComponent
- 【Flutter&Flame 游戏 – 拾陆】粒子系统 | 粒子的品种
- 【Flutter&Flame 游戏 – 拾柒】构件特效 | 了解 Effect 系统
- 【Flutter&Flame 游戏 – 拾捌】构件特效 | ComponentEffect 一族
- 【Flutter&Flame 游戏 – 拾玖】构件特效 | 了解 EffectController 系统
- 【Flutter&Flame 游戏 – 贰拾】构件特效 | 其他 EffectControler
- 【Flutter&Flame 游戏 – 贰壹】视差组件 | ParallaxComponent
- 【Flutter&Flame 游戏 – 贰贰】菜单、字体和浮层
- 【Flutter&Flame 游戏 – 贰叁】 资源管理与国际化
- 【Flutter&Flame 游戏 – 贰肆】pinball 源码剖析 – 项目结构介绍
- 【Flutter&Flame 游戏 – 贰伍】pinball 源码剖析 – 资源加载与 Loading
- 【Flutter&Flame 游戏 – 贰陆】pinball 源码剖析 – 游戏主菜单界面
- 【Flutter&Flame 游戏 – 贰柒】pinball 源码剖析 – 人物选择与玩法面板
- 【Flutter&Flame 游戏 – 贰捌】pinball 源码剖析 – 游戏主场景的构成
- 【Flutter&Flame 游戏 – 贰玖】pinball 源码剖析 – 视口与相机
第一季结束,谢谢支撑 ~
1. 推迟特效控制器: DelayedEffectController
上一篇中,介绍了 DurationEffectController
一族的特效控制器,本节咱们持续来认识一下其他的六种控制器。如下两边的六个控制器有一个共同的特点,它们都会持有 子控制器
,也就是说它们是在一个控制器的基础上,再施加的改变。本文代码均在 【20/01】
如下是 DelayedEffectController
的结构办法,其间有必要传入 child
控制器,别的需求指定延时的秒数。以此达到:子控制器延时 delay
秒开始动画的作用。
如下事例,经过 DelayedEffectController
作用控制器, 让 Curved
作用延时 2s
触发。主需求将 Curved
作用作为 DelayedEffectController
的孩子,并指定 delay
为 2
即可:
void delayedEffectController(){
EffectController child = CurvedEffectController(2,Curves.ease);
EffectController ctrl = DelayedEffectController(child,delay: 2);
Effect effect = MoveByEffect(
Vector2(0, -100),
ctrl,
);
player.add(effect);
2. 重复控制器:Repeated 和 无限控制器 Infinite
望文生义,RepeatedEffectController
能够让子作用的动画重复履行 repeatCount
次。
上一节介绍了几个震动型改变的作用,能够结合 RepeatedEffectController
进行重复震动。这样就能够完成震动、闪烁等特效,比方下面经过重复履行 5
次 SineEffectController
,完成简单的左右震动:
void repeatedEffectController(){
EffectController child = SineEffectController(period: 0.1);
EffectController ctrl2 = RepeatedEffectController(child,5);
Effect effect = MoveByEffect(
Vector2(-2, 0),
ctrl2,
);
player.add(effect);
}
InfiniteEffectController
和 RepeatedEffectController
相似,都能够让子作用 重复运转
。只不过 Infinite
表明重复次数无限,Repeated
能够指定重复次数。比方上面的抖动假如运用 InfiniteEffectController
,就会一直不停抖动。
void infiniteEffectController(){
EffectController child = SineEffectController(period: 0.1);
EffectController ctrl2 = InfiniteEffectController(child);
Effect effect = MoveByEffect(
Vector2(-2, 0),
ctrl2,
);
player.add(effect);
}
这时可能会有人疑问,那怎么停止呢?Effect
自身是附在加人物之上的 构建
,只需移除 Effect
,特效就会消失。这样可插拔的规划,正是特效的优势,比方下面代码能够移除 player
身上的所有特效:
player.removeAll(player.children.whereType<Effect>());
3.随机作用控制器: RandomEffectController
这儿的随机值得是 时长随机
,其间的 child
子作用有必要是 DurationEffectController
一族的。而且,运用 RandomEffectController
后,子级设置的时长会被无效。
处理普通结构办法外,RandomEffectController
有两个 factory
结构,其间 uniform
运用的是 _UniformRandomVariable
随机数结构器。它是用于是生成在 min ~ max
之间的随机数:
经过源码很容易看出 _UniformRandomVariable
生成随机数的方式:
别的一个是 exponential
结构,随机数生成器是 _ExponentialRandomVariable
,其间传入一个 double
类型的 beta
小数:
源码中能够看出,其对随机数处理的逻辑。其间 log
函数是以 e
为底 。 1-_random.nextDouble()
小于 1
,log(x) 的定义域取值规模是 0~1
,值域是 -无量 ~ 0
。这儿是 -logx * beta
,所以取值规模是 0 ~ 无量
, beta
起到扩大作用。
别的吐槽一下,这儿命名运用的是 exponential (指数)
,但从逻辑来看这儿运用的是 logarithm (对数)
,感觉不怎么严谨。
别的假如有需求,咱们也能够自定义 RandomVariable
完成特定的随机数生成器。
4. 速度作用控制器: SpeedEffectController
相同,SpeedEffectController
中的 child
子作用有必要是 DurationEffectController
一族,且子级设置的时长会被无效。结构时需求传入 double
型的 speed
参数,表明 每秒的改变量
。
如下事例,向上移动 100
,速度是 10
,就表明 10 s
移动到目的地。细心思考一下,这个特效关于子弹来说是比较有用的,能够结合 Curve
和 沿曲线运动
来完成一些更好玩的子弹。
void speedEffectController(){
DurationEffectController child = LinearEffectController(2);
EffectController ctrl = SpeedEffectController(child,speed: 10);
Effect effect = MoveByEffect(
Vector2(0, -100),
ctrl,
);
player.add(effect);
}
5. 控制器序列:SequenceEffectController
SequenceEffectController
中能够传入控制器列表,注意这个序列是次序的序列,不是各个控制器数值进行叠加。也就是说,会这些控制器会 顺次
履行动画。
比方下面是 SequenceEffectController
中放入了三个控制器,人物会顺次履行各个控制器的动画:
void sequenceEffectController(){
DurationEffectController child1 = LinearEffectController(2);
EffectController child2 = ZigzagEffectController(period: 2);
EffectController child3 = CurvedEffectController(2,Curves.ease);
EffectController ctrl = SequenceEffectController([
child1,child2,child3
]);
Effect effect = MoveByEffect(
Vector2(0, -100),
ctrl,
);
player.add(effect);
}
6. EffectController 结构
虽然 EffectController
是抽象类,但它有一个 factory
结构,集成了若干参数。细心看一下就能发现,这些其实都是前面介绍的各个完成类中需求的特点,也就是说 EffectController
经过了一个大杂烩的结构,来减缓控制器的运用。
瞄一下源码就能够看出,本质上就是利用这些参数来实例化完成类进行返回罢了。前面的常识理解后, EffectController
的结构办法能够说是方便的解决。
到这儿,经过四篇内容,介绍完了所以的 Effect
和所有的 EffectController
。这儿仅仅针对每个完成类举个小例子,实际中,咱们能够结合若干个作用或许控制器来完成一些组合特效。乃至去封装一些特定场景下的特效,以便复用。那本文就到这儿,明天见 ~
@张风捷特烈 2022.06.15 未允禁转
我的 大众号: 编程之王
-
我的 主页
: 张风捷特烈 -
我的 B站主页
: 张风捷特烈 -
我的 github 主页
: toly1994328
\