androidkotlinandroid-jetpack-composenavigation-drawerandroid-compose-appbar

Why is TopAppBar navigationIcon's not a composable function?


My IDE is showing that navigationIcon is not a composable function. Other people are doing the same thing. I'm getting this error

@composable invocations can only happen from the context of an @composable function
@Composable
fun AppBar(onClick: () -> Unit){
    TopAppBar(
        title = "Princess World", 
        navigationIcon = { 
            IconButton(onClick = onClick) {
                Icon(imageVector = Icons.Default.Menu, contentDescription = null)
            } 
        },
    ) {}
}

I'm unable to use composable functions inside of title and navigation icon {}

@Composable
fun AppBar(onClick: () -> Unit){
   TopAppBar(title = { }, navigationIcon = { }) {

   }
}

Solution

  • You have to remove the final {}:

    TopAppBar(
        title = { Text("Princess World") },
        navigationIcon = {
            IconButton(onClick = onClick) {
                Icon(imageVector = Icons.Default.Menu, contentDescription = null)
            }
        }
    )
    

    Using the {} you are trying to use the constructor with the attribute content: @Composable RowScope.() -> Unit that doesn't have the title and the navigationIcon attributes.