はじめに

Navigation ではどこまで戻るかをPop To と Inclusive にて制御できます。
今回は実際にサンプルアプリを作成して、どこまで戻るか制御してみたいと思います。

用語	説明
Pop To	`Back`ボタンを押したとき、どこの画面まで戻るか指定できる
Inclusive	`Pop Up`で指定した画面の1つ前に戻るようにする

準備

`Navigation`をセットアップする

Navigation を利用したアプリケーションを作成するための下準備をします。
次の手順で必要なライブラリやクラス、レイアウトを生成していきます。

build.gradle(app)

dependencies {
    def nav_version = "2.1.0"
    implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
    implementation "androidx.navigation:navigation-ui-ktx:$nav_version"
}

`Fragment` を作成する

Navigation を使った遷移で利用する Fragment を作成していきます。
次の手順で OneFragment, TwoFragment, ThreeFragment の 3つを作成します。

Package Name を右クリックし、New → Fragment → Fragment(Blank) を選択する
Fragment Name に 任意の名称 を入力し OK を押す
Fragment にいらない記述が書かれているので消す
Layout に Fragment に遷移させるための Button を追加する
Layout に Fragment を遷移させたときのパラメータを表示されるTextViewを追加する

Fragment.kt

class OneFragment : Fragment() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_one, container, false)
    }
}

layout.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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=".OneFragment">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="50dp"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_gravity="bottom"
        android:text="Next" />

</FrameLayout>

実装

次の手順で実装し、Pop To と Inclusive の動きを確認して見たいと思います。

No	名称
1	`Navigation`で画面遷移させる
2	Pop To を利用して指定した画面まで戻る
3	Inclusive で Pop To で指定した画面の1つ前に戻る

Step1 `Navigation`で画面遷移させる

Safe Argsでパラメータを引き渡すため基本となる画面遷移を実装していきます。

Nav Graph の作成する

nav_graph.xmlを作成し、次の内容のNavigation Editorで記述します。
Nav Graphの作成の詳しい方法はこちらに書いてあるので参考にしてください。

nav_graph.xml

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/nav_graph"
    app:startDestination="@id/oneFragment">

    <fragment
        android:id="@+id/oneFragment"
        android:name="c.kaleidot725.safeargssample.OneFragment"
        android:label="fragment_one"
        tools:layout="@layout/fragment_one" >
        <action
            android:id="@+id/action_oneFragment_to_twoFragment"
            app:destination="@id/twoFragment" />
    </fragment>
    <fragment
        android:id="@+id/twoFragment"
        android:name="c.kaleidot725.safeargssample.TwoFragment"
        android:label="fragment_two"
        tools:layout="@layout/fragment_two" >
        <action
            android:id="@+id/action_twoFragment_to_threeFragment"
            app:destination="@id/threeFragment" />
    </fragment>
    <fragment
        android:id="@+id/threeFragment"
        android:name="c.kaleidot725.safeargssample.ThreeFragment"
        android:label="fragment_three"
        tools:layout="@layout/fragment_three" />
</navigation>

`Nav Host`を作成する

Main ActivityにFragmentを表示するためのNav Hostを作成します。

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <fragment
        android:id="@+id/nav_host_fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:defaultNavHost="true"
        app:navGraph="@navigation/nav_graph" />
</FrameLayout>

`Nav Controller` を取得して画面を遷移させる

OneFragment, TwoFragment, ThreeFragmentで
Nav Controllerを取得して、Buttonで画面遷移できるようにします。

OneFragment.kt

class OneFragment : Fragment() {

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_one, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        val b = view.findViewById<Button>(R.id.next_button)
        b.setOnClickListener {
            this.findNavController().navigate(R.id.action_oneFragment_to_twoFragment)
        }
    }
}

いまのところ、こんな感じで動作します。

Step2 Pop To を利用して指定した画面まで戻る

Navigation の Pop To を利用するとどこ画面まで戻ることか指定できます。
通常は OneFragment → TwoFragment → ThreeFragmentと遷移し Backボタンを押すと TwoFragmentに戻ります。

TwoFragment→ThreeFragmentの遷移にPop ToをOneFramgnetに設定してみます。
OneFragment → TwoFragment → ThreeFragmentと遷移しBackボタンを押すと
OneFragmentに戻るようになります。というようにPop To で指定したところまで戻ってくれるようになります。

Step3 Inclusive で Pop To で指定した画面の1つ前に戻る

Navigation の Inclusive を利用すると、Pop Toで指定した画面の1つに戻るようになります。
通常は OneFragment → TwoFragment → ThreeFragmentと遷移し Backボタンを押すと TwoFragmentに戻ります。

TwoFragment→ThreeFragmentの遷移にPop ToをOneFramgnetにしInclusiveにチェックを入れます。
OneFragment → TwoFragment → ThreeFragmentと遷移しBackボタンを押すと
OneFragmentの1つ前の画面に戻るのでアプリケーションが終了します。

Inclusive ですが Pop Toを指定しない場合だと機能しませんので注意が必要です。

おわりに

Pop To と Inclusiveが詳しく解説されているところが、
少ないので理解しづらいかと思いますがわかれば簡単ですね。

参考記事

Navigationの戻る制御
- すごくわかりやすいです、本記事はこの記事の補足的な立ち位置で作成しました。

［Android］Navigation でどこまで戻るか制御する (Pop To と Inclusive)

はじめに

準備

Navigationをセットアップする

Fragment を作成する

実装

Step1 Navigationで画面遷移させる