代码之家 › 专栏 › 技术社区 › cluster1

Jetpack Compose Scaffold内容未在TopAppBar下方开始

jetpack android-jetpack-compose android

cluster1 · 技术社区 · 1 年前

我的onCreate方法看起来是这样的:

setContent {
  CaesarCipherTheme {
    Surface(
      modifier = Modifier.fillMaxSize(),
      color = MaterialTheme.colorScheme.background
    ) {
      Scaffold(
        modifier = Modifier.fillMaxWidth(),
        topBar = {
          TopAppBar(title = {
            Text(
              text = "Lorem Ipsum Dolor ...",
              textAlign = TextAlign.Center,
              fontSize = 32. sp,
              fontWeight = FontWeight.Bold)
          })
        }) {
        MainScreen()
      }
    }
  }
}

应用程序显示方式如下:

内容从最顶部开始,其上部被TopAppBar覆盖。

这里出了什么问题?

事实上,我希望内容从TopAppBar下面开始。

如何解决问题? 除了猜测一些填充并应用它。

1 回复 | 直到 1 年前

Tonnie 1 年前

@群集1 需要使用scaffold提供的innerPadding参数将填充应用于scaffold内部的内容区域。

你可以这样做:

Scaffold(
            modifier = Modifier.fillMaxSize(),
            topBar = {}
        )
    { 
    
    //inner padding parameter
    innerPadding ->
    
    //add a modifier to the MainScreen Composable and pass the innerPadding
    MainScreen(modifier = Modifier.padding(innerPadding)
    
    }

这将有助于正确放置顶部和底部钢筋。

推荐文章

somnathchakrabarti · 从Kotlin 2.0开始,启用Compose时需要Compose编译器Gradle插件

4 月前

Para1life · 解组时找不到类:com.google.firebase。时间戳,

4 月前