I am working on a Kotlin Multiplatform project for Android and Desktop using Compose and have the Compose Multiplatform IDE Support plugin installed.
What I am trying to do is add the @Preview annotation so I can get a preview of the composables that I'm working on. I tried following this guide to implement that:
https://developer.android.com/jetpack/compose/tooling/studio
I want to have my shared Compose classes in the module shared-ui, so I added the following dependencies to the build.gradle.kts in that module:
dependencies {
debugImplementation("androidx.compose.ui:ui-tooling:1.3.2")
implementation("androidx.compose.ui:ui-tooling-preview:1.3.2")
}
However, even after a synchronization, when I try to use or import the @Preview annotation in my class (shared-ui/src/commonMain/kotlin/.../MyScreen.kt), I get this error:
Unresolved reference: preview
That happens twice: Once in the import statement, where the final word Preview is in red, and once in the annotation, where it is also the word Preview that is in red:
[...]
import androidx.compose.ui.tooling.preview.Preview
[...]
@Preview
@Composable
[...]
Incidentally, I also tried the quick fix option that Android Studio offered me there: "Add dependency on androidx.compose.ui.ui-tooling-preview and import". What that does is add the dependencies exactly where I added them (provided I remove them first, otherwise it does nothing), which apparently means that Android Studio agrees with me that this is where the dependencies should go.
Which brings me to my ultimate question: Why does this not work? What am I doing wrong? Based on my understanding, this should work. But it doesn't. Am I missing something?