给我添加一个动画控制器这个动画有起飞保持飞翔降落行走四种状态我需要在点击下面这个按钮时起飞并保持飞翔2s然后降落在行走 floatingActionButton Positioned bottom 50 right 50
首先,需要在pubspec.yaml文件中添加rive_flutter插件。
然后,可以使用RiveAnimationController控制动画状态,根据需要在onTap回调方法中设置不同的状态。
代码示例:
import 'package:flutter/material.dart'; import 'package:rive_flutter/rive_flutter.dart';
class MyHomePage extends StatefulWidget { @override _MyHomePageState createState() => _MyHomePageState(); }
class _MyHomePageState extends State
@override void initState() { super.initState(); _controller = SimpleAnimation('Idle'); }
@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Animation Controller'), ), body: Center( child: RiveAnimation.asset( 'assets/birds.riv', controllers: [_controller], ), ), floatingActionButton: FloatingActionButton( onPressed: () { _controller.isActive = true; _controller.play('起飞'); Future.delayed(Duration(seconds: 2), () { _controller.play('保持飞翔'); Future.delayed(Duration(seconds: 2), () { _controller.play('降落'); Future.delayed(Duration(seconds: 2), () { _controller.play('行走'); }); }); }); }, child: Icon(Icons.play_arrow), ), ); } }
在这个示例中,我们创建了一个RiveAnimationController对象,将其传递给RiveAnimation小部件的controllers属性。在onTap回调方法中,我们设置了不同的状态,并使用Future.delayed方法实现了一些延时操作。注意,这里的动画状态名称需要根据实际情况进行调整
原文地址: https://www.cveoy.top/t/topic/flzf 著作权归作者所有。请勿转载和采集!