在Flutter小部件中显示时,FlareActor获取/设置.flr动画的持续时间

时间:2019-08-09 15:01:43

标签: flutter flare

我正在使用Flutter创建一个自定义TextView小部件,在该小部件中,我想显示手写数字的动画,以便使文本看起来像是手写的。
我使用60 fps和持续时间00:00:50(500ms)为带有闪光的每个数字创建了动画。
处理多个数字时,必须从左到右顺序播放动画。即第二个数字的动画只能在第一个数字的动画结束之后开始。

第二点是,当实际手写时,要写入的每个数字的持续时间会有所不同。例如。 “ 1”写的时间不如“ 5”写的时间。

到目前为止,我使用Timer类使用了700ms的硬编码延迟。例如。当写数字“ 18”时,首先启动“ 1”的动画,然后等待700ms,然后启动“ 8”的动画,依此类推。 问题在于,即使在播放不同的延迟值之后,动画序列仍然看起来并不自然。

手写“ 1”动画的用法示例:

FlareActor(
  "assets/animations/hw_1.flr",
  alignment: Alignment.center,
  fit: BoxFit.fitHeight,
  animation: firstAnimationState,
)

两个连续动画的开始:

setState(() {
  // start first animation
  firstAnimationState = "write";
});

Timer(const Duration(milliseconds: 700), () {
  setState(() {
    // start second animation
    secondAnimationState = "write";
  });
});

在我的小部件内同步数字动画以及在彼此之间同步完整的TextViews应该很容易。

Flutter中是否可以通过编程方式(在FlareActor中)检索动画的持续时间,还是可以预先设置播放动画的持续时间?

1 个答案:

答案 0 :(得分:1)

您可以挂接到address already in use :::5002 小部件的completed事件,然后播放下一个动画。