I want to check Lottie lib for both iOS and Android today, I made a simple indicator animation in after effect and export it to .json file and it just works on iOS. When I test the same file on Android I got the following error:
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.test.lottietest/com.test.lottietest.MainActivity}: java.lang.NullPointerException: Attempt to invoke virtual method 'void com.airbnb.lottie.LottieAnimationView.setAnimation(java.lang.String)' on a null object reference
here is my activity XML
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.mtids.lottietest.MainActivity">
<view
class="com.airbnb.lottie.LottieAnimationView"
id="@+id/animationView"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginStart="133dp"
android:layout_marginTop="20dp"
android:onClick="animate"
android:text="animate" />
</RelativeLayout>
Activity code
public class MainActivity extends AppCompatActivity {
LottieAnimationView anim;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
anim = (LottieAnimationView) findViewById(R.id.animationView);
anim.setAnimation("indicator.json");
}
public void animate(View view) {
anim.loop(true);
anim.playAnimation();
}
}
Step 1: Go to Lottiefiles.com and log in so you can download and edit the Lottie animations. Step 2: Browse and search for the animation that matches your needs. Then click on Edit Layer Colors button. Step 3: Navigate to Lottie Editor if you already have a JSON you can upload it from here.
Give height required for widget in parent SizedBox, then adjust lottie height in the child OverflowBox. Also try using the fit param inside Lottie. asset widget. BoxFit.
Lottie is text and vector-based, so no matter how big you scale it, it'll never pixelate on any device. You can use the Lottie Interactivity Library to make your animations come alive. For all developers out there, Lottie handoffs are super easy. Be it Web, iOS, or Android, Lottie Libraries have got you covered.
Once you've added the Lottie element to your canvas, it's time to upload your JSON file and adjust the configurations. To start, double click the Lottie element to open the configuration options. Upload your JSON file. The animation will start when the element is in view.
i'v changed the id property to android : id="@+id/animationView" instead of id="@+id/animationView" only , and the error message become java.lang.IllegalStateException: Unable to find file indicator.json
As you correctly noticed, first you should change id
to android:id
.
Secondly, from the sources of setAnimation(String)
:
Sets the animation from a file in the assets directory.
Obviously, you have no file named "indicator.json" in assets
directory.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With