Is there a 'canonical' way/official documentation ...

# multiplatform

[kv]

Is there a 'canonical' way/official documentation to set up compose @Preview to work in KMP modules outside of the androidMain module? Seems like the default compose.components.uiToolingPreview does not work for Intellij/Android studio and that I have to explicitly add:

dependencies {
        debugImplementation(libs.androidx.compose.ui.tooling)
        implementation(libs.androidx.compose.ui.tooling.preview)
    }

to the desktopMain module and then I can get previews to show up - but not in the commonMain module. I created an issue here with more detailed steps of my investigation CMP-1550

[Rok Oblak]

It only works on Fleet. But the messaging is indeed confusing; at least I would like it to be clarified that Android Studio/IntelliJ support is coming later.

[kv]

yeah, i just see a casual mention on a blog post and that's about it https://blog.jetbrains.com/kotlin/2024/02/compose-multiplatform-1-6-0-release/#preview-annotation-for-fleet

[Wout Werkman]

You can get previews in desktopMain using the Compose Multiplatform IDE Support plugin in IntelliJ. If you want common previews without adding a desktop target, then it's only available in Fleet

[Rok Oblak]

Thank you, I did not know this @Wout Werkman. However I cannot seem to get it to work, I installed the plugin in IntelliJ CE, restarted, but I do not see how to open it (in AS it shows as an additional pane on top right).
The import is import org.jetbrains.compose.ui.tooling.preview.Preview and this is in commonMain

[Wout Werkman]

Yes, sadly the plugin only works in desktopMain like I mentioned. If you have a desktop target and the plugin there is a workaround available to make common previews work in IJ, but I couldn't find the link to the blog. It works via making @Preview an expect annotation class somehow.
If you don't have desktop, (eg, only android + iOS), then there are no previews in IJ. Even if you have desktop, it's only available via a workaround.
In this case it's only available in Fleet

[Rok Oblak]

@Wout Werkman I also tried in desktopMain but it did not work.
I realized my issue was the wrong import:

I had

org.jetbrains.compose.ui.tooling.preview.Preview

but I needed

androidx.compose.desktop.ui.tooling.preview.Preview

With this it works in desktopMain - but then again this doesn't help me much as I can already do this with Android previews in the Android module.

I tried a suggestion here but using my custom preview like that in common main did not show the preview icon.

Either way I hope this is simplified and clarified, because it is quite confusing with multiple imports and workarounds.

[kv]

also worth noting with non android @Previews you lose any customisation on the type of previews e.g. size, background etc

[Wout Werkman]

Either way I hope this is simplified and clarified, because it is quite confusing with multiple imports and workarounds.

That's fair feedback! We are working on this for Fleet, it might be worth making an issue for this in AS as well

[kv]

@Wout Werkman i did raise a new issue here if that's applicable https://youtrack.jetbrains.com/issue/CMP-1550

[Rok Oblak]

And I opened it yesterday for Android Studio on Google Issue Tracker, but not sure if it will be picked up:
https://issuetracker.google.com/issues/347509720

[wiktor]

just wanted to add to the discussion that I came here to find how to fix the preview for common module (my expectation was “there’s @Preview annotation, it must be a bug that it’s not displayed in the AS”), just found out about Fleet - silly question - is it a new recommendation for multiplatform projects? I am mostly focused on mobile platforms

[Rok Oblak]

@wiktor in case it helps you, there is a workaround to get commonMain previews in Android Studio:

https://kotlinlang.slack.com/archives/CJLTWPH7S/p1721202338084549?thread_ts=1719613328.448599&cid=CJLTWPH7S

[Wout Werkman]

This only works if you have a desktop target though

[Rok Oblak]

True.
But for many usecases even if you don't need a desktop target for your users, it's still a good investment to have it, simply because it is easier and faster to deploy than an Android emulator/iOS simulator.

[wiktor]

so I installed fleet just to test it, but I still can’t see the preview, do I need to add any plugin for this?

[wiktor]

oh nvm, there was an icon on the left

[Wout Werkman]

(Starting with yesterdays release, you can now enable Android previews under a feature flag. This gives you previews in your android sources and solves issues in larger Android projects with more Android dependencies)

[wiktor]

do you mean fleet release?

[wiktor]

gotcha, thanks for all the tips, and apologies for hijacking the thread