rive-app / rive-app/rive-flutter
Rive animation disappears when wrapped with `DecoratedBox` and `RivePanel`
Nobody has claimed this yet.
- Dominant language
- Dart
- Stars
- 1.5k
- Forks
- 240
- PR merge metrics
- No merged PRs in 30d
Description
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.
- Clone the reproduction repository
- Run the app and observe that the animation is not visible
- Remove
DecoratedBoxthat wrapsCircleRive:
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',
),
),
),
- After removing
DecoratedBox, the animation becomes visible - Adding
DecoratedBoxback 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!
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by running the linked rive_texture_bug reproduction with Flutter 3.35.5 and Rive 0.14.0, comparing the RivePanel examples with and without DecoratedBox and useSharedTexture enabled. Trace the RivePanel/shared-texture rendering path in rive-flutter; done means the animation remains visible when DecoratedBox is placed between RivePanel and the Rive widget.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- dart, flutter
- Domain
- frontend, mobile-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100