flutter/rive-flutter
1
0
Fork 0
mirror of https://github.com/rive-app/rive-flutter.git synced 2025-08-06 08:29:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: update README

Browse Source 
Mostly sentence case for headers and adding new info as needed + removing older things

Diffs=
e68c7b6de chore: update README (#6824)
bcf6451f4 Unity webgl! (#6816)
09feaccb0 Always decode 3 or 4 channel PNG images. (#6818)

Co-authored-by: Gordon <pggordonhayes@gmail.com>
This commit is contained in:
HayesGordon
2024-03-11 19:04:16 +00:00
parent 1557ea2ddc
commit b68f6e89a9
2 changed files with 3 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.rive_head
View File

@ -1 +1 @@
ef100e0d9462f9f71b0be53a0abdc2f438afeb92
e68c7b6ded17c667fe344426e54710875fc58e94

161
README.md
View File

@ -32,7 +32,7 @@ For more information, check out the following resources:
🛠 [Learning Rive](https://rive.app/learn-rive)
## Getting Started
## Getting started
To get started with Rive Flutter, check out the following resources:
- [Getting Started with Rive in Flutter](https://help.rive.app/runtimes/overview/flutter)
@ -43,7 +43,7 @@ For additional help, see the Runtime sections of the Rive help documentation, su
- [Animation Playback](https://help.rive.app/runtimes/playback)
- [State Machines](https://help.rive.app/runtimes/state-machines)
## Supported Platforms
## Supported platforms
Be sure to read the [platform specific considerations](platform_considerations.md) for the Rive Flutter package.
@ -51,163 +51,6 @@ Be sure to read the [platform specific considerations](platform_considerations.m
For even more examples and resources on using Rive at runtime or in other tools, checkout the [awesome-rive](https://github.com/rive-app/awesome-rive) repo.
## Examples
To see some examples of what you can do with Rive Flutter, check out the following projects:
- [Demo app](https://github.com/rive-app/rive-flutter/tree/master/example)
- [Find the Dog (game)](https://github.com/rive-app/find-the-dog)
Here is an example of how to play an animation from a Rive file retrieved over HTTP:
```dart
import 'package:flutter/material.dart';
import 'package:rive/rive.dart';
void main() {
runApp(MaterialApp(home: SimpleAnimation()));
}
class SimpleAnimation extends StatelessWidget {
const SimpleAnimation({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const Scaffold(
body: Center(
child: RiveAnimation.network(
'https://cdn.rive.app/animations/vehicles.riv',
),
),
);
}
}
```
To play an animation from an asset bundle, use:
```dart
RiveAnimation.asset('assets/truck.riv');
```
Control playing and pausing a looping animation:
```dart
import 'package:flutter/material.dart';
import 'package:rive/rive.dart';
void main() {
runApp(MaterialApp(home: PlayPauseAnimation()));
}
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;
// Toggles between play and pause animation states
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(
body: Center(
child: RiveAnimation.network(
'https://cdn.rive.app/animations/vehicles.riv',
controllers: [_controller],
// Update the play state when the widget's initialized
onInit: (_) => setState(() {}),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _togglePlay,
tooltip: isPlaying ? 'Pause' : 'Play',
child: Icon(
isPlaying ? Icons.pause : Icons.play_arrow,
),
),
);
}
}
```
Play a one-shot animation repeatedly on demand
```dart
/// Demonstrates playing a one-shot animation on demand
import 'package:flutter/material.dart';
import 'package:rive/rive.dart';
void main() {
runApp(MaterialApp(home: PlayOneShotAnimation()));
}
class PlayOneShotAnimation extends StatefulWidget {
const PlayOneShotAnimation({Key? key}) : super(key: key);
@override
_PlayOneShotAnimationState createState() => _PlayOneShotAnimationState();
}
class _PlayOneShotAnimationState extends State<PlayOneShotAnimation> {
/// Controller for playback
late RiveAnimationController _controller;
/// Is the animation currently playing?
bool _isPlaying = false;
@override
void initState() {
super.initState();
_controller = OneShotAnimation(
'bounce',
autoplay: false,
onStop: () => setState(() => _isPlaying = false),
onStart: () => setState(() => _isPlaying = true),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('One-Shot Example'),
),
body: Center(
child: RiveAnimation.network(
'https://cdn.rive.app/animations/vehicles.riv',
animations: const ['idle', 'curves'],
controllers: [_controller],
),
),
floatingActionButton: FloatingActionButton(
// disable the button while playing the animation
onPressed: () => _isPlaying ? null : _controller.isActive = true,
tooltip: 'Play',
child: const Icon(Icons.arrow_upward),
),
);
}
}
```
## Contributing
We love contributions and all are welcome! 💙