Navigation 回到上一頁轉場
先參考之前的AnimationNavigation的文章
還有App Top bar添加上一頁的文章
在NavHost加上navController.popBackStack()
1
2
3
4
5
composable(Destinations.ArticleDetail.route) {
ArticleDetailScreen(onBack = {
navController.popBackStack()
})
}
在詳細頁添加
fun()中丟入lambda的參數onBack: () -> Unit
在navigation的.clickable加上onBack()，記得要尾部括號()，不然不會執行lambda
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
fun ArticleDetailScreen(onBack: () -> Unit) {
Scaffold(
topBar = {
TopAppBar(
title = {
Text(
text = "Detail",
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.Center
)
},
navigationIcon = {
Icon(
imageVector = Icons.Default.NavigateBefore,
contentDescription = null,
//增加返回的方法
modifier = Modifier
.clickable {
onBack()
}
.padding(8.dp)
)
},
actions = {
Icon(imageVector = Icons.Default.TextFields,
contentDescription = null,
modifier = Modifier
.clickable {
//TODO 字體放大
}
.padding(8.dp)
)
}
)
},
modifier = Modifier
.background(MaterialTheme.colors.primary)
.statusBarsPadding()
) {
Text(text = "文章詳情")
}
}