【Flutter&Flame游戏 – 贰拾】构件特效

持续创作，加速成长！这是我参与「日新计划 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】

【Flutter&Flame游戏 - 贰拾】构件特效 | 其他 EffectControler

如下是 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

【Flutter&Flame游戏 – 贰拾】构件特效 | 其他 EffectControler

前言

1. 推迟特效控制器： DelayedEffectController

2. 重复控制器：Repeated 和无限控制器 Infinite

3.随机作用控制器: RandomEffectController

4. 速度作用控制器： SpeedEffectController

5. 控制器序列：SequenceEffectController

6. EffectController 结构

作者信息

推广

【Flutter&Flame游戏 – 贰拾】构件特效 | 其他 EffectControler

前言

1. 推迟特效控制器： DelayedEffectController

2. 重复控制器：Repeated 和 无限控制器 Infinite

3.随机作用控制器: RandomEffectController

4. 速度作用控制器： SpeedEffectController

5. 控制器序列：SequenceEffectController

6. EffectController 结构

相关文章

秋招临近，如何巧用 ChatGPT 帮你金九银十斩获各路大厂 Offer？

听，引擎的声音「GitHub 热点速览 v.22.33」

公司的这种打包启动方式，我简直惊呆了

字节跳动自研高性能微服务框架 Kitex 的演进之旅

作者信息

推广

2. 重复控制器：Repeated 和无限控制器 Infinite