Material Theming: Android Basics with Compose

[bielsnohr]

URL of codelab

https://developer.android.com/codelabs/basic-android-kotlin-compose-material-theming?continue=https%3A%2F%2Fdeveloper.android.com%2Fcourses%2Fpathways%2Fandroid-basics-compose-unit-3-pathway-3%3Fhl%3Den%23codelab-https%3A%2F%2Fdeveloper.android.com%2Fcodelabs%2Fbasic-android-kotlin-compose-material-theming&hl=en#6

In which task and step of the codelab can this issue be found?

Add a top bar, Step 4

Describe the problem

In order to use CenterAlignedTopAppBar within my project, I needed to add the @OptIn annotation before the function in which I want to use that Composable.

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun WoofTopAppBar(modifier: Modifier = Modifier) {
...
}

If I don't include this, then I get a compilation error:

> Task :app:compileDebugKotlin FAILED
e: file:///home/mbluteau/AndroidStudioProjects/basic-android-kotlin-compose-training-woof/app/src/main/java/com/example/woof/MainActivity.kt:90:5 This material API is experimental and is likely to change or to be removed in the future.

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:compileDebugKotlin'.
> A failure occurred while executing org.jetbrains.kotlin.compilerRunner.GradleCompilerRunnerWithWorkers$GradleKotlinCompilerWorkAction
   > Compilation error. See log for more details

Steps to reproduce?

At any point after having added CenterAlignedTopAppBar, try to Build & Refresh the project.

Versions

Android Studio version:

Android Studio Jellyfish | 2023.3.1 Patch 1
Build #AI-233.14808.21.2331.11842104, built on May 15, 2024
Runtime version: 17.0.10+0-17.0.10b1087.21-11572160 amd64
VM: OpenJDK 64-Bit Server VM by JetBrains s.r.o.
Linux 5.15.0-113-generic
GC: G1 Young Generation, G1 Old Generation
Memory: 2048M
Cores: 8
Non-Bundled Plugins:
IdeaVIM (2.12.0)
Current Desktop: ubuntu:GNOME

API version of the emulator: 31