Studio BumbleBee "Render Problem" For Compose Preview

Question

I am unable to preview anything in Studio, extending to something as simple as a Text. I get a "Render Error", revealing this stack trace.

java.lang.NoSuchMethodException: com.<packageName>.Navigation_ComponentsKt.<PreviewName>
    at androidx.compose.ui.tooling.CommonPreviewUtils.findComposableMethod(CommonPreviewUtils.kt:78)
    at androidx.compose.ui.tooling.CommonPreviewUtils.invokeComposableViaReflection$ui_tooling_release(CommonPreviewUtils.kt:183)
    at androidx.compose.ui.tooling.ComposeViewAdapter$init$3$1$composable$1.invoke(ComposeViewAdapter.kt:553)
    at androidx.compose.ui.tooling.ComposeViewAdapter$init$3$1$composable$1.invoke(ComposeViewAdapter.kt:551)
    at androidx.compose.ui.tooling.ComposeViewAdapter$init$3$1.invoke(ComposeViewAdapter.kt:590)
    at androidx.compose.ui.tooling.ComposeViewAdapter$init$3$1.invoke(ComposeViewAdapter.kt:546)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:215)
    at androidx.compose.ui.tooling.InspectableKt.Inspectable(Inspectable.kt:64)
    at androidx.compose.ui.tooling.ComposeViewAdapter$WrapPreview$1.invoke(ComposeViewAdapter.kt:495)
    at androidx.compose.ui.tooling.ComposeViewAdapter$WrapPreview$1.invoke(ComposeViewAdapter.kt:494)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:215)
    at androidx.compose.ui.tooling.ComposeViewAdapter.WrapPreview(ComposeViewAdapter.kt:490)
    at androidx.compose.ui.tooling.ComposeViewAdapter.access$WrapPreview(ComposeViewAdapter.kt:120)
    at androidx.compose.ui.tooling.ComposeViewAdapter$init$3.invoke(ComposeViewAdapter.kt:546)
    at androidx.compose.ui.tooling.ComposeViewAdapter$init$3.invoke(ComposeViewAdapter.kt:543)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.ui.platform.ComposeView.Content(ComposeView.android.kt:384)
    at androidx.compose.ui.platform.AbstractComposeView$ensureCompositionCreated$1.invoke(ComposeView.android.kt:228)
    at androidx.compose.ui.platform.AbstractComposeView$ensureCompositionCreated$1.invoke(ComposeView.android.kt:227)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:215)
    at androidx.compose.ui.platform.CompositionLocalsKt.ProvideCommonCompositionLocals(CompositionLocals.kt:148)
    at androidx.compose.ui.platform.AndroidCompositionLocals_androidKt$ProvideAndroidCompositionLocals$3.invoke(AndroidCompositionLocals.android.kt:114)
    at androidx.compose.ui.platform.AndroidCompositionLocals_androidKt$ProvideAndroidCompositionLocals$3.invoke(AndroidCompositionLocals.android.kt:113)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:215)
    at androidx.compose.ui.platform.AndroidCompositionLocals_androidKt.ProvideAndroidCompositionLocals(AndroidCompositionLocals.android.kt:106)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1$1$3.invoke(Wrapper.android.kt:162)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1$1$3.invoke(Wrapper.android.kt:161)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:215)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1$1.invoke(Wrapper.android.kt:161)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1$1.invoke(Wrapper.android.kt:144)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
    at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
    at androidx.compose.runtime.ComposerKt.invokeComposable(Composer.kt:3330)
    at androidx.compose.runtime.ComposerImpl$doCompose$2$5.invoke(Composer.kt:2577)
    at androidx.compose.runtime.ComposerImpl$doCompose$2$5.invoke(Composer.kt:2573)
    at androidx.compose.runtime.SnapshotStateKt.observeDerivedStateRecalculations(SnapshotState.kt:540)
    at androidx.compose.runtime.ComposerImpl.doCompose(Composer.kt:2566)
    at androidx.compose.runtime.ComposerImpl.composeContent$runtime_release(Composer.kt:2517)
    at androidx.compose.runtime.CompositionImpl.composeContent(Composition.kt:476)
    at androidx.compose.runtime.Recomposer.composeInitial$runtime_release(Recomposer.kt:727)
    at androidx.compose.runtime.CompositionImpl.setContent(Composition.kt:432)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1.invoke(Wrapper.android.kt:144)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1.invoke(Wrapper.android.kt:135)
    at androidx.compose.ui.platform.AndroidComposeView.setOnViewTreeOwnersAvailable(AndroidComposeView.android.kt:727)
    at androidx.compose.ui.platform.WrappedComposition.setContent(Wrapper.android.kt:135)
    at androidx.compose.ui.platform.WrappedComposition.onStateChanged(Wrapper.android.kt:187)
    at androidx.lifecycle.LifecycleRegistry$ObserverWithState.dispatchEvent(LifecycleRegistry.java:354)
    at androidx.lifecycle.LifecycleRegistry.addObserver(LifecycleRegistry.java:196)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1.invoke(Wrapper.android.kt:142)
    at androidx.compose.ui.platform.WrappedComposition$setContent$1.invoke(Wrapper.android.kt:135)
    at androidx.compose.ui.platform.AndroidComposeView.onAttachedToWindow(AndroidComposeView.android.kt:814)
    at android.view.View.dispatchAttachedToWindow(View.java:20751)
    at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3490)
    at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3497)
    at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3497)
    at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3497)
    at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3497)
    at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3497)
    at android.view.AttachInfo_Accessor.setAttachInfo(AttachInfo_Accessor.java:57)
    at com.android.layoutlib.bridge.impl.RenderSessionImpl.inflate(RenderSessionImpl.java:362)
    at com.android.layoutlib.bridge.Bridge.createSession(Bridge.java:436)
    at com.android.tools.idea.layoutlib.LayoutLibrary.createSession(LayoutLibrary.java:121)
    at com.android.tools.idea.rendering.RenderTask.createRenderSession(RenderTask.java:714)
    at com.android.tools.idea.rendering.RenderTask.lambda$inflate$7(RenderTask.java:870)
    at com.android.tools.idea.rendering.RenderExecutor$runAsyncActionWithTimeout$2.run(RenderExecutor.kt:187)
    at java.base/java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1128)
    at java.base/java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:628)
    at java.base/java.lang.Thread.run(Thread.java:834)

