Skip to content

Green flicker on gradient fill during state-machine transition on Android (not present in the Rive editor) #462

Description

@ayanBureau

Submission checklist

  • I have confirmed the issue is present in the latest version of rive-android
  • I have searched the documentation and forums and could not find an answer
  • I have searched existing issues and this is not a duplicate

Description

On Android, a Rive graphic that contains a gradient fill shows a brief green flicker/flash (~1 frame) over the gradient area every time a state-machine transition runs. It's a purely visual artifact — no crash, no exception, no stack trace.

Key facts:

  • The exact same .riv renders correctly in the Rive editor — there is no flicker in the editor, only at runtime in the Android app.
  • If we replace the gradient fill with a solid fill, the flicker disappears completely. So it's specific to gradient rendering during transitions.
  • It happens on the "Name Insight" onboarding animation, but the trigger is generic: it's tied to a state-machine transition over a gradient-filled element.

Our setup:

  • Legacy RiveAnimationView, hosted inside Jetpack Compose via AndroidView.
  • Default renderer — we do not override rendererType, so it's whatever 11.1.0 defaults to (the Rive Renderer).
  • autoplay = true, Fit.FIT_WIDTH, data binding in use (ViewModelColorProperty / ViewModelNumberProperty / ViewModelStringProperty / ViewModelTriggerProperty).

The green tint (rather than black/transparent) suggests something like an uninitialized/cleared render target or a color-format mismatch (premultiplied alpha / RGBA↔BGRA) in the gradient path during the transition — but that's a guess; you'll know better.

Questions for the team:

  1. Is this a known issue with gradient fills in the default (Rive) renderer on Android 11.x?
  2. Does switching to RendererType.Canvas avoid it (acceptable temporary workaround for us)?
  3. Is there a recommended workaround short of removing gradients from the artwork?

Previous working version

Unknown — first time using a gradient in this animation. previously working but it came suddenly

Reproduction steps / code

Steps:

  1. In the Rive editor, add an element with a gradient fill to an artboard that has a state machine with a transition.
  2. Load the exported .riv in rive-android 11.1.0 using RiveAnimationView (default renderer), start the state machine.
  3. Fire the transition (a trigger input / a change to a data-bound input).
  4. Observe a green flash over the gradient region for ~1 frame during the transition.
  5. Open the same file in the Rive editor and run it → no flicker.
  6. Change the gradient fill to a solid fill and repeat on-device → flicker gone.

How we configure the view (simplified from our app):

// RiveAnimationView hosted in Compose via AndroidView; default renderer (rendererType not set)
riveAnimationView.setRiveResource(
    resId = R.raw.new_onboarding_nameinsight_animation_2,
    artboardName = "flow1",
    stateMachineName = "statemachine1",
    autoplay = true,
    fit = Fit.FIT_WIDTH
)
// Data binding is applied via ViewModel*Property (color/number/string/trigger).
// The transition is driven by firing a trigger / setting a data-bound input.

check the attached video where exactly at 00:03 time stamp seeing a green gradient which is not part of the animation file + not showing in the rive editor too.

Upload your reproduction files / stack trace

Screen.Recording.2026-07-06.at.5.01.00.PM.mov

Source .riv / .rev file

new_onboarding_name_insight.riv.zip

Screenshots / video

Screenshot 2026-07-07 at 1.20.21 AM.png
Screen Recording 2026-07-06 at 5.01.00 PM.mov

Rive Android runtime version

11.1.0

Rive API

Legacy

Device

Pixel 7, Nothing Phone 1

Device OS

Android 15

App minimum SDK level

29

App target SDK level

16

App NDK level

No response

Other Rive runtimes affected

IOS

Dependencies with native libraries

Microsoft Clarity and Sentry (both ship native code). We pickFirst librive-android.so and libc++_shared.so in packaging due to native-lib overlap.

Additional context

  • Renderer: default (Rive Renderer)rendererType is not overridden. Happy to test RendererType.Canvas if you think it's renderer-specific.
  • Hosting: RiveAnimationView inside Jetpack Compose via AndroidView (not the new Compose runtime).
  • Data binding is active on this artboard (ViewModelColorProperty, etc.).
  • The artifact is transient (~1 frame) and occurs only during the transition, only on a gradient fill, and only at runtime (never in the editor). Removing the gradient removes it entirely.
  • Fit.FIT_WIDTH, autoplay = true.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions