I have Compilation error when i use CenterAlignedTopAppBar in my code

Question

Hi I'm new in jetpack compose this is my code

@Composable
fun WoofApp() {
    Scaffold(
        topBar = {
            CenterAlignedTopAppBar(title = { Text(text = "hi") }) // ERROR
        }
    ) { it ->
        LazyColumn(contentPadding = it) {
            items(dogs) {
                DogItem(
                    dog = it,
                    modifier = Modifier.padding(dimensionResource(id = R.dimen.padding_small))
                )
            }
        }
    }
}

I have CompilationErrorException in android studio and it says

e: (above ERROR) This material API is experimental and is likely to change or to be removed in the future.

I tried TopAppBar() instead of CenterAlignedTopAppBar() but still got the same error

Answer 1

I assume you are using the material 3 API which is still experimental so you have to add this annotation on your composable function @OptIn(ExperimentalMaterial3Api::class) so your function should be like this:

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun WoofApp() {
    Scaffold(
        topBar = {
            CenterAlignedTopAppBar(title = { Text(text = "hi") }) // ERROR
        }
    ) { it ->
        //some code
    }
}