Preview annotation in commonMain sourceSet

[IlyaGulya]

It is good to have multiplatform Preview annotation for all target platforms in commonMain sourceSet.

---

Hello! Currently desktop preview rendering is possible only in desktop sourceSet because ui-tooling-preview publishes androidx.compose.desktop.ui.tooling.preview.Preview annotation only for desktop sourceSet.

However, I've been able to successfully use current Compose Multiplatform IDE Support plugin to render preview defined in common sourceSet.

You can check the example here:https://github.com/IlyaGulya/compose-jb/tree/example/common-desktop-preview/experimental/examples/falling-balls-mpp I've moved GamePreview to common sourceSet and added stub androidx.compose.desktop.ui.tooling.preview.Preview annotation to trigger Compose Multiplatform IDE Support plugin to add gutter icon on GamePreview function.

I think Compose MPP team should consider publishing androidx.compose.desktop.ui.tooling.preview.Preview annotation for common sourceSet instead of desktop.

[syt0r]

This would be really helpful. Also it would be nice to have a drop down in preview tab to select target platform/device for preview as well as other features from android preview like multiple previews, zoom, grid view, interactive mode, etc. Is it on roadmap somewhere? I can't find any information regarding plans

[hm-tamim]

Any update on this?

[pjBooms]

not yet

[SerggioC]

Any updates on this issue?

[anwarpro]

any update ?

[amirhossein320]

It is good to have multiplatform Preview annotation for all target platforms in commonMain sourceSet.

Hello! Currently desktop preview rendering is possible only in desktop sourceSet because ui-tooling-preview publishes androidx.compose.desktop.ui.tooling.preview.Preview annotation only for desktop sourceSet.

However, I've been able to successfully use current Compose Multiplatform IDE Support plugin to render preview defined in common sourceSet.

You can check the example here:https://github.com/IlyaGulya/compose-jb/tree/example/common-desktop-preview/experimental/examples/falling-balls-mpp I've moved GamePreview to common sourceSet and added stub androidx.compose.desktop.ui.tooling.preview.Preview annotation to trigger Compose Multiplatform IDE Support plugin to add gutter icon on GamePreview function.

I think Compose MPP team should consider publishing androidx.compose.desktop.ui.tooling.preview.Preview annotation for common sourceSet instead of desktop.

and need to install Compose Multiplatform IDE Support

[senk0n]

It would be perfect to make use of Android Studio preview feature for composables from commonMain, at least for android target for now. So it will show how composable preview function from common code will look like on Android, in AS's preview ide view. (right in commonMain, without creating preview function in androidMain)

I assume it could be easier to do, than making a full spectrum of it's feature for Compose Multiplatform desktop IDE plugin from scratch. And maybe it's just a matter of configuration, because even AS's Layout Inspector works for kmp composables if you use androidx compose compiler in android target.

[Burtan]

I think this is very important to have @Preview working in shared compose ui code.

[anox1337]

I was wondering what the suggested workflow currently is for creating Composables without the Preview? Just good old fashioned rebuild or creating the composables within androidApp and then after finishing, copying them over to shared?

[pablichjenkov]

You don't have to write it in androidMain and copy to commonMain. You write it in commonMain and reference it from androidMain.

 // This is in androidMain files or Android App
 AndroidPreviewOfMyComposable {
  // Bellow lives is commonMain
  MyComposableFromCommon
}

Another alternative is, Android Studio gives a gutter icon to deploy un device instead of the IDE previewer. I found that to be really fast. Another alternative is using the Desktop target, build times are faster. Another alternative is using the JS target with continuous refresh enabled. It does hot reload in a decent time too.

[SirFilbido]

Any updates on this issue?

[chrisjenx]

This is probably my top feature right now, everything else is pretty good state (at least less of a priority right now), without previews live updating in common editing/updating/building screens is really slow/painful, while we can put previews in androidDebug, the screen living in commonMain means we need to manually build and refresh vs "native" compose dev where previews living in the same srcSet auto compile as you edit them.

• As a stop gap, updating the KMM plugin to allow build and refresh on save from the common would be a really big intial win, means don't have to keep switching windows/tabs etc.

[bartekpacia]

This works in latest Fleet release (link), but (at least in my experience) it's very slow (a refresh takes 5-10 sec on M1 macbook) and doesn't support all bells and whistles of @Preview from native Android. Still, good progress.

[coud]

Even the preview workaround using androidMain do not work when the commonMain composable is loading a resource. I'm getting this exception org.jetbrains.compose.resources.MissingResourceException: Missing resource with path: composeResources/mobileapp.composeapp.generated.resources/drawable/splash_bg.jpg Any idea?

[chrisjenx]

Even the preview workaround using androidMain do not work when the commonMain composable is loading a resource. I'm getting this exception org.jetbrains.compose.resources.MissingResourceException: Missing resource with path: composeResources/mobileapp.composeapp.generated.resources/drawable/splash_bg.jpg Any idea?

Yeah there is another ticket for this, the Preview plugin doesn't support common resources.

[igordmn]

Let's keep this as a meta issue for other children tasks:

• https://github.com/JetBrains/compose-multiplatform/issues/4869
• https://github.com/JetBrains/compose-multiplatform/issues/5078

[okushnikov]

Please check the following ticket on YouTrack for follow-ups to this issue. GitHub issues will be closed in the coming weeks.

[acmpo6ou]

Please check the following ticket on YouTrack for follow-ups to this issue. GitHub issues will be closed in the coming weeks.

But why move to YouTrack? Are all Compose issues gonna be on YouTrack now?