Luồng điều hướng vòng tròn

Một ví dụ rõ ràng về trường hợp bạn cần quay lại đích đến là khi luồng điều hướng của bạn đi theo vòng tròn. Tài liệu này trình bày về trường hợp sử dụng đó.

Trường hợp

Giả sử ứng dụng của bạn có 3 đích đến: A, B và C. Ứng dụng này cũng có các thao tác dẫn từ A đến B, B đến C và C quay lại A. Biểu đồ điều hướng tương ứng sẽ có dạng như sau:

Với mỗi thao tác điều hướng, NavController sẽ thêm đích đến mới vào ngăn xếp lui. Do đó, khi bạn điều hướng liên tục qua luồng theo biểu đồ này, ngăn xếp lui sẽ chứa nhiều tập hợp gồm từng đích đến: A, B, C, A, B, C, A, B, C.

Giải pháp

Để tránh tình trạng lặp trong ngăn xếp lui, hãy chỉ định popUpTo() và inclusive trong lệnh gọi đến NavController.navigate() hoặc trong thao tác điều hướng.

Hãy xem xét trường hợp mà sau khi tới đích đến C, ngăn xếp lui chứa một thực thể của từng đích đến: A, B, C. Bạn cần đảm bảo rằng mình đã xác định popUpTo() và inclusive trong thao tác hoặc lệnh gọi đến navigate() để đưa người dùng từ đích đến C tới đích đến A.

Trong trường hợp này, khi người dùng điều hướng từ đích đến C về đích đến A, NavController cũng sẽ đẩy tới A. Như vậy tức là B và C sẽ bị xoá khỏi ngăn xếp. Khi inclusive = true, thao tác này cũng đẩy tới A đầu tiên, nhờ đó mà ngăn xếp được dọn sạch một cách hiệu quả.

Cách triển khai trong Compose

Sau đây là cách triển khai giải pháp cho popUpTo() vòng tròn trong Compose:

// When creating your `NavGraph` in your `NavHost`.
composable("c") {
    DestinationC(
        onNavigateToA = {
          navController.navigate("a") {
            popUpTo("a") {
              inclusive = true
            }
          }
        },
    )
}

Cách triển khai trong Khung hiển thị

Sau đây là cách triển khai giải pháp cho popUpTo vòng tròn trong Khung hiển thị:

<fragment
    android:id="@+id/c"
    android:name="com.example.myapplication.C"
    android:label="fragment_c"
    tools:layout="@layout/fragment_c">

    <action
        android:id="@+id/action_c_to_a"
        app:destination="@id/a"
        app:popUpTo="@+id/a"
        app:popUpToInclusive="true"/>
</fragment>