颤抖,重播GIF

时间:2019-11-04 15:11:27

标签: flutter dart

我正在制作一个简单的RockPaperScissors应用程序,其中我使用gif作为手部动画。

第一次播放动画时一切正常,但是如果您希望第二次播放gif,

(例如,一次选择两次岩石)

然后它仅显示gif的起始帧,而不会重播它。

此处提供代码:

小部件:

new Image(
          image: gameInstance.getPlayer1Choice(),
          width: 500.0,
          height: 500.0,
         )

点击功能:

  onPressed: () {
    setState(() {
            gameInstance.play(
               kRPSValues['rock']['game_value'],
             );
     });
  },

play()函数只是将一个键分配给var _userChoice(0到2,每个键代表石头,纸张或剪刀)

getPlayer1Choice()函数

 ImageProvider getPlayer1Choice() {
return AssetImage(user1ChoiceImage[_userChoice]);

}

和user1ChoiceImage cosnt:

const user1ChoiceImage = {
  0: "assets/paper-animation.gif" /*paper*/,
  1: "assets/stone-animation.gif" /*rock*/,
  2: "assets/scissors-animation.gif" /*scissors*/
};

每次img src更改时,是否有办法使gif从头开始?

总结:

  • 如果您是第一次选择摇滚,它将播放整个gif,然后,如果您选择纸张,则它将播放整个gif,但是如果您选择已经第二次播放过的gif,例如再次晃动,它仅显示gif第一帧的静态图像

谢谢!

3 个答案:

答案 0 :(得分:1)

https://github.com/flutter/flutter/issues/51775

@override
  void dispose() {
    image.evict();
    super.dispose();
  }

答案 1 :(得分:0)

也许从头开始重新创建动画需要很多工作,但是我建议您检查一下flutter_flare软件包:

https://pub.dev/packages/flare_flutter

https://www.2dimensions.com

您可以创建一个帐户,从其Web客户端(多个序列)创建动画,并从扑通的应用资产中导入并调用序列。

我让他们为定制装载程序从事多个项目。 希望对您有所帮助。

答案 2 :(得分:0)

我在这个post中找到了答案-正是我想要做的,唯一的缺点是您必须将gif分为多个帧