在Jetpack Compose中导航到没有上一个脚手架的另一个屏幕 [英] Navigate to another screen without the previous scaffold in Jetpack Compose

问题描述

我的应用程序有一个带有脚手架和底部导航栏的主屏幕：

 override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val navController = rememberNavController()
            MyApplicationTheme {
                Scaffold(
                    bottomBar = {
                        BottomBar(navController = navController)
                    }
                ) {
                    NavigationGraph(navController = navController)
                }
            }
        }
    }

...

@Composable
fun NavigationGraph(navController: NavHostController){
    NavHost(navController = navController, startDestination = BottomMenuOption.Home.route) {

        composable(route = BottomMenuOption.Home.route) {
            HomeScreen(navController = navController)
        }

        composable(route = BottomMenuOption.Settings.settings) {
            SettingsScreen()
        }
        composable(route = BottomMenuOption.Profile.route) {
            ProfileScreen()
        }

       composable(route = "feature") {
           FeatureScreen()
       }
    }

}

FeatureScreen有自己的Scaffold，使用topBar而不是BottomBar，当我从HomeScreen导航到它时，我想替换主屏幕中的前一个，只看到顶部栏，但我在屏幕上看到了两个栏。

@Composable
fun FeatureScreen() {
    Scaffold (
        topBar = {
            TopBar(" Feature Screen")
        }
            )  {

    }
}

有可能做到这一点吗？我认为只需使用一项新活动即可完成，但理想情况下，我希望保留单一活动方法。

推荐答案

我建议创建一个新函数，如下所示：

@Composable
fun MainScaffold(
    topBar: @Composable (() -> Unit) = {},
    bottomBar: @Composable (() -> Unit) = {},
    content: @Composable (PaddingValues) -> Unit){
    Scaffold(
        bottomBar = bottomBar,
        topBar = topBar,
        content = content
    )
}

然后，在屏幕上使用这个主脚手架：

@Composable
fun HomeScreen(navController: NavHostController) {
    MainScaffold(
        bottomBar = { BottomBar(navController = navController) },
        content = {
        // content
     })
}

在您的功能屏幕中：

@Composable
fun FeatureScreen() {
    MainScaffold (
        topBar = {
            TopBar(" Feature Screen")
        }
    )  {
        //content
    }
}

和集合内容

setContent {
       val navController = rememberNavController()
       VoiceAssistantJetpackComposeTheme {
           NavigationGraph(navController = navController)
       }}

这篇关于在Jetpack Compose中导航到没有上一个脚手架的另一个屏幕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！