Flutter 中资产的动画

问题描述

我目前正在开发一款类似于具有现代风格的古老 Tamagotchi 的应用。现在我准备了一些代码，不需要任何角色动画，但现在我卡住了。我想制作一个带有标题的脚手架，它下面有一行按钮，但仍然在屏幕顶部，第二组在底部，并在这两者之间创建某种交互性，角色由资产组成，一些动画和触摸反应.说清楚 - 像这样：

class _AnimationState extends State<Animation> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        "some title here"
      ),body:
        Column(
          children: [
             Row(here some buttons)
             Column(with animation,height as was left on screen)
             Row(another line of buttons)
          ],),);
  }
}

我正在考虑火焰引擎，甚至找到了教程，但是当我尝试实现它时，我收到异常

'_mulFromInteger' 方法在 null 上被调用。接收器：空尝试 调用：_mulFromInteger(0)

这是我研究过的教程： https://medium.com/flutter-community/sprite-sheet-animations-in-flutter-1b693630bfb3

以及我尝试实现的代码：

Center(
  child:
    Flame.util.animationAsWidget(Position(70,70),animation.Animation.sequenced('minotaur.png',5,textureWidth: 50),

另一个想法是使用 Sprite Widget，但我在之前的项目中从未使用过任何动画，也没有在 Flutter、C# 或我大学时使用的任何语言中使用过。

如果您有任何关于如何处理资产动画的建议、教程或示例，我将不胜感激。

解决方法

那个教程已经很老了，从那时起，Flame 的世界发生了很多事情。

我猜您正在使用 Flame 的 1.0.0-rc9 版本？

这样的事情应该适用于那个版本：

final animationData = SpriteAnimationData.sequenced(
  amount: 5,stepTime: 1.0,textureSize: Vector2.all(50)); 
final spriteAnimation = await SpriteAnimation.load(
  'minotaur.png' animationData);

...

Center(
  child: SpriteAnimationWidget(
    animation: spriteAnimation,playing: true,anchor: Anchor.center,),)

可以在 here 中找到它的示例。 还有一些简短的文档here。