Would it be possible to add a sample for the new ViewNode in Compose (in v2.1.0)?

[wilfredbtan]

Previously, I would use the ViewRenderable to render an AndroidView. However, as ViewNode has changed significantly in v2.1.0, I am unable to get my AndroidView to show properly.

This is my old code:

// Dummy AndroidView
 val androidView =
      android.view.View(context)
          .apply {
              measure(MeasureSpec.UNSPECIFIED, MeasureSpec.UNSPECIFIED)
              layout(0, 0, 10, 5)
              setBackgroundColor(Color.WHITE)
          }

ViewRenderable.builder()
    .setView(context, androidView)
    .build(engine)
    .thenAccept {
        val viewAttachmentManager = ViewAttachmentManager(context, sceneView)

        viewAttachmentManager.onResume()

        val childNode = ViewNode(
            engine = engine,
            modelLoader = modelLoader,
            viewAttachmentManager = viewAttachmentManager,
        ).apply {
            setRenderable(it)
        }

        childNodes.add(childNode)

Scene(
    modifier = Modifier.fillMaxSize(),
    engine = engine,
    modelLoader = modelLoader,
    cameraNode = cameraNode,
    childNodes = childNodes,
    view = view,
    // ...
)

This is my broken attempt at trying to render the a child node:

val viewNodeWindowManager = rememberViewNodeManager()
val materialLoader = rememberMaterialLoader(engine)

// ...
rememberNode {
    ViewNode(
        engine = engine,
        windowManager = viewNodeWindowManager,
        materialLoader = materialLoader,
        content = {
            Text(text = context.getString("Some text"))
        }
    )
    .also {
        childNodes.add(it)
    }
}

Scene(
    modifier = Modifier.fillMaxSize(),
    engine = engine,
    modelLoader = modelLoader,
    cameraNode = cameraNode,
    childNodes = childNodes,
    view = view,
    // ...
    viewNodeWindowManager = viewNodeWindowManager   // added
)

Running the above results in the following crash:

FATAL EXCEPTION: main
Process: com.wilfredbtan.choreographic, PID: 31606
java.lang.IllegalStateException: ViewTreeLifecycleOwner not found from android.widget.FrameLayout{68df235 V.E...... ......I. 0,0-0,0}
at androidx.compose.ui.platform.WindowRecomposer_androidKt.createLifecycleAwareWindowRecomposer(WindowRecomposer.android.kt:352)
at androidx.compose.ui.platform.WindowRecomposer_androidKt.createLifecycleAwareWindowRecomposer$default(WindowRecomposer.android.kt:325)
at androidx.compose.ui.platform.WindowRecomposerFactory$Companion.LifecycleAware$lambda$0(WindowRecomposer.android.kt:168)
at androidx.compose.ui.platform.WindowRecomposerFactory$Companion.$r8$lambda$FWAPLXs0qWMqekhMr83xkKattCY(Unknown Source:0)
at androidx.compose.ui.platform.WindowRecomposerFactory$Companion$$ExternalSyntheticLambda0.createRecomposer(D8$$SyntheticClass:0)
at androidx.compose.ui.platform.WindowRecomposerPolicy.createAndInstallWindowRecomposer$ui_release(WindowRecomposer.android.kt:224)
at androidx.compose.ui.platform.WindowRecomposer_androidKt.getWindowRecomposer(WindowRecomposer.android.kt:300)
at androidx.compose.ui.platform.AbstractComposeView.resolveParentCompositionContext(ComposeView.android.kt:244)
at androidx.compose.ui.platform.AbstractComposeView.ensureCompositionCreated(ComposeView.android.kt:251)
at androidx.compose.ui.platform.AbstractComposeView.onAttachedToWindow(ComposeView.android.kt:283)
at android.view.View.dispatchAttachedToWindow(View.java:22479)
at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3686)
at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3695)
at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3695)
at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:3669)
at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:3116)
at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:10885)
at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1301)
at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1309)
at android.view.Choreographer.doCallbacks(Choreographer.java:923)
at android.view.Choreographer.doFrame(Choreographer.java:852)
at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1283)
at android.os.Handler.handleCallback(Handler.java:942)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loopOnce(Looper.java:226)
at android.os.Looper.loop(Looper.java:313)
at android.app.ActivityThread.main(ActivityThread.java:8757)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:571)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1067)

