Flutterで売れるアプリを作ってみようPart10 コンピュータに考える時間をもたせる

ほのぼのリバーシ

毎日コツコツすすめています

最初はこちら、前回はこちら、次回はこちらを参照してください

今できているもの

コンピュータが間髪入れずコマを置いてくるので少し待たせることにしました

ついでにコマもRiveで描画するようにしています

よく見るとコマが動いています

学んだこと

RiveAnimation.assetの再描画方法

providerで再描画させようとしても、RiveAnimationを切り替えることができません

hoge = 'animation1'
child: RiveAnimation.asset(
  hoge,
  animations: const ['idle'],
),

setStateでhoge=animation2'にしても、animation1が表示される

Visibilityを挟んで、それぞれの描画のオンオフを行う必要がある

hoge = 'animation1'
child: Stack(
  children[
    Visibility(
      visible: (hoge == 'animation1'),
      child: RiveAnimation.asset(
             'animation2',
             animations: const ['idle'],
          ),
    ),
    Visibility(
      visible: (hoge == 'animation2'),
      child: RiveAnimation.asset(
             'animation2',
             animations: const ['idle'],
          ),
    ),
  ]
)

setStateでhoge=animation2'にするとanimation1が非表示になりanimation2が表示される

次にやること

コマを置いたときにアニメーションをつける

コメント

タイトルとURLをコピーしました