Blend states!

example/lib/liquid_download.dart

@@ -0,0 +1,94 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter/widgets.dart';
+import 'package:rive/rive.dart';
+
+/// An example showing how to drive a StateMachine via a trigger and number
+/// input.
+class LiquidDownload extends StatefulWidget {
+  const LiquidDownload({Key? key}) : super(key: key);
+
+  @override
+  _LiquidDownloadState createState() => _LiquidDownloadState();
+}
+
+class _LiquidDownloadState extends State<LiquidDownload> {
+  /// Tracks if the animation is playing by whether controller is running.
+  bool get isPlaying => _controller?.isActive ?? false;
+
+  Artboard? _riveArtboard;
+  StateMachineController? _controller;
+  SMIInput<bool>? _start;
+  SMIInput<double>? _progress;
+
+  @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/liquid_download.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;
+        var controller =
+            StateMachineController.fromArtboard(artboard, 'Download');
+        if (controller != null) {
+          artboard.addController(controller);
+          _start = controller.findInput('Download');
+          _progress = controller.findInput('Progress');
+        }
+        setState(() => _riveArtboard = artboard);
+      },
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: Colors.grey,
+      appBar: AppBar(
+        title: const Text('Liquid Download'),
+      ),
+      body: Center(
+        child: _riveArtboard == null
+            ? const SizedBox()
+            : GestureDetector(
+                onTapDown: (_) => _start?.value = true,
+                child: Column(
+                  children: [
+                    const SizedBox(height: 10),
+                    const Text(
+                      'Press to activate, slide for progress...',
+                      style: TextStyle(
+                        fontSize: 18,
+                      ),
+                    ),
+                    Slider(
+                      value: _progress!.value,
+                      min: 0,
+                      max: 100,
+                      label: _progress!.value.round().toString(),
+                      onChanged: (double value) {
+                        setState(() {
+                          _progress!.value = value;
+                        });
+                      },
+                    ),
+                    const SizedBox(height: 10),
+                    Expanded(
+                      child: Rive(
+                        artboard: _riveArtboard!,
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+      ),
+    );
+  }
+}

example/lib/main.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:rive_example/example_animation.dart';
 import 'package:rive_example/example_state_machine.dart';
+import 'package:rive_example/liquid_download.dart';
 import 'package:rive_example/little_machine.dart';
 import 'package:rive_example/state_machine_skills.dart';
 
@@ -73,6 +74,20 @@ class Home extends StatelessWidget {
                 );
               },
             ),
+            const SizedBox(
+              height: 10,
+            ),
+            ElevatedButton(
+              child: const Text('Liquid Download'),
+              onPressed: () {
+                Navigator.push(
+                  context,
+                  MaterialPageRoute<void>(
+                    builder: (context) => const LiquidDownload(),
+                  ),
+                );
+              },
+            ),
           ],
         ),
       ),