Skip to content

Rive animation disappears when wrapped with DecoratedBox and RivePanel #595

@eli1stark

Description

@eli1stark

Description

When a Rive animation with useSharedTexture: true is wrapped with DecoratedBox, and the DecoratedBox is wrapped with RivePanel, the animation disappears.

Workarounds:

  • Set useSharedTexture: false, or
  • Remove DecoratedBox

Note: If RivePanel is intended to replace DecoratedBox for shared texture rendering, its current functionality is limited because it only contains backgroundColor, which is insufficient to fully replace DecoratedBox features (such as borders, gradients, shadows, etc.).

Steps To Reproduce

I've created a reproduction repository with the code, .riv file, and .rev file in assets.

  1. Clone the reproduction repository
  2. Run the app and observe that the animation is not visible
  3. Remove DecoratedBox that wraps CircleRive:

Current code (animation not visible):

RivePanel(
  child: SizedBox.square(
    dimension: 250,
    child: DecoratedBox(
      decoration: BoxDecoration(
        shape: BoxShape.circle,
        color: Colors.blueAccent,
      ),
      child: CircleRive(
        filePath: 'assets/circle/circle.riv',
      ),
    ),
  ),
),

Modified code (animation becomes visible):

RivePanel(
  child: SizedBox.square(
    dimension: 250,
    child: CircleRive(
      filePath: 'assets/circle/circle.riv',
    ),
  ),
),
  1. After removing DecoratedBox, the animation becomes visible
  2. Adding DecoratedBox back causes the animation to disappear again

Expected Behavior

DecoratedBox (or any widget) should not prevent the animation from rendering when used together with RivePanel and useSharedTexture: true.

Actual Behavior

The animation disappears when DecoratedBox is placed between RivePanel and the Rive widget with useSharedTexture: true enabled.

Device & Versions

  • Device: Reproducible on all devices
  • Rive Version: 0.14.0
  • Flutter Version: 3.35.5
Flutter Doctor Output
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.35.5, on macOS 15.6.1 24G90 darwin-arm64, locale
    en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version
    35.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 26.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2025.1)
[✓] VS Code (version 1.96.4)
[✓] Connected device (5 available)
[✓] Network resources

• No issues found!

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions