LazyColumn 引用返回起始位置

php小編草今天為大家介紹一款非常實用的功能－LazyColumn 引用回到起始位置。在開發過程中，我們經常需要建立一個垂直滾動列表，而LazyColumn正是為此而生。它可以根據需要動態產生列表項，大大提高了應用程式的效能和效率。同時，LazyColumn還可以回到清單的起始位置，方便我們進行指定位置的操作和處理。無論是開發行動應用程式還是網頁應用，LazyColumn都是一個非常實用的工具，讓我們一起來了解一下吧！

問題內容

我有一個申請。一張大圖片和底部的lazycolumn。當我轉到第四個（或第五個）連結然後返回時，我的 lazycolumn 最終位於初始位置。連結1在最上面。當我再次想要連結 4 時，我必須「扭轉」。

「本機」導覽列上的「後退」按鈕有所不同。當我回來時，lazycolumn 已經以我留下的形式在等著我。

程式中需要做什麼才能使頂部按鈕的行為與導覽列上的「後退」按鈕相同？

這是我的文件：

navgraph.kt

#

@composable
 fun navgraph(navcontroller: navhostcontroller){
     navhost(navcontroller = navcontroller, startdestination = screens.contents.route
     ) {
         addcontentsscreen(navcontroller, this)
         addscreen1(navcontroller, this)
         addscreen2(navcontroller, this)
         addscreen3(navcontroller, this)
         addscreen4(navcontroller, this)
         addscreen5(navcontroller, this)
     }
 }

 private fun addcontentsscreen(
     navcontroller: navhostcontroller,
     navgraphbuilder: navgraphbuilder
 ) {
     navgraphbuilder.composable(route = screens.contents.route) {
         contentsscreen(
             navigatescreen1 = { navcontroller.navigate(screens.screens1.route) },
             navigatescreen2 = { navcontroller.navigate(screens.screens2.route) },
             navigatescreen3 = { navcontroller.navigate(screens.screens3.route) },
             navigatescreen4 = { navcontroller.navigate(screens.screens4.route) },
             navigatescreen5 = { navcontroller.navigate(screens.screens5.route) },
         )
     }
 }

 private fun addscreen1(navcontroller: navhostcontroller, navgraphbuilder: navgraphbuilder) {
     navgraphbuilder.composable(route = screens.screens1.route) {
         screen1 (navigatecontentsscreen = { navcontroller.navigate(screens.contents.route) })
     }
 }

 private fun addscreen2(navcontroller: navhostcontroller, navgraphbuilder: navgraphbuilder) {
     navgraphbuilder.composable(route = screens.screens2.route) {
         screen2 (navigatecontentsscreen = { navcontroller.navigate(screens.contents.route) })
     }
 }

 private fun addscreen3(navcontroller: navhostcontroller, navgraphbuilder: navgraphbuilder) {
     navgraphbuilder.composable(route = screens.screens3.route) {
         screen3 (navigatecontentsscreen = { navcontroller.navigate(screens.contents.route) })
     }
 }

 private fun addscreen4(navcontroller: navhostcontroller, navgraphbuilder: navgraphbuilder) {
     navgraphbuilder.composable(route = screens.screens4.route) {
         screen4 (navigatecontentsscreen = { navcontroller.navigate(screens.contents.route) })
     }
 }

 private fun addscreen5(navcontroller: navhostcontroller, navgraphbuilder: navgraphbuilder) {
     navgraphbuilder.composable(route = screens.screens5.route) {
         screen5 (navigatecontentsscreen = { navcontroller.navigate(screens.contents.route) })
     }
 }

螢幕

sealed class screens(val route: string) {
     data object contents : screens("contents_screen")
     data object screens1 : screens("screen_1");
     data object screens2 : screens("screen_2");
     data object screens3 : screens("screen_3")
     data object screens4 : screens("screen_4");
     data object screens5 : screens("screen_5");
 }

screens.kt

#

class item(val link: () -> unit, val name: string)

 @composable
 fun contentslist(explanation: list<item>) {
     val liststate = rememberlazyliststate()
     lazycolumn(state = liststate) {
         items(explanation.size) { index ->
             val item = explanation[index]
             contentsbutton(
                 onclick = item.link,
                 text = item.name
             )
         }
     }
 }

 @composable
 fun contentsscreen(
     navigatescreen1: () -> unit,
     navigatescreen2: () -> unit,
     navigatescreen3: () -> unit,
     navigatescreen4: () -> unit,
     navigatescreen5: () -> unit,
 ) {
     val listofquestions = listof(
         item( navigatescreen1, "screen1"),
         item( navigatescreen2, "screen2"),
         item( navigatescreen3, "screen3"),
         item( navigatescreen4, "screen4"),
         item( navigatescreen5, "screen5"),
     )
     column {
         image(
             modifier = modifier.height(650.dp),
             painter = painterresource(id = r.drawable.cat),
             contentdescription = null,
             contentscale = contentscale.crop
         )
         contentslist(listofquestions)
     }
 }

screen4.kt

@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun Screen4(
     navigateContentsScreen: () -> Unit,
 ) {
     val text = "Screen4"
     Scaffold(
         containerColor = lightGray,
         contentColor = darkGrey,
         topBar = {
             TopAppBar(
                 modifier = Modifier.height(80.dp),
                 title = {
                     Box(
                         Modifier.fillMaxHeight(),
                         contentAlignment = Alignment.Center
                     ) {
                         Text(
                             maxLines = 1,
                             overflow = TextOverflow.Ellipsis,
                             text = text,
                             color = orange,
                         )
                     }
                 },
                 navigationIcon = {
                     Box(
                         Modifier.fillMaxHeight(),
                         contentAlignment = Alignment.Center
                     ) {
                         IconButton(
                             onClick = navigateContentsScreen
                         ) {
                             Icon(
                                 imageVector = Icons.Filled.ArrowBack,
                                 contentDescription = "Back",
                                 tint=orange,
                             )
                         }
                     }
                 },
                 colors = TopAppBarDefaults.mediumTopAppBarColors(
                     containerColor = darkGrey
                 )
             )
         }
     ) { contentPadding ->
         Column(
             modifier = Modifier
                 .fillMaxSize()
                 .padding(contentPadding)
                 .verticalScroll(rememberScrollState()),
         ) {
             Text(
                 text = "Screen4",
                 color = darkGrey,
                 textAlign = TextAlign.Justify,
                 modifier = Modifier.padding(24.dp)
             )
         }
     }
 }

我嘗試並蒐索，但一無所獲......

解決方法

嘗試按如下方式更改您的程式碼：

navGraphBuilder.composable(route = Screens.Screens4.route) {
    Screen4 (navigateContentsScreen = { navController.navigateUp() })
}

當您使用navcontroller.navigate(screens.contents.route) 時，您將始終為該路由創建一個新的backstackentry ，並且這個新目的地將是全新創建的，沒有任何狀態。請小心，您將使用目前的方法建立一個巨大的後台堆疊。

使用 navcontroller.navigateup() 或 navcontroller.popbackstack()，您將獲得實際的先前目的地。請參閱此 stackoverflow 帖子以了解差異的說明。

以上是LazyColumn 引用返回起始位置的詳細內容。更多資訊請關注PHP中文網其他相關文章！