Rive animation cannot be loaded on android build

[MarianLudwig]

Description

Hey! I recently added Rive for some animations to my app and they worked great in development mode. However, after building both for iOS and android, I noticed that the animations won't play on android. Everything works fine on iOS. I cut out the log of my android phone when I'm trying to play the animation:

10993 E Volley  : [108] NetworkDispatcher.processRequest: Unhandled exception java.lang.RuntimeException: Bad URL src_animations_rive_animation
10993 E Volley  : java.lang.RuntimeException: Bad URL src_animations_rive_animation
10993 E Volley  : 	at com.android.volley.toolbox.NetworkUtility.shouldRetryException(NetworkUtility.java:164)
10993 E Volley  : 	at com.android.volley.toolbox.BasicNetwork.performRequest(BasicNetwork.java:145)
10993 E Volley  : 	at com.android.volley.NetworkDispatcher.processRequest(NetworkDispatcher.java:132)
10993 E Volley  : 	at com.android.volley.NetworkDispatcher.processRequest(NetworkDispatcher.java:111)
10993 E Volley  : 	at com.android.volley.NetworkDispatcher.run(NetworkDispatcher.java:90)
10993 E Volley  : Caused by: java.net.MalformedURLException: no protocol: src_animations_rive_animation
10993 E Volley  : 	at java.net.URL.<init>(URL.java:601)
10993 E Volley  : 	at java.net.URL.<init>(URL.java:498)
10993 E Volley  : 	at java.net.URL.<init>(URL.java:447)
10993 E Volley  : 	at com.android.volley.toolbox.HurlStack.executeRequest(HurlStack.java:82)
10993 E Volley  : 	at com.android.volley.toolbox.BasicNetwork.performRequest(BasicNetwork.java:104)
10993 E Volley  : 	... 3 more

So, apparently, android is having a problem finding the animation because of a "bad URL". I'm working with expo and oriented myself here: #123 to load the assets - which works fine in the dev build and on iOS deployment but seems to have problems on android deployment.

A small snippet how I'm loading them:

import { Asset }  from 'expo-asset'
import riveAnimation from "../../animations/rive_animation.riv";

const myAnimation = Asset.fromModule(riveAnimation);

...

<Rive url={myAnimation.localUri || myAnimation.uri} />

Playing is handled with a ref but that should not be relevant here.

Did anyone else experience this issue and found a solution? Any help is highly appreciated!

I also already tried passing myAnimation.name to the resourceName if the platform is android, but that led to a crash. A log of that one is beneath, if relevant

See crash error

 E AndroidRuntime: FATAL EXCEPTION: expo-updates-error-recovery
 E AndroidRuntime: java.lang.IllegalStateException: File resource not found. You must provide correct url or resourceName!
 E AndroidRuntime: 	at com.rivereactnative.RiveReactNativeView.handleFileNotFound(RiveReactNativeView.kt:394)
 E AndroidRuntime: 	at com.rivereactnative.RiveReactNativeView.reloadIfNeeded(RiveReactNativeView.kt:294)
 E AndroidRuntime: 	at com.rivereactnative.RiveReactNativeView.update(RiveReactNativeView.kt:202)
 E AndroidRuntime: 	at com.rivereactnative.RiveReactNativeViewManager.onAfterUpdateTransaction(RiveReactNativeViewManager.kt:124)
 E AndroidRuntime: 	at com.rivereactnative.RiveReactNativeViewManager.onAfterUpdateTransaction(RiveReactNativeViewManager.kt:10)
 E AndroidRuntime: 	at com.facebook.react.uimanager.ViewManager.updateProperties(ViewManager.java:88)
 E AndroidRuntime: 	at com.facebook.react.uimanager.ViewManager.createViewInstance(ViewManager.java:188)
 E AndroidRuntime: 	at com.facebook.react.uimanager.ViewManager.createView(ViewManager.java:115)
 E AndroidRuntime: 	at com.facebook.react.uimanager.NativeViewHierarchyManager.createView(NativeViewHierarchyManager.java:281)
 E AndroidRuntime: 	at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute(UIViewOperationQueue.java:194)
 E AndroidRuntime: 	at com.facebook.react.uimanager.UIViewOperationQueue$1.run(UIViewOperationQueue.java:909)
 E AndroidRuntime: 	at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches(UIViewOperationQueue.java:1026)
 E AndroidRuntime: 	at com.facebook.react.uimanager.UIViewOperationQueue.access$2600(UIViewOperationQueue.java:47)
 E AndroidRuntime: 	at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1086)
 E AndroidRuntime: 	at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
 E AndroidRuntime: 	at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:175)
 E AndroidRuntime: 	at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:85)
 E AndroidRuntime: 	at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1140)
 E AndroidRuntime: 	at android.view.Choreographer.doCallbacks(Choreographer.java:946)
 E AndroidRuntime: 	at android.view.Choreographer.doFrame(Choreographer.java:870)
 E AndroidRuntime: 	at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1127)
 E AndroidRuntime: 	at android.os.Handler.handleCallback(Handler.java:938)
 E AndroidRuntime: 	at android.os.Handler.dispatchMessage(Handler.java:99)
 E AndroidRuntime: 	at android.os.Looper.loopOnce(Looper.java:210)
 E AndroidRuntime: 	at android.os.Looper.loop(Looper.java:299)
 E AndroidRuntime: 	at android.app.ActivityThread.main(ActivityThread.java:8105)
 E AndroidRuntime: 	at java.lang.reflect.Method.invoke(Native Method)
 E AndroidRuntime: 	at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:556)
 E AndroidRuntime: 	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1045)
 D OOMEventManagerFK: checkEventAndDumpForJE: 0
 I DropBoxManagerService: add tag=data_app_crash isTagEnabled=true flags=0x2

Expected behavior

Animations should work and behave the same way in deployment as in development build for both platforms

Device & Versions (please complete the following information)

• Device: Android phone (any, really)
• OS: Android 13
• React Native 0.70.5
• Expo 47.0.8
• rive-react-native 3.0.41

[TautvydasDerzinskas]

Any news on this? I have the same issue.

[t1gu1]

I Use that package with a prebuild and it's working fine for me. https://github.com/Malaa-tech/expo-custom-assets

Hope it helps.

Don't forget, no special caracters in the .riv file name. (Android don't like it..)

my-animation.riv = BAD my_animation.riv = GOOD (I think) myAnimation.riv = GOOD