CMP-9264 Expose showLayoutBounds API on ComposePanel

This exposes a showLayoutBounds property on ComposePanel (desktop only)
that allows users to turn on or off the showLayoutBounds property on
the root layout node owner(s).

The change mostly pipes the property up to the ComposePanel, but has no
public API impact. The new property is also annotated as experimental.
The Skiko RootNodeOwner's showLayoutBounds is now also a state, to cause
a full recomposition when the value changes and see it reflected in the
UI.

Author: rock3r

compose/ui/ui/src/desktopMain/kotlin/androidx/compose/ui/awt/ComposePanel.desktop.kt

@@ -23,6 +23,7 @@ import androidx.compose.ui.LayerType
 import androidx.compose.ui.awt.RenderSettings.SkiaSurface
 import androidx.compose.ui.awt.RenderSettings.SwingGraphics
 import androidx.compose.ui.focus.FocusDirection
+import androidx.compose.ui.node.InternalCoreApi
 import androidx.compose.ui.scene.ComposeContainer
 import androidx.compose.ui.semantics.SemanticsOwner
 import androidx.compose.ui.window.WindowExceptionHandler
@@ -171,7 +172,7 @@ class ComposePanel @ExperimentalComposeUiApi constructor(
 
     override fun getPreferredSize(): Dimension? = if (isPreferredSizeSet) {
         super.getPreferredSize()
-    } else  {
+    } else {
         _composeContainer?.preferredSize ?: Dimension(0, 0)
     }
 
@@ -378,4 +379,14 @@ class ComposePanel @ExperimentalComposeUiApi constructor(
     fun renderImmediately() {
         _composeContainer?.renderImmediately()
     }
+
+    @ExperimentalComposeUiApi
+    var showLayoutBounds: Boolean
+        get() {
+            return _composeContainer?.showLayoutBounds ?: false
+        }
+        @InternalCoreApi
+        set(value) {
+            _composeContainer?.showLayoutBounds = value
+        }
 }

compose/ui/ui/src/desktopMain/kotlin/androidx/compose/ui/scene/ComposeContainer.desktop.kt

@@ -25,6 +25,7 @@ import androidx.compose.ui.awt.AwtEventListener
 import androidx.compose.ui.awt.AwtEventListeners
 import androidx.compose.ui.awt.RenderSettings
 import androidx.compose.ui.input.key.KeyEvent
+import androidx.compose.ui.node.InternalCoreApi
 import androidx.compose.ui.platform.DefaultArchitectureComponentsOwner
 import androidx.compose.ui.platform.PlatformContext
 import androidx.compose.ui.platform.PlatformWindowContext
@@ -176,6 +177,9 @@ internal class ComposeContainer(
     val preferredSize by mediator::preferredSize
     val semanticsOwners by mediator::semanticsOwners
 
+    @set:InternalCoreApi
+    var showLayoutBounds by mediator::showLayoutBounds
+
     private var isDisposed = false
     private var isDetached = true
     private var isMinimized = false

compose/ui/ui/src/desktopMain/kotlin/androidx/compose/ui/scene/ComposeSceneMediator.desktop.kt

@@ -43,6 +43,7 @@ import androidx.compose.ui.input.pointer.PointerIcon
 import androidx.compose.ui.input.pointer.PointerKeyboardModifiers
 import androidx.compose.ui.input.pointer.PointerType
 import androidx.compose.ui.navigationevent.BackNavigationEventInput
+import androidx.compose.ui.node.InternalCoreApi
 import androidx.compose.ui.platform.AwtDragAndDropManager
 import androidx.compose.ui.platform.DefaultInputModeManager
 import androidx.compose.ui.platform.DelegateRootForTestListener
@@ -322,7 +323,15 @@ internal class ComposeSceneMediator(
     val focusManager get() = scene.focusManager
     var compositionLocalContext: CompositionLocalContext?
         get() = scene.compositionLocalContext
-        set(value) { scene.compositionLocalContext = value }
+        set(value) {
+            scene.compositionLocalContext = value
+        }
+    var showLayoutBounds: Boolean
+        get() = scene.showLayoutBounds
+        @InternalCoreApi set(value) {
+            scene.showLayoutBounds = value
+        }
+
 
     /**
      * Provides the size of ComposeScene content inside infinity constraints
@@ -493,7 +502,7 @@ internal class ComposeSceneMediator(
     /**
      * Returns the first heavyweight ancestor of the given component.
      */
-    private fun Component.heavyWeightAncestorOrNull() : Component? {
+    private fun Component.heavyWeightAncestorOrNull(): Component? {
         var parent = parent
         while (parent != null) {
             if (!parent.isLightweight) return parent
@@ -671,13 +680,14 @@ internal class ComposeSceneMediator(
         scene.layoutDirection = layoutDirection
     }
 
-    override fun onRender(canvas: Canvas, width: Int, height: Int, nanoTime: Long) = catchExceptions {
-        interopContainer.postponingExecutingScheduledUpdates {
-            canvas.withSceneOffset {
-                scene.render(asComposeCanvas(), nanoTime)
+    override fun onRender(canvas: Canvas, width: Int, height: Int, nanoTime: Long) =
+        catchExceptions {
+            interopContainer.postponingExecutingScheduledUpdates {
+                canvas.withSceneOffset {
+                    scene.render(asComposeCanvas(), nanoTime)
+                }
             }
         }
-    }
 
     private inline fun Canvas.withSceneOffset(block: Canvas.() -> Unit) {
         // Offset of scene relative to [container]
@@ -706,7 +716,8 @@ internal class ComposeSceneMediator(
         keyboardModifiersRequireUpdate = true
     }
 
-    private inner class DesktopViewConfiguration : ViewConfiguration by PlatformContext.DefaultViewConfiguration {
+    private inner class DesktopViewConfiguration :
+        ViewConfiguration by PlatformContext.DefaultViewConfiguration {
         override val touchSlop: Float get() = with(platformComponent.density) { 18.dp.toPx() }
     }
 
@@ -747,7 +758,8 @@ internal class ComposeSceneMediator(
          * A new [SemanticsOwner] is always created above existing ones. So, usage of [LinkedHashMap]
          * is required here to keep insertion-order (that equal to [SemanticsOwner]s order).
          */
-        private val _accessibilityControllers = linkedMapOf<SemanticsOwner, AccessibilityController>()
+        private val _accessibilityControllers =
+            linkedMapOf<SemanticsOwner, AccessibilityController>()
         val accessibilityControllers get() = _accessibilityControllers.values.reversed()
 
         val semanticsOwners = mutableStateSetOf<SemanticsOwner>()
@@ -797,7 +809,8 @@ internal class ComposeSceneMediator(
         override fun convertScreenToLocalPosition(positionOnScreen: Offset): Offset =
             windowContext.convertScreenToLocalPosition(container, positionOnScreen)
 
-        override val measureDrawLayerBounds: Boolean = this@ComposeSceneMediator.measureDrawLayerBounds
+        override val measureDrawLayerBounds: Boolean =
+            this@ComposeSceneMediator.measureDrawLayerBounds
         override val viewConfiguration: ViewConfiguration = DesktopViewConfiguration()
         override val inputModeManager: InputModeManager = DefaultInputModeManager()
         override val textInputService = this@ComposeSceneMediator.textInputService
@@ -893,19 +906,20 @@ private fun ComposeScene.onMouseEvent(
     )
 }
 
-internal val MouseEvent.composePointerButton: PointerButton? get() {
-    if (button == MouseEvent.NOBUTTON) return null
-    return when (button) {
-        MouseEvent.BUTTON2 -> PointerButton.Tertiary
-        MouseEvent.BUTTON3 -> PointerButton.Secondary
-        else -> PointerButton(button - 1)
+internal val MouseEvent.composePointerButton: PointerButton?
+    get() {
+        if (button == MouseEvent.NOBUTTON) return null
+        return when (button) {
+            MouseEvent.BUTTON2 -> PointerButton.Tertiary
+            MouseEvent.BUTTON3 -> PointerButton.Secondary
+            else -> PointerButton(button - 1)
+        }
     }
-}
 
 private fun ComposeScene.onMouseWheelEvent(
     position: Offset,
     event: MouseWheelEvent
-) : PointerEventResult {
+): PointerEventResult {
     return sendPointerEvent(
         eventType = PointerEventType.Scroll,
         position = position,
@@ -923,37 +937,39 @@ private fun ComposeScene.onMouseWheelEvent(
 }
 
 
-private val MouseEvent.buttons get() = PointerButtons(
-    // We should check [event.button] because of case where [event.modifiersEx] does not provide
-    // info about the pressed mouse button when using touchpad on MacOS 12 (AWT only).
-    // When the [Tap to click] feature is activated on Mac OS 12, half of all clicks are not
-    // handled because [event.modifiersEx] may not provide info about the pressed mouse button.
-    isPrimaryPressed = ((modifiersEx and MouseEvent.BUTTON1_DOWN_MASK) != 0
-        || (id == MouseEvent.MOUSE_PRESSED && button == MouseEvent.BUTTON1))
-        && !isMacOsCtrlClick,
-    isSecondaryPressed = (modifiersEx and MouseEvent.BUTTON3_DOWN_MASK) != 0
-        || (id == MouseEvent.MOUSE_PRESSED && button == MouseEvent.BUTTON3)
-        || isMacOsCtrlClick,
-    isTertiaryPressed = (modifiersEx and MouseEvent.BUTTON2_DOWN_MASK) != 0
-        || (id == MouseEvent.MOUSE_PRESSED && button == MouseEvent.BUTTON2),
-    isBackPressed = (modifiersEx and MouseEvent.getMaskForButton(4)) != 0
-        || (id == MouseEvent.MOUSE_PRESSED && button == 4),
-    isForwardPressed = (modifiersEx and MouseEvent.getMaskForButton(5)) != 0
-        || (id == MouseEvent.MOUSE_PRESSED && button == 5),
-)
-
-private val MouseEvent.keyboardModifiers get() = PointerKeyboardModifiers(
-    isCtrlPressed = (modifiersEx and InputEvent.CTRL_DOWN_MASK) != 0,
-    isMetaPressed = (modifiersEx and InputEvent.META_DOWN_MASK) != 0,
-    isAltPressed = (modifiersEx and InputEvent.ALT_DOWN_MASK) != 0,
-    isShiftPressed = (modifiersEx and InputEvent.SHIFT_DOWN_MASK) != 0,
-    isAltGraphPressed = (modifiersEx and InputEvent.ALT_GRAPH_DOWN_MASK) != 0,
-    isSymPressed = false,
-    isFunctionPressed = false,
-    isCapsLockOn = getLockingKeyStateSafe(KeyEvent.VK_CAPS_LOCK),
-    isScrollLockOn = getLockingKeyStateSafe(KeyEvent.VK_SCROLL_LOCK),
-    isNumLockOn = getLockingKeyStateSafe(KeyEvent.VK_NUM_LOCK),
-)
+private val MouseEvent.buttons
+    get() = PointerButtons(
+        // We should check [event.button] because of case where [event.modifiersEx] does not provide
+        // info about the pressed mouse button when using touchpad on MacOS 12 (AWT only).
+        // When the [Tap to click] feature is activated on Mac OS 12, half of all clicks are not
+        // handled because [event.modifiersEx] may not provide info about the pressed mouse button.
+        isPrimaryPressed = ((modifiersEx and MouseEvent.BUTTON1_DOWN_MASK) != 0
+            || (id == MouseEvent.MOUSE_PRESSED && button == MouseEvent.BUTTON1))
+            && !isMacOsCtrlClick,
+        isSecondaryPressed = (modifiersEx and MouseEvent.BUTTON3_DOWN_MASK) != 0
+            || (id == MouseEvent.MOUSE_PRESSED && button == MouseEvent.BUTTON3)
+            || isMacOsCtrlClick,
+        isTertiaryPressed = (modifiersEx and MouseEvent.BUTTON2_DOWN_MASK) != 0
+            || (id == MouseEvent.MOUSE_PRESSED && button == MouseEvent.BUTTON2),
+        isBackPressed = (modifiersEx and MouseEvent.getMaskForButton(4)) != 0
+            || (id == MouseEvent.MOUSE_PRESSED && button == 4),
+        isForwardPressed = (modifiersEx and MouseEvent.getMaskForButton(5)) != 0
+            || (id == MouseEvent.MOUSE_PRESSED && button == 5),
+    )
+
+private val MouseEvent.keyboardModifiers
+    get() = PointerKeyboardModifiers(
+        isCtrlPressed = (modifiersEx and InputEvent.CTRL_DOWN_MASK) != 0,
+        isMetaPressed = (modifiersEx and InputEvent.META_DOWN_MASK) != 0,
+        isAltPressed = (modifiersEx and InputEvent.ALT_DOWN_MASK) != 0,
+        isShiftPressed = (modifiersEx and InputEvent.SHIFT_DOWN_MASK) != 0,
+        isAltGraphPressed = (modifiersEx and InputEvent.ALT_GRAPH_DOWN_MASK) != 0,
+        isSymPressed = false,
+        isFunctionPressed = false,
+        isCapsLockOn = getLockingKeyStateSafe(KeyEvent.VK_CAPS_LOCK),
+        isScrollLockOn = getLockingKeyStateSafe(KeyEvent.VK_SCROLL_LOCK),
+        isNumLockOn = getLockingKeyStateSafe(KeyEvent.VK_NUM_LOCK),
+    )
 
 private fun Component.subscribeToMouseEvents(mouseAdapter: MouseAdapter) {
     addMouseListener(mouseAdapter)

compose/ui/ui/src/skikoMain/kotlin/androidx/compose/ui/node/RootNodeOwner.skiko.kt

@@ -18,11 +18,11 @@ package androidx.compose.ui.node
 
 import androidx.collection.MutableIntObjectMap
 import androidx.collection.mutableIntObjectMapOf
-import androidx.compose.runtime.retain.RetainedValuesStore
 import androidx.compose.runtime.collection.mutableVectorOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.retain.ForgetfulRetainedValuesStore
+import androidx.compose.runtime.retain.RetainedValuesStore
 import androidx.compose.runtime.setValue
 import androidx.compose.runtime.snapshotFlow
 import androidx.compose.runtime.snapshots.Snapshot
@@ -68,13 +68,13 @@ import androidx.compose.ui.platform.DefaultAccessibilityManager
 import androidx.compose.ui.platform.DefaultHapticFeedback
 import androidx.compose.ui.platform.DelegatingSoftwareKeyboardController
 import androidx.compose.ui.platform.GraphicsLayerOwnerLayer
+import androidx.compose.ui.platform.LegacyRenderNodeLayer
 import androidx.compose.ui.platform.OwnedLayerManager
 import androidx.compose.ui.platform.PlatformClipboardManager
 import androidx.compose.ui.platform.PlatformContext
 import androidx.compose.ui.platform.PlatformRootForTest
 import androidx.compose.ui.platform.PlatformTextInputMethodRequest
 import androidx.compose.ui.platform.PlatformTextInputSessionScope
-import androidx.compose.ui.platform.LegacyRenderNodeLayer
 import androidx.compose.ui.platform.createPlatformClipboard
 import androidx.compose.ui.platform.setLightingInfo
 import androidx.compose.ui.scene.ComposeScene
@@ -135,7 +135,8 @@ internal class RootNodeOwner(
     private val rootSemanticsNode = EmptySemanticsModifier()
     private val snapshotObserver = snapshotInvalidationTracker.snapshotObserver()
     private val graphicsContext = SkiaGraphicsContext(platformContext.measureDrawLayerBounds)
-    private val coroutineScope = CoroutineScope(coroutineContext + Job(parent = coroutineContext[Job]))
+    private val coroutineScope =
+        CoroutineScope(coroutineContext + Job(parent = coroutineContext[Job]))
 
     private val _owner = OwnerImpl(layoutDirection, coroutineContext)
     val owner: Owner get() = _owner
@@ -397,10 +398,10 @@ internal class RootNodeOwner(
         override val focusOwner: FocusOwner = FocusOwnerImpl(platformFocusOwner, this)
 
         val rootModifier = if (ComposeUiFlags.areWindowInsetsRulersEnabled) {
-                RulerProviderModifierElement(platformContext.windowInsets)
-            } else {
-                Modifier
-            }
+            RulerProviderModifierElement(platformContext.windowInsets)
+        } else {
+            Modifier
+        }
             .then(EmptySemanticsElement(rootSemanticsNode))
             .focusProperties {
                 onExit = {
@@ -480,7 +481,7 @@ internal class RootNodeOwner(
 
         override suspend fun textInputSession(
             session: suspend PlatformTextInputSessionScope.() -> Nothing
-        ) : Nothing {
+        ): Nothing {
             textInputSessionMutex.withSessionCancellingPrevious<Nothing>(
                 sessionInitializer = ::TextInputSession,
                 session = session
@@ -498,7 +499,7 @@ internal class RootNodeOwner(
         override val fontLoader = androidx.compose.ui.text.platform.FontLoader()
         override val fontFamilyResolver = createFontFamilyResolver()
         override val layoutDirection get() = _layoutDirection
-        override var showLayoutBounds = false
+        override var showLayoutBounds by mutableStateOf(false)
             @InternalCoreApi
             set
 
@@ -934,7 +935,8 @@ internal class RootNodeOwner(
                 postponed.clear()
             }
 
-            val isAnyCurrentFrameRateSet = !currentFrameRate.isNaN() || currentFrameRateCategory != 0f
+            val isAnyCurrentFrameRateSet =
+                !currentFrameRate.isNaN() || currentFrameRateCategory != 0f
             if (ComposeUiFlags.isAdaptiveRefreshRateEnabled && isAnyCurrentFrameRateSet) {
                 platformContext.voteFrameRate(currentFrameRate, currentFrameRateCategory)
                 currentFrameRate = Float.NaN
@@ -994,7 +996,7 @@ private fun MeasureAndLayoutDelegate.updateRootConstraintsWithInfinityCheck(
 
 private fun IntSize.toConstraints() = Constraints(maxWidth = width, maxHeight = height)
 
-private object IdentityPositionCalculator: PositionCalculator {
+private object IdentityPositionCalculator : PositionCalculator {
     override fun screenToLocal(positionOnScreen: Offset): Offset = positionOnScreen
     override fun localToScreen(localPosition: Offset): Offset = localPosition
 }

compose/ui/ui/src/skikoMain/kotlin/androidx/compose/ui/scene/BaseComposeScene.skiko.kt

@@ -21,7 +21,6 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Composition
 import androidx.compose.runtime.CompositionContext
 import androidx.compose.runtime.CompositionLocalContext
-import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.MonotonicFrameClock
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -40,8 +39,6 @@ import androidx.compose.ui.input.pointer.PointerType
 import androidx.compose.ui.input.rotary.RotaryScrollEvent
 import androidx.compose.ui.node.SnapshotInvalidationTracker
 import androidx.compose.ui.platform.GlobalSnapshotManager
-import androidx.compose.ui.platform.LocalPlatformScreenReader
-import androidx.compose.ui.platform.LocalPlatformWindowInsets
 import androidx.compose.ui.platform.ProvidePlatformCompositionLocals
 import androidx.compose.ui.util.trace
 import kotlin.concurrent.Volatile

compose/ui/ui/src/skikoMain/kotlin/androidx/compose/ui/scene/CanvasLayersComposeScene.skiko.kt

@@ -38,6 +38,7 @@ import androidx.compose.ui.input.pointer.PointerEventType
 import androidx.compose.ui.input.pointer.PointerInputEvent
 import androidx.compose.ui.input.pointer.PointerType
 import androidx.compose.ui.input.rotary.RotaryScrollEvent
+import androidx.compose.ui.node.InternalCoreApi
 import androidx.compose.ui.node.RootNodeOwner
 import androidx.compose.ui.platform.PlatformContext
 import androidx.compose.ui.platform.setContent
@@ -273,6 +274,13 @@ private class CanvasLayersComposeSceneImpl(
         forEachOwner { it.draw(canvas) }
     }
 
+    override var showLayoutBounds: Boolean = false
+        @InternalCoreApi
+        set(value) {
+            field = value
+            forEachOwner { it.owner.showLayoutBounds = value }
+        }
+
     /**
      * Find hovered owner for position of first pointer.
      */
@@ -560,6 +568,8 @@ private class CanvasLayersComposeSceneImpl(
         private var onKeyEvent: ((KeyEvent) -> Boolean)? = null
 
         init {
+            @OptIn(InternalCoreApi::class)
+            owner.owner.showLayoutBounds = showLayoutBounds
             attachLayer(this)
         }
 

compose/ui/ui/src/skikoMain/kotlin/androidx/compose/ui/scene/ComposeScene.skiko.kt

@@ -284,4 +284,10 @@ sealed interface ComposeScene : AutoCloseable {
      * provided by the [androidx.compose.runtime.Recomposer] of the current scene.
      */
     suspend fun withMonotonicFrameClock(block: suspend () -> Unit)
+
+    /**
+     * Set the visual debug option that shows bounds for all nodes in the hierarchy.
+     */
+    @set:InternalComposeUiApi
+    var showLayoutBounds: Boolean
 }