AndroidアプリでLottieアニメーションを始める

 1. Lottieを選ぶ

Androidアプリで使いたいLottieを選んでください。LottieFilesにある1000以上のLottieアニメーションの中から、お好きなものを選んでください。

Android用LottieFilesアプリを使って、選んだLottieが同じようにAndroidで再生されることを確認することが重要です。アニメーションがLottie Androidプレーヤーでサポートされている機能で作られていないこともあります。
LottieFilesのアニメーションの下にあるQRコードをアプリで読み取るだけで、アニメーションをプレビューすることができます。

アンドロイド版LottieFilesを入手する

2. プロジェクトのセットアップ

Lottieを使い始めるのは、とても簡単です。このガイドでは、IDEとしてAndroid Studioを使用していることを想定しています。別のIDEを使用している場合でも、同じ手順を使用することができます。

プロジェクトの構造パネルから、プロジェクトのbuild.gradleファイルを選択し、dependenciesブロックの中に次の行を追加します。

def lottieVersion = "3.4.0" implementation "com.airbnb.android:lottie:$lottieVersion"

lottieVersionを、入手可能な最新版に交換しましょう。
最新バージョンについては以下のとおりです。

LottieAnimationViewをレイアウトに追加

lottie-androidライブラリが提供するLottieAnimationViewで、アニメーションのレンダリングを行います。これをレイアウトのアニメーションを配置したい場所に追加してください。

<com.airbnb.lottie.LottieAnimationView android:id="@+id/animationView" android:layout_width="match_parent" android:layout_height="wrap_content" app:lottie_url="REPLACE_JSON_URL" app:lottie_autoPlay="true" app:lottie_loop="true"/>

アニメーションをアプリにバンドル

アニメーションをオフラインで動作させる必要がある場合は、アニメーションをプロジェクトのrawリソースに含めることで、アプリケーションにバンドルすることができます。

プロジェクトにない場合は、File>New>Folder>Raw Resources Folderで作成します。アニメーションに画像が含まれている場合は、.jsonと一緒に.zipにまとめて、同じ手順で作成することができます。

アニメーションをダウンロードし、使用用途に応じてanimation.jsonまたはanimation.zipにリネームして、raw resourcesフォルダに配置します。

バンドルされているアニメーションを使用するために、レイアウトコードを更新

<com.airbnb.lottie.LottieAnimationView android:id="@+id/animationView" android:layout_width="match_parent" android:layout_height="wrap_content" app:lottie_rawRes="@raw/animation" app:lottie_autoPlay="true" app:lottie_loop="true"/>

Lottieアニメーションを使った最初のAndroidプロジェクトは、これで準備完了です！ここから先は、プロジェクトをさらに設定し、アニメーションの動作をカスタマイズしていくだけです。Lottie-androidの公式ドキュメントに、これらの設定に関する詳細な情報が記載されています。
これが始まりですが、他にもできることはたくさんあります。Lottieをプロジェクトに活用するヒントは、ブログの「Lottieを仕事に活用」をご覧ください。

Androidアプリのための無料アニメーションを探そう

※この記事は、元々LottieFilesのウェブサイトに掲載されている内容を掲載し　　
　ています。
引用元：https://lottiefiles.com/jp/blog/working-with-lottie-ja/getting-started-lottie-animations-in-android-app