lottie-react-native: java.lang.IllegalStateException: You must set an images folder...

Hey,

thanks for the library - it looks very promising!

I’m seeing a crash on android, where the animation will begin to play but after a second or two the app will crash with the following logcat output:

07-15 21:16:32.668  3673  3690 W LOTTIE  : Lottie doesn't support layer effects. If you are using them for  fills, strokes, trim paths etc. then try adding them directly as contents  in your shape.
07-15 21:16:32.884  3673  3673 W LOTTIE  : Composition larger than the screen 5040x2835 vs 1080x1794. Scaling down.
07-15 21:16:33.879  3673  3673 D AndroidRuntime: Shutting down VM
07-15 21:16:33.963  3673  3673 E AndroidRuntime: FATAL EXCEPTION: main
07-15 21:16:33.963  3673  3673 E AndroidRuntime: Process: ch.enluf.laaxexplore, PID: 3673
07-15 21:16:33.963  3673  3673 E AndroidRuntime: java.lang.IllegalStateException: You must set an images folder before loading an image. Set it with LottieComposition#setImagesFolder or LottieDrawable#setImagesFolder
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.ImageAssetManager.bitmapForId(ImageAssetManager.java:73)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.LottieDrawable.getImageAsset(LottieDrawable.java:510)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.ImageLayer.getBitmap(ImageLayer.java:57)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.ImageLayer.getBounds(ImageLayer.java:41)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.CompositionLayer.getBounds(CompositionLayer.java:101)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.BaseLayer.intersectBoundsWithMatte(BaseLayer.java:295)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.BaseLayer.draw(BaseLayer.java:184)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.CompositionLayer.drawLayer(CompositionLayer.java:87)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.BaseLayer.draw(BaseLayer.java:175)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at com.airbnb.lottie.LottieDrawable.draw(LottieDrawable.java:305)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.widget.ImageView.onDraw(ImageView.java:1244)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.draw(View.java:16178)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.buildDrawingCacheImpl(View.java:15474)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.buildDrawingCache(View.java:15335)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.draw(View.java:15941)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.drawChild(ViewGroup.java:3609)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:3399)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.draw(View.java:16181)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15174)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:3593)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:3573)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.View.updateDisplayListIfDirty(View.java:15134)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ThreadedRenderer.updateViewTreeDisplayList(ThreadedRenderer.java:281)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ThreadedRenderer.updateRootDisplayList(ThreadedRenderer.java:287)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ThreadedRenderer.draw(ThreadedRenderer.java:322)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewRootImpl.draw(ViewRootImpl.java:2615)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewRootImpl.performDraw(ViewRootImpl.java:2434)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2067)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1107)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:6013)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.Choreographer$CallbackRecord.run(Choreographer.java:858)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.Choreographer.doCallbacks(Choreographer.java:670)
07-15 21:16:33.963  3673  3673 E AndroidRuntime: 	at android.view.Choreographer.doFrame(Choreographer.java:60

Question is, is this crash happening because the animation is using unsupported layer effects as the first line indicates, or is it something else? Will have to wait until our designer is able to create an animation that is completely supported, but in the meantime I figured I might ask around here. Thanks!

Specs: lottie-react-native 1.2.0 Google Nexus 5X 6.0.0 emulator running API 23

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 1
  • Comments: 25 (2 by maintainers)

Most upvoted comments

I encountered same problem. Because loading image must be set image folder. such as In Assets create image folder save image

LottieAnimationView lottieAnimationView = (LottieAnimationView) findViewById(R.id.animation_view); lottieAnimationView.setImageAssetsFolder("images/"); lottieAnimationView.setAnimation("splash_animation.json"); lottieAnimationView.loop(false); lottieAnimationView.playAnimation();

+36
Jiansion on Aug 11, 2017

this happens when your animation has “images” folder and you didnt place it in your assets folder. “images” folder contains images of your animation that couldnt convert to json object ,so it refrensed in json code to that particular image , when you dont place this folder, animation is incomplete and it will crashes your app .

+17
keivanshamlu on Feb 2, 2019

To resolve this, create a native assets folder (for android app/src/main/assets). Place your images inside a folder in this assets folder (like app/src/main/assets/images).

Now in the LottieView add a prop imageAssetsFolder, that should do it. Final code: <LottieView source={require('../assets/..some.json')} imageAssetsFolder={'images'} autoPlay />

+16
parth-choudhary on May 24, 2020

I’m having this issue but with json where assets is an empty array and deleting it made no difference.

+2
ged204 on Jun 12, 2019

You can find the solution in this. https://github.com/react-native-community/lottie-react-native/blob/6adef35bdecdaf8157486e875fb324a8ee158e5d/docs/api.md#using-animations-with-assets

+1
mingxin-yang on Aug 28, 2019

this happens when your animation has “images” folder and you didnt place it in your assets folder. “images” folder contains images of your animation that couldnt convert to json object ,so it refrensed in json code to that particular image , when you dont place this folder, animation is incomplete and it will crashes your app .

You’re right.So i edit the data.json. delete assets and refId

For example

"assets":[{"id":"image_0","w":48,"h":68,"u":"images/","p":"img_0.png","e":0},{"id":"image_1","w":64,"h":64,"u":"images/","p":"img_1.png","e":0},{"id":"image_2","w":280,"h":180,"u":"images/","p":"img_2.png","e":0}]

"refId":"image_0"
"refId":"image_1"
"refId":"image_2"
+1
RoJoHub on May 23, 2019

@lappalj4 @m-akopov If you have Illustrator layers or anything like that, make sure to convert them to shape layers. More info here. Images should be seldomly needed for Lottie and you lose a lot of the benefits of Lottie when you use them.

+1
gpeal on Nov 24, 2017

@Shagamii thanks, will have a look if that resolves the issue

+1
juiceo on Aug 11, 2017
Read more comments on GitHub
← lottie-react-native: iOS doesn't build latest version 3.0.3
lottie-react-native: Lottie animation doesn't play after Expo upgrade. →