android 如何使用Jetpack编写应用程序栏后退按钮

3yhwsihp  于 2023-01-03  发布在  Android
关注(0)|答案(4)|浏览(167)

getActionBar().setDisplayHomeAsUpEnabled(true)这是我用于正常的android appCp,pact活动之间切换两个或多个活动。谁能告诉我如何在jetpack组合?

zd287kbt

zd287kbt1#

另一个答案对于显示后退按钮是正确的。这是一个使用TopAppBar可组合的小替代方案。
我也遇到了类似的问题,我想解决的主要问题是当你在根目录下或者backstack中没有任何内容时隐藏back按钮,因为setDisplayHomeAsUpEnabled会处理这个问题,只要你指定了你的父目录。
假设您使用的是带有compose的nav控制器,您可以执行如下操作

val navController = rememberNavController()
Scaffold(
    topBar = {
        TopAppBar(
            title = { Text(text = "app bar title") },
            navigationIcon = if (navController.previousBackStackEntry != null) {
                {
                    IconButton(onClick = { navController.navigateUp() }) {
                        Icon(
                            imageVector = Icons.Filled.ArrowBack,
                            contentDescription = "Back"
                        )
                    }
                }
            } else {
                null
            }

        )
    },
    content = {
        // Body content
    }
)

这里的关键是当返回栈中没有内容时,将TopAppBarnavigationIcon参数设置为null。这样,当您在根目录时,返回箭头将被隐藏,否则将显示。

mcvgt66p

mcvgt66p2#

您可以将主要内容 Package 在Scaffold可组合对象中,并使用topBar添加后退按钮并处理后退操作,如下所示:

import androidx.compose.material.Scaffold
 .
 .

 Scaffold(
      topBar = {
           Row {
               Icon(
               imageVector = Icons.Filled.ArrowBack,
               contentDescription = "Back",
               modifier = Modifier
                         .padding(16.dp)
                         .clickable {
                            // Implement back action here
                          }
                   )
              }
          }
    ) {
       BodyContent()
    }
41ik7eoe

41ik7eoe3#

其他两个解决方案都很好,帮助我完善了自己的变体,因为在许多屏幕上使用,我必须提取这些变体。

@Composable
fun MyScaffold(@StringRes titleId: Int, upAvailable: Boolean, onUpClicked: () -> Unit, content: @Composable (PaddingValues) -> Unit) {
    Scaffold(
        topBar = {
            TopAppBar(title = { MyText(textId = titleId) }, backgroundColor = Color.Black, navigationIcon = {
                if (upAvailable) {
                    IconButton(onClick = { onUpClicked() }) {
                        Icon(imageVector = Icons.Filled.ArrowBack, contentDescription = "Back", tint = Color.White)
                    }
                }
            })
        },
        backgroundColor = Color.Transparent,
        content = content
    )
}

其中MyText是我的变体,它接受字符串res,文本颜色为白色。
用法:

val isUpAvailable by viewModel.upAvailable.collectAsState()

MyScaffold(titleId = R.string.title, upAvailable = isUpAvailable, onUpClicked = { viewModel.navigateUp() }) {
 // Content
}

然后,我的BaseViewModel通过navigationManager依赖项提供upAvailable和navigateUp(),该依赖项通过navigationController处理导航:

if (destination.route == NAVIGATE_UP) { navController.navigateUp() }

...

// set on every navigation
navigationManager.setUpAvailable(navController.previousBackStackEntry != null)
wn9m85ua

wn9m85ua4#

这里是使用合成应用程序栏后退按钮的完整示例。https://github.com/pgatti86/toolbar-demo

val navController: NavHostController = rememberNavController()
   
 val isBackButtonVisible by remember {
  derivedStateOf { 
    navController.previousBackStackEntry != null 
  } 
}

使用派生状态来显示或隐藏后退按钮图标

相关问题