mirror of
https://github.com/rive-app/rive-flutter.git
synced 2025-11-08 17:05:58 +08:00
04d3908f57
Tested out the latest rive-common that now uses `package:web` and `dart:js_interop` The `RiveFile.initializeText` and everything associated with it are deprecated. Instead, use `RiveFile.initialize`, which will always need to be called when initializing text, audio, and layout. Calling it `initializeText` is confusing to users as they may not be using text, but still need to call this manually when using RiveFile.import. There is maybe additional cleanup we could do here, but at least want to make sure the public API is not confusing. Diffs= fa7c55934 Flutter release 0.13.5 (#7305) 973ff2276 Fix warnings about invalid toolsets (#7300) Co-authored-by: Gordon <pggordonhayes@gmail.com>
90 lines
2.5 KiB
Dart
90 lines
2.5 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:rive/rive.dart';
|
|
|
|
/// An example showing how to drive a StateMachine via a trigger input.
|
|
class LittleMachine extends StatefulWidget {
|
|
const LittleMachine({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
State<LittleMachine> createState() => _LittleMachineState();
|
|
}
|
|
|
|
class _LittleMachineState extends State<LittleMachine> {
|
|
/// Message that displays when state has changed
|
|
String stateChangeMessage = '';
|
|
|
|
Artboard? _riveArtboard;
|
|
SMITrigger? _trigger;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_loadRiveFile();
|
|
}
|
|
|
|
Future<void> _loadRiveFile() async {
|
|
final file = await RiveFile.asset('assets/little_machine.riv');
|
|
|
|
// The artboard is the root of the animation and gets drawn in the
|
|
// Rive widget.
|
|
final artboard = file.mainArtboard;
|
|
var controller = StateMachineController.fromArtboard(
|
|
artboard,
|
|
'State Machine 1',
|
|
onStateChange: _onStateChange,
|
|
);
|
|
if (controller != null) {
|
|
artboard.addController(controller);
|
|
_trigger = controller.getTriggerInput('Trigger 1');
|
|
}
|
|
setState(() => _riveArtboard = artboard);
|
|
}
|
|
|
|
/// Do something when the state machine changes state
|
|
void _onStateChange(String stateMachineName, String stateName) => setState(
|
|
() => stateChangeMessage =
|
|
'State Changed in $stateMachineName to $stateName',
|
|
);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: AppBar(title: const Text('Little Machine')),
|
|
body: Stack(
|
|
children: [
|
|
_riveArtboard == null
|
|
? const SizedBox()
|
|
: GestureDetector(
|
|
onTapDown: (_) => _trigger?.fire(),
|
|
child: Rive(
|
|
artboard: _riveArtboard!,
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
const Align(
|
|
alignment: Alignment.topCenter,
|
|
child: Padding(
|
|
padding: EdgeInsets.all(16.0),
|
|
child: Text(
|
|
'Press to activate!',
|
|
style: TextStyle(fontSize: 18, color: Colors.black),
|
|
),
|
|
),
|
|
),
|
|
Align(
|
|
alignment: Alignment.bottomCenter,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Text(
|
|
stateChangeMessage,
|
|
style: const TextStyle(
|
|
color: Colors.black, fontWeight: FontWeight.bold),
|
|
),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|