前言

今天來介紹 navigation 怎麼管理頁面 stack，以及navigation到其他頁面時帶參數的方式。

popup

stack 是一種資料結構，可以想像在桌上疊放文件，放一份文件叫做 put ，拿起一份文件叫做 pop。我們在轉換頁面的時候就像是把頁面一層一層疊上去，返回上一頁就是從最上層一層一層拿掉。

在手機APP中有可能會有錯綜復雜的操作，累積很多頁面，navigate api 提供在轉跳頁面時，清除一定範圍的 stack。以下介紹這三種

//方法 1.
// Pop everything up to the "home" destination off the back stack before
// navigating to the "friendslist" destination
navController.navigate("A ") {
    popUpTo("B")
}

//方法 2.
// Pop everything up to and including the "home" destination off
// the back stack before navigating to the "friendslist" destination
navController.navigate("A") {
    popUpTo("B") { inclusive = true }
}

//方法 3.
// Navigate to the "search” destination only if we’re not already on
// the "search" destination, avoiding multiple copies on the top of the
// back stack
navController.navigate("A") {
    launchSingleTop = true
}

首先我們先舉例 stack 中的頁面是 A → B → C → A → B → C

方法 1

如果此時 navigate 到 A ，且 popUpTo("B") 代表，清除到 B 之前的 stack 並且多一頁C

A → B → C → A → B → A

方法 2

前一種方法 加上 inclusive = true 就會連同 B 一起移除，那麼結過就會是

A → B → C → A → A

方法 3

上面幾種方法無法確保 A 只有一個，此時就很適合用 launchSingleTop = true

B → C → B → C→ A

Navigate 帶參數

如果想帶參數到頁面可以在composable() 的路徑參數後面加上 / 並且用 { } 把參數包起來，舉例如下， trainingID 是要帶的參數

composable(NavPath.Training.name + "/{trainingID}") {
	//...
}

然後要使用參數時，composable 提供 [NavBackStackEntry](https://developer.android.com/reference/kotlin/androidx/navigation/NavBackStackEntry) 可以在 lambda 中使用

composable(NavPath.Training.name + "/{trainingID}") { backStackEntry ->
	//...
}

有了參數後就可以傳給 ScreenComposable。

使用的方式就很像取 JSON 值

backStackEntry.arguments.getString("trainingID") 可以取得 String 值。同理getInt 可以取得Int值。

composable(NavPath.Search.name + "/{trainingID}") { backStackEntry ->
	TrainingScreen(id = backStackEntry.arguments.getString("trainingID")) 
}

如果參數是 nullable 就可表示成

backStackEntry.arguments?.getString("trainingID")

注意：這種用路徑傳地參數的方式只適合傳一點點資料，像是 id 值，有了id 值再去檢索要的資料。

總結

今天學會了 navigation 中轉跳頁面時stack的概念以及帶參數的方法。

參考

Navigating with Compose

今日運動
邊抱石邊寫鐵人賽(終於符合團名了XD)