Using Flutter: Why does Rive render the first animation used over any subsequent animations when using Liquid_Swipe?

Question

Given the basic example below, as you begin to swipe and reveal the next container, it's animation is shown correctly, but once the page is fully revealed the animation is replaced with the first container's animation (so the Smile will show up during reveal, but once fully revealed it is immediately replaced by the Ball), no matter the number of 'pages' the first 2 animations are the only two ever shown, and the first animation will ultimately be the one showing once a page is fully revealed - what am I failing to account for? - please and thank you.

  rive: ^0.8.4
  liquid_swipe: ^2.1.1

class _MyHomePageState extends State<MyHomePage> {
  final pages = [
    Container(
      color: Colors.purple,
      child: Center(
        child: RiveAnimation.asset(
          "assets/Ball.riv",
          controllers: [SimpleAnimation('Ball', autoplay: true)],
          artboard: 'Ball',
          animations: const ['Ball'],
          fit: BoxFit.scaleDown,
        ),
      ),
    ),
    Container(
      color: Colors.orange,
      child: Center(
        child: RiveAnimation.asset(
          "assets/Smile.riv",
          controllers: [SimpleAnimation('Smile', autoplay: true)],
          artboard: 'Smile',
          animations: const ['Smile'],
          fit: BoxFit.scaleDown,
        ),
      ),
    ),
  ];

  @override
  Widget build(BuildContext context) => Scaffold(
    body: LiquidSwipe(
      enableSideReveal: true,
      waveType: WaveType.liquidReveal,
      slideIconWidget: const Icon(Icons.arrow_back_rounded, color: Colors.white),
      pages: pages,
    ),
  );
}

Answer 1

so obviously I am new to Flutter...

Solution:

SizedBox( key: UniqueKey(),

🤦 moving around stateful widgets - I needed unique keys