This seems to be happening only since two to three updates earlier of the Bumblebee Studio, and it is causing much discomfort.

I just realised while asking that I should probably file this as an issue on the issuetracker, but now I have typed this question, and I AM NOT GOING TO WASTE THIS HARDWORK.

Jokes aside, if anyone has stumbled upon this before, and possibly has a fix, kindly share. Is this a known issue of AGP or some other component? Workarounds are welcome.

Thanks

Answer 1

My project has multiple modules with multiple variants. In my case one module was using the wrong variant. I solved it by aligning all the variants in the Build Variants window.

Answer 2

In my case, I was trying to preview by trying to retrieve data from my ViewModel, which was causing the issue.

I was doing this:

@Preview(showSystemUi = true, showBackground = true)
@Composable
fun Preview() {
  Catalog(
    viewModel.getSomeData() // Don't do this!
  ) 
}

The key challenge here was the use of Hilt for dependency injection. Hilt injects ViewModels at runtime, but Compose previews are generated at compile time, leading to a "view not found" error because the ViewModel isn't available.

The solution is: avoid directly accessing the ViewModel in the preview function. For previews, use static data or mock the necessary data instead.

Answer 3

Step 1: Use latest version

    implementation "androidx.compose.ui:ui-tooling:1.3.3"

Step 2: Set systemUi and showBackground

@Preview(showSystemUi = true, showBackground = true)
@Composable
fun ModifierPreview() {

Text("hello world")
}

Step 3: Run the application for first time.

Without run the application it shows error. So first time run the app next time click refresh.

Answer 4

You have to use different version of androidx tooling in your build.gradle file
implementation "androidx.compose.ui:ui-tooling:1.0.0-rc01"
If it doesn't work try different version which works for you

Answer 5

Quick Fix

Use Android Studio Artic Fox 2020.3.1. It's now stable and supports Compose.

I've tested this Composable and it works fine:

@Preview(showBackground = true)
@Composable
fun Greeting(name: String = "") {
    Text(text = "Hello $name!")
}

Any questions left? Just comment.

See also

If you want to you can enable "Interactive and animation preview tools". It's under Settings -> Enable Interactive and animation preview tools

This allows you to instantly see the changes you made without building. This works only for some some basic types like strings and integers