Content padding parameter it is not used

Question

I recently started working with Jetpack Compose. I've got the following composable:

@Composable
fun SearchScreen(navController: NavHostController) {
    Scaffold(
        topBar = { SearchBar() },
        content = {
            Column (
                modifier = Modifier.fillMaxSize()
            ) {
                // some nested Composables
            }
        }
    )
}

But with this code as-is, the whole code within content = {...} is being underlined in red saying Jetpack Compose: Content padding parameter it is not used. I already read in this Stackoverflow Post that actually, PaddingValues only are provided in a Scaffold if the bottomBar is set, which obviously is not the case here. So I do not understand why I am getting this error.

Note: The app actually does use a BottomNavigation, but not within the Composable that I showed above. Can it be that this is still somehow propagated here?

Answer 1

It's required to use padding parameter, passed into Scaffold content composable. You should apply it to the topmost container/view in content:

content = { padding ->
    Column(
        modifier = Modifier
            .padding(padding)
    // ...

This is done to prevent layout problems, for example, when the scaffold has a bottom bar, without the use of this padding part of your view will be under the bar.

You can always suppress it with @SuppressLint("UnusedMaterialScaffoldPaddingParameter"), but I would recommend doing this only when you know exactly what you are doing.

Answer 2

use padding in Column and delete content

Scaffold(
    topBar = { SearchBar() }
){
    Column(Modifier.padding(it)) {
                ...
    }
}

Answer 3

I seen a bug in version alpha and I was using SmallTopAppBar() Scaffold didn't provide paddings to two composables was on top of each other. After updating it, just realized the bug fixed and Scaffold has itself a padding so composables is not on top of rach other anymore.

Usage:

  Scaffold(topBar = { AppBar() }) { paddingValues ->
  AnyComposable(modifier = Modifier.padding(paddingValues)){

  }

Answer 4

app build.gradle add this:

 buildFeatures {
    compose = true
    kotlinOptions.freeCompilerArgs += "-Xopt-in=androidx.compose.material.ExperimentalMaterialApi"
    kotlinOptions.freeCompilerArgs += "-Xopt-in=androidx.compose.foundation.ExperimentalFoundationApi"
    kotlinOptions.freeCompilerArgs += "-Xopt-in=androidx.compose.ui.ExperimentalComposeUiApi"
    kotlinOptions.freeCompilerArgs += "-Xopt-in=androidx.compose.animation.ExperimentalAnimationApi"
    kotlinOptions.freeCompilerArgs += "-Xopt-in=androidx.compose.animation.graphics.ExperimentalAnimationGraphicsApi"
    kotlinOptions.freeCompilerArgs += "-Xopt-in=kotlinx.serialization.ExperimentalSerializationApi"
    kotlinOptions.freeCompilerArgs += "-Xopt-in=com.google.accompanist.navigation.material.ExperimentalMaterialNavigationApi"
}

Answer 5

you can use this annotation :

@SuppressLint("UnusedMaterialScaffoldPaddingParameter")

Answer 6

I fixed this issue by passing the content's padding to the Modifier padding method:

Example:

 content = { padding ->
                MainScreenContainer(
                    navController = navController,
                    modifier = Modifier.padding(padding)
                )
            }

Answer 7

Add the it keyword:

Scaffold(
        topBar = { SearchBar() },
        content = { it
            Column(modifier = Modifier
                .fillMaxSize()
                .verticalScroll(rememberScrollState()))

This should work.