mirror of
https://github.com/rive-app/rive-flutter.git
synced 2025-06-27 02:07:12 +08:00
WIP on simplifying controller use
This commit is contained in:
@ -1,67 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:rive/rive.dart';
|
||||
|
||||
class ExampleAnimation extends StatefulWidget {
|
||||
const ExampleAnimation({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_ExampleAnimationState createState() => _ExampleAnimationState();
|
||||
}
|
||||
|
||||
class _ExampleAnimationState extends State<ExampleAnimation> {
|
||||
void _togglePlay() {
|
||||
if (_controller == null) {
|
||||
return;
|
||||
}
|
||||
setState(() => _controller!.isActive = !_controller!.isActive);
|
||||
}
|
||||
|
||||
/// Tracks if the animation is playing by whether controller is running.
|
||||
bool get isPlaying => _controller?.isActive ?? false;
|
||||
|
||||
Artboard? _riveArtboard;
|
||||
RiveAnimationController? _controller;
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
|
||||
// Load the animation file from the bundle, note that you could also
|
||||
// download this. The RiveFile just expects a list of bytes.
|
||||
rootBundle.load('assets/off_road_car.riv').then(
|
||||
(data) async {
|
||||
// Load the RiveFile from the binary data.
|
||||
final file = RiveFile.import(data);
|
||||
|
||||
// The artboard is the root of the animation and gets drawn in the
|
||||
// Rive widget.
|
||||
final artboard = file.mainArtboard.instance();
|
||||
// Add a controller to play back a known animation on the main/default
|
||||
// artboard. We store a reference to it so we can toggle playback.
|
||||
artboard.addController(_controller = SimpleAnimation('idle'));
|
||||
setState(() => _riveArtboard = artboard);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: const Text('Animation Example'),
|
||||
),
|
||||
body: Center(
|
||||
child: _riveArtboard == null
|
||||
? const SizedBox()
|
||||
: Rive(artboard: _riveArtboard!),
|
||||
),
|
||||
floatingActionButton: FloatingActionButton(
|
||||
onPressed: _togglePlay,
|
||||
tooltip: isPlaying ? 'Pause' : 'Play',
|
||||
child: Icon(
|
||||
isPlaying ? Icons.pause : Icons.play_arrow,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
@ -1,5 +1,5 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:rive_example/example_animation.dart';
|
||||
import 'package:rive_example/play_pause_animation.dart';
|
||||
import 'package:rive_example/example_state_machine.dart';
|
||||
import 'package:rive_example/liquid_download.dart';
|
||||
import 'package:rive_example/little_machine.dart';
|
||||
@ -42,7 +42,7 @@ class Home extends StatelessWidget {
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute<void>(
|
||||
builder: (context) => const ExampleAnimation(),
|
||||
builder: (context) => const PlayPauseAnimation(),
|
||||
),
|
||||
);
|
||||
},
|
||||
|
50
example/lib/play_pause_animation.dart
Normal file
50
example/lib/play_pause_animation.dart
Normal file
@ -0,0 +1,50 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:rive/rive.dart';
|
||||
|
||||
class PlayPauseAnimation extends StatefulWidget {
|
||||
const PlayPauseAnimation({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_PlayPauseAnimationState createState() => _PlayPauseAnimationState();
|
||||
}
|
||||
|
||||
class _PlayPauseAnimationState extends State<PlayPauseAnimation> {
|
||||
// Controller for playback
|
||||
late RiveAnimationController _controller;
|
||||
|
||||
// This will toggle between play and pause states for the animation
|
||||
void _togglePlay() {
|
||||
setState(() => _controller.isActive = !_controller.isActive);
|
||||
}
|
||||
|
||||
/// Tracks if the animation is playing by whether controller is running.
|
||||
bool get isPlaying => _controller.isActive;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_controller = SimpleAnimation('idle');
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: const Text('Animation Example'),
|
||||
),
|
||||
body: Center(
|
||||
child: RiveControllerAnimation.network(
|
||||
'https://cdn.rive.app/animations/vehicles.riv',
|
||||
controllers: [_controller],
|
||||
),
|
||||
),
|
||||
floatingActionButton: FloatingActionButton(
|
||||
onPressed: _togglePlay,
|
||||
tooltip: isPlaying ? 'Pause' : 'Play',
|
||||
child: Icon(
|
||||
isPlaying ? Icons.pause : Icons.play_arrow,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user