Androidのナビゲーションコンポーネントにアニメーションを追加する方法


  1. まず、resフォルダ内に「anim」という名前のディレクトリを作成します。このディレクトリにアニメーションのXMLファイルを格納します。

  2. アニメーションのXMLファイルを作成します。例えば、フェードインのアニメーションを作成する場合、fade_in.xmlという名前のファイルを作成し、以下のようなコードを追加します。

<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:fromAlpha="0.0"
    android:toAlpha="1.0"
    android:duration="500" />
  1. ナビゲーショングラフのXMLファイル(例: nav_graph.xml)を開き、適用したい画面の遷移先のアクションに対してアニメーションを設定します。以下のようなコードを追加します。
<action
    android:id="@+id/action_destination"
    app:destination="@id/destination_fragment"
    app:enterAnim="@anim/fade_in"
    app:exitAnim="@android:anim/fade_out"
    app:popEnterAnim="@android:anim/fade_in"
    app:popExitAnim="@android:anim/fade_out" />
  1. アニメーションが適用される画面のフラグメントクラス(例: DestinationFragment.kt)を開き、次のようなコードを追加します。
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val inflater = TransitionInflater.from(requireContext())
    val transition = inflater.inflateTransition(R.transition.fade_in)
    enterTransition = transition
}

これでナビゲーションコンポーネントにアニメーションが追加されました。遷移時にフェードインのアニメーションが表示されます。