Could anyone guide me in the right direction to render a ViewNode properly in v2.1.0?

[NikitaGvozdilko]

The problem is in ViewAttachmentManager. It adds FrameLayout to WindowManager and non of them have reference on LifecycleOwner.

Here is workaround I created temporary. Replace lib's ViewAttachmentManager on this one:

`import android.content.Context import android.graphics.PixelFormat import android.view.View import android.view.ViewGroup import android.view.WindowManager import android.widget.FrameLayout import androidx.lifecycle.DefaultLifecycleObserver import androidx.lifecycle.LifecycleOwner import androidx.lifecycle.ViewModelStoreOwner import androidx.lifecycle.setViewTreeLifecycleOwner import androidx.lifecycle.setViewTreeViewModelStoreOwner import androidx.savedstate.SavedStateRegistryOwner import androidx.savedstate.setViewTreeSavedStateRegistryOwner import com.google.ar.sceneform.rendering.ViewAttachmentManager

/**

• Updated implementation of ViewAttachmentManager with access to frameLayout

• Don't forget to add to lifecycle observers otherwise View will not be rendered */ class ComposableViewAttachmentManager( context: Context, private val lifecycleOwner: LifecycleOwner, private val viewModelStoreOwner: ViewModelStoreOwner, private val savedStateRegistryOwner: SavedStateRegistryOwner, private val ownerView: View // Used to post callbacks onto the UI thread. ): ViewAttachmentManager(context, ownerView), DefaultLifecycleObserver { private val windowManager: WindowManager private val windowLayoutParams: WindowManager.LayoutParams private val frameLayout: FrameLayout private val viewLayoutParams: ViewGroup.LayoutParams

  init { windowManager = context.getSystemService(Context.WINDOW_SERVICE) as WindowManager windowLayoutParams = createWindowLayoutParams() frameLayout = FrameLayout(context) viewLayoutParams = createViewLayoutParams()

  frameLayout.setViewTreeLifecycleOwner(lifecycleOwner)
  frameLayout.setViewTreeSavedStateRegistryOwner(savedStateRegistryOwner)
  frameLayout.setViewTreeViewModelStoreOwner(viewModelStoreOwner)

  }

  override fun onResume(owner: LifecycleOwner) { onResume() }

  override fun onPause(owner: LifecycleOwner) { onPause() }

  override fun onResume() { // A ownerView can only be added to the WindowManager after the activity has finished resuming. // Therefore, we must use post to ensure that the window is only added after resume is finished. ownerView.post { if (frameLayout.parent == null && ownerView.isAttachedToWindow) { windowManager.addView(frameLayout, windowLayoutParams) } } }

  override fun onPause() { // The ownerView must be removed from the WindowManager before the activity is destroyed, or the // window will be leaked. Therefore we add/remove the ownerView in resume/pause. if (frameLayout.parent != null) { windowManager.removeView(frameLayout) } }

  /**

  • Add a ownerView as a child of the [FrameLayout] that is attached to the [ ].
  • Used by [RenderViewToExternalTexture] to ensure that the ownerView is drawn with all
  • appropriate lifecycle events being called correctly. */ override fun addView(view: View) { if (view.parent === frameLayout) { return } frameLayout.addView(view, viewLayoutParams) }

  /**

  • Remove a ownerView from the [FrameLayout] that is attached to the [WindowManager].
  • Used by [RenderViewToExternalTexture] to remove ownerView's that no longer need to be
  • drawn. */ override fun removeView(view: View) { if (view.parent !== frameLayout) { return } frameLayout.removeView(view) }

  companion object { private const val VIEW_RENDERABLE_WINDOW = "ViewRenderableWindow" private fun createWindowLayoutParams(): WindowManager.LayoutParams { val params = WindowManager.LayoutParams( WindowManager.LayoutParams.WRAP_CONTENT, WindowManager.LayoutParams.WRAP_CONTENT, WindowManager.LayoutParams.TYPE_APPLICATION_PANEL, WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE or WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS or WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE or WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED, PixelFormat.TRANSLUCENT ) params.title = VIEW_RENDERABLE_WINDOW return params }

  private fun createViewLayoutParams(): ViewGroup.LayoutParams {
      return ViewGroup.LayoutParams(
          ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT
      )
  }

  } } `