react-native-screens 4.24.0 → 4.25.0-beta.1

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/config/StackHeaderConfig.kt

@@ -0,0 +1,152 @@
+package com.swmansion.rnscreens.gamma.stack.header.config
+
+import android.annotation.SuppressLint
+import android.graphics.drawable.Drawable
+import android.util.LayoutDirection
+import com.facebook.react.bridge.ReactContext
+import com.facebook.react.views.view.ReactViewGroup
+import com.swmansion.rnscreens.gamma.common.ShadowStateProxy
+import com.swmansion.rnscreens.gamma.helpers.getSystemDrawableResource
+import com.swmansion.rnscreens.gamma.helpers.loadImage
+import com.swmansion.rnscreens.gamma.stack.header.subview.OnStackHeaderSubviewChangeListener
+import com.swmansion.rnscreens.gamma.stack.header.subview.StackHeaderSubview
+import com.swmansion.rnscreens.gamma.stack.header.subview.StackHeaderSubviewType
+import java.lang.ref.WeakReference
+
+@SuppressLint("ViewConstructor")
+class StackHeaderConfig(
+    val reactContext: ReactContext,
+) : ReactViewGroup(reactContext),
+    StackHeaderConfigProviding,
+    OnStackHeaderSubviewChangeListener {
+    override var type: StackHeaderType = StackHeaderType.SMALL
+        internal set
+    override var title: String = ""
+        internal set
+    override var hidden: Boolean = false
+        internal set
+    override var transparent: Boolean = false
+        internal set
+    override var backButtonHidden: Boolean = false
+        internal set
+    override var backButtonTintColor: Int? = null
+        internal set
+    override var backButtonIcon: Drawable? = null
+        internal set
+
+    // Staging fields for back button icon resolution.
+    // Both props may arrive in any order within a single update batch.
+    // Resolution happens in resolveBackButtonIconIfNeeded(), called from onAfterUpdateTransaction.
+    internal var backButtonDrawableIconResourceName: String? = null
+    internal var backButtonImageIconUri: String? = null
+
+    private var lastResolvedDrawableIconResourceName: String? = null
+    private var lastResolvedImageIconUri: String? = null
+
+    internal fun resolveBackButtonIconIfNeeded() {
+        val name = backButtonDrawableIconResourceName
+        val uri = backButtonImageIconUri
+
+        if (name == lastResolvedDrawableIconResourceName && uri == lastResolvedImageIconUri) {
+            return
+        }
+
+        lastResolvedDrawableIconResourceName = name
+        lastResolvedImageIconUri = uri
+
+        if (name != null) {
+            backButtonIcon = getSystemDrawableResource(context, name)
+        } else if (uri != null) {
+            loadImage(context, uri) { drawable ->
+                if (uri == lastResolvedImageIconUri) {
+                    backButtonIcon = drawable
+                    // We need to call notifyConfigChanged because icons are loaded asynchronously
+                    // and regular update path might execute too early.
+                    notifyConfigChanged()
+                }
+            }
+        } else {
+            backButtonIcon = null
+        }
+    }
+
+    override var backgroundSubview: StackHeaderSubview? = null
+        private set
+    override var leadingSubview: StackHeaderSubview? = null
+        private set
+    override var centerSubview: StackHeaderSubview? = null
+        private set
+    override var trailingSubview: StackHeaderSubview? = null
+        private set
+
+    override val isRTL: Boolean
+        get() = layoutDirection == LayoutDirection.RTL
+
+    private val shadowStateProxy = ShadowStateProxy()
+
+    internal var stateWrapper by shadowStateProxy::stateWrapper
+
+    override fun updateHeaderFrame(
+        width: Int,
+        height: Int,
+        contentOffsetY: Int,
+    ) {
+        shadowStateProxy.updateStateIfNeeded(
+            frameWidth = width,
+            frameHeight = height,
+            contentOffsetY = contentOffsetY,
+        )
+    }
+
+    private var onConfigChangeListener: WeakReference<OnHeaderConfigChangeListener>? = null
+
+    override fun setOnConfigChangeListener(listener: OnHeaderConfigChangeListener?) {
+        onConfigChangeListener = listener?.let { WeakReference(it) }
+    }
+
+    internal fun notifyConfigChanged() {
+        onConfigChangeListener?.get()?.onHeaderConfigChange(this)
+    }
+
+    override fun onStackHeaderSubviewChange() = notifyConfigChanged()
+
+    internal fun addConfigSubview(headerSubview: StackHeaderSubview) {
+        when (headerSubview.type) {
+            StackHeaderSubviewType.BACKGROUND -> backgroundSubview = headerSubview
+            StackHeaderSubviewType.LEADING -> leadingSubview = headerSubview
+            StackHeaderSubviewType.CENTER -> centerSubview = headerSubview
+            StackHeaderSubviewType.TRAILING -> trailingSubview = headerSubview
+        }
+        headerSubview.onStackHeaderSubviewChangeListener = WeakReference(this)
+        notifyConfigChanged()
+    }
+
+    internal fun removeConfigSubview(headerSubview: StackHeaderSubview) {
+        headerSubview.onStackHeaderSubviewChangeListener = null
+        when (headerSubview.type) {
+            StackHeaderSubviewType.BACKGROUND -> backgroundSubview = null
+            StackHeaderSubviewType.LEADING -> leadingSubview = null
+            StackHeaderSubviewType.CENTER -> centerSubview = null
+            StackHeaderSubviewType.TRAILING -> trailingSubview = null
+        }
+        notifyConfigChanged()
+    }
+
+    internal fun removeConfigSubviewAt(index: Int) {
+        getConfigSubviewAt(index)?.let { removeConfigSubview(it) }
+    }
+
+    internal fun removeAllConfigSubviews() {
+        backgroundSubview?.let { removeConfigSubview(it) }
+        leadingSubview?.let { removeConfigSubview(it) }
+        centerSubview?.let { removeConfigSubview(it) }
+        trailingSubview?.let { removeConfigSubview(it) }
+    }
+
+    internal val configSubviewsCount: Int
+        get() = listOfNotNull(backgroundSubview, leadingSubview, centerSubview, trailingSubview).size
+
+    // The order of the subviews MUST match the order of JS StackHeaderConfig children.
+    internal fun getConfigSubviewAt(index: Int): StackHeaderSubview? =
+        listOfNotNull(backgroundSubview, leadingSubview, centerSubview, trailingSubview).getOrNull(index)
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/config/StackHeaderConfigProviding.kt

@@ -0,0 +1,28 @@
+package com.swmansion.rnscreens.gamma.stack.header.config
+
+import android.graphics.drawable.Drawable
+import com.swmansion.rnscreens.gamma.stack.header.subview.StackHeaderSubviewProviding
+
+interface StackHeaderConfigProviding {
+    val type: StackHeaderType
+    val title: String
+    val hidden: Boolean
+    val transparent: Boolean
+    val backButtonHidden: Boolean
+    val backButtonTintColor: Int?
+    val backButtonIcon: Drawable?
+    val leadingSubview: StackHeaderSubviewProviding?
+    val centerSubview: StackHeaderSubviewProviding?
+    val trailingSubview: StackHeaderSubviewProviding?
+    val backgroundSubview: StackHeaderSubviewProviding?
+
+    val isRTL: Boolean
+
+    fun updateHeaderFrame(
+        width: Int,
+        height: Int,
+        contentOffsetY: Int,
+    )
+
+    fun setOnConfigChangeListener(listener: OnHeaderConfigChangeListener?)
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/config/StackHeaderConfigViewManager.kt

@@ -0,0 +1,157 @@
+package com.swmansion.rnscreens.gamma.stack.header.config
+
+import android.view.View
+import com.facebook.react.bridge.JSApplicationIllegalArgumentException
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.ReactStylesDiffMap
+import com.facebook.react.uimanager.StateWrapper
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.viewmanagers.RNSStackHeaderConfigAndroidManagerDelegate
+import com.facebook.react.viewmanagers.RNSStackHeaderConfigAndroidManagerInterface
+import com.swmansion.rnscreens.gamma.stack.header.subview.StackHeaderSubview
+
+@ReactModule(name = StackHeaderConfigViewManager.REACT_CLASS)
+open class StackHeaderConfigViewManager :
+    ViewGroupManager<StackHeaderConfig>(),
+    RNSStackHeaderConfigAndroidManagerInterface<StackHeaderConfig> {
+    private val delegate: ViewManagerDelegate<StackHeaderConfig>
+
+    init {
+        delegate = RNSStackHeaderConfigAndroidManagerDelegate<StackHeaderConfig, StackHeaderConfigViewManager>(this)
+    }
+
+    override fun getName() = REACT_CLASS
+
+    override fun createViewInstance(reactContext: ThemedReactContext) = StackHeaderConfig(reactContext)
+
+    override fun getDelegate(): ViewManagerDelegate<StackHeaderConfig> = delegate
+
+    /**
+     * Subviews need to be positioned by native layout from Toolbar and CollapsingToolbarLayout.
+     * Even with this option enabled, we receive dimensions calculated by Yoga via onMeasure.
+     */
+    override fun needsCustomLayoutForChildren() = true
+
+    override fun addView(
+        parent: StackHeaderConfig,
+        child: View,
+        index: Int,
+    ) {
+        require(child is StackHeaderSubview) {
+            "[RNScreens] StackHeaderConfig can only have children of type StackHeaderSubview. Received $child instead."
+        }
+        parent.addConfigSubview(child)
+    }
+
+    override fun removeView(
+        parent: StackHeaderConfig,
+        view: View,
+    ) {
+        require(view is StackHeaderSubview) {
+            "[RNScreens] StackHeaderConfig can only have children of type StackHeaderSubview. Attempted to remove $view instead."
+        }
+        parent.removeConfigSubview(view)
+    }
+
+    override fun removeViewAt(
+        parent: StackHeaderConfig,
+        index: Int,
+    ) {
+        parent.removeConfigSubviewAt(index)
+    }
+
+    override fun removeAllViews(parent: StackHeaderConfig) {
+        parent.removeAllConfigSubviews()
+    }
+
+    override fun getChildCount(parent: StackHeaderConfig): Int = parent.configSubviewsCount
+
+    override fun getChildAt(
+        parent: StackHeaderConfig,
+        index: Int,
+    ): View? = parent.getConfigSubviewAt(index)
+
+    override fun updateState(
+        view: StackHeaderConfig,
+        props: ReactStylesDiffMap?,
+        stateWrapper: StateWrapper?,
+    ): Any? {
+        view.stateWrapper = stateWrapper
+        return super.updateState(view, props, stateWrapper)
+    }
+
+    override fun onAfterUpdateTransaction(view: StackHeaderConfig) {
+        super.onAfterUpdateTransaction(view)
+        view.resolveBackButtonIconIfNeeded()
+        view.notifyConfigChanged()
+    }
+
+    override fun setType(
+        view: StackHeaderConfig,
+        value: String?,
+    ) {
+        view.type =
+            when (value) {
+                "small" -> StackHeaderType.SMALL
+                "medium" -> StackHeaderType.MEDIUM
+                "large" -> StackHeaderType.LARGE
+                else -> throw JSApplicationIllegalArgumentException("[RNScreens] Invalid StackHeaderConfig type: $value.")
+            }
+    }
+
+    override fun setTitle(
+        view: StackHeaderConfig,
+        value: String?,
+    ) {
+        view.title = value ?: ""
+    }
+
+    override fun setHidden(
+        view: StackHeaderConfig,
+        value: Boolean,
+    ) {
+        view.hidden = value
+    }
+
+    override fun setTransparent(
+        view: StackHeaderConfig,
+        value: Boolean,
+    ) {
+        view.transparent = value
+    }
+
+    override fun setBackButtonHidden(
+        view: StackHeaderConfig,
+        value: Boolean,
+    ) {
+        view.backButtonHidden = value
+    }
+
+    override fun setBackButtonTintColor(
+        view: StackHeaderConfig,
+        value: Int?,
+    ) {
+        view.backButtonTintColor = value
+    }
+
+    override fun setBackButtonDrawableIconResourceName(
+        view: StackHeaderConfig,
+        value: String?,
+    ) {
+        view.backButtonDrawableIconResourceName = value
+    }
+
+    override fun setBackButtonImageIconResource(
+        view: StackHeaderConfig,
+        value: ReadableMap?,
+    ) {
+        view.backButtonImageIconUri = value?.getString("uri")
+    }
+
+    companion object {
+        const val REACT_CLASS = "RNSStackHeaderConfigAndroid"
+    }
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/config/StackHeaderType.kt

@@ -0,0 +1,7 @@
+package com.swmansion.rnscreens.gamma.stack.header.config
+
+enum class StackHeaderType {
+    SMALL,
+    MEDIUM,
+    LARGE,
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/subview/OnStackHeaderSubviewChangeListener.kt

@@ -0,0 +1,5 @@
+package com.swmansion.rnscreens.gamma.stack.header.subview
+
+internal fun interface OnStackHeaderSubviewChangeListener {
+    fun onStackHeaderSubviewChange()
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/subview/StackHeaderSubview.kt

@@ -0,0 +1,91 @@
+package com.swmansion.rnscreens.gamma.stack.header.subview
+
+import android.annotation.SuppressLint
+import com.facebook.react.bridge.ReactContext
+import com.facebook.react.views.view.ReactViewGroup
+import com.swmansion.rnscreens.ext.parentAsView
+import com.swmansion.rnscreens.gamma.common.ShadowStateProxy
+import java.lang.ref.WeakReference
+import kotlin.properties.Delegates
+
+@SuppressLint("ViewConstructor")
+class StackHeaderSubview(
+    val reactContext: ReactContext,
+) : ReactViewGroup(reactContext),
+    StackHeaderSubviewProviding {
+    override var type: StackHeaderSubviewType = StackHeaderSubviewType.CENTER
+        internal set
+
+    override var collapseMode: StackHeaderSubviewCollapseMode by Delegates.observable(
+        StackHeaderSubviewCollapseMode.OFF,
+    ) { _, oldValue, newValue ->
+        if (oldValue != newValue) {
+            onStackHeaderSubviewChangeListener?.get()?.onStackHeaderSubviewChange()
+        }
+    }
+        internal set
+
+    override val view = this
+
+    private val shadowStateProxy = ShadowStateProxy(includesFrameSize = false)
+
+    internal var stateWrapper by shadowStateProxy::stateWrapper
+
+    override fun updateContentOriginOffset(
+        x: Int,
+        y: Int,
+    ) {
+        shadowStateProxy.updateStateIfNeeded(contentOffsetX = x, contentOffsetY = y)
+    }
+
+    internal var onStackHeaderSubviewChangeListener: WeakReference<OnStackHeaderSubviewChangeListener>? = null
+
+    private var yogaWidth: Int = 0
+    private var yogaHeight: Int = 0
+
+    // Rely on Yoga layout instead of native Toolbar layout which stretches subview to match parent.
+    override fun onMeasure(
+        widthMeasureSpec: Int,
+        heightMeasureSpec: Int,
+    ) {
+        var invalidated = false
+
+        // SurfaceMountingManager always delivers Yoga dimensions as EXACTLY specs.
+        // Cache them so we can report the correct size when the Toolbar remeasures us.
+        if (MeasureSpec.getMode(widthMeasureSpec) == MeasureSpec.EXACTLY) {
+            val newWidth = MeasureSpec.getSize(widthMeasureSpec)
+            if (newWidth != yogaWidth) {
+                yogaWidth = newWidth
+                invalidated = true
+            }
+        }
+
+        if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.EXACTLY) {
+            val newHeight = MeasureSpec.getSize(heightMeasureSpec)
+            if (newHeight != yogaHeight) {
+                yogaHeight = newHeight
+                invalidated = true
+            }
+        }
+
+        if (yogaWidth > 0 && yogaHeight > 0) {
+            setMeasuredDimension(yogaWidth, yogaHeight)
+            if (invalidated && !isInLayout) {
+                requestLayout()
+            }
+        } else {
+            super.onMeasure(widthMeasureSpec, heightMeasureSpec)
+        }
+    }
+
+    override fun requestLayout() {
+        // This super is called to avoid a warning but ReactViewGroup.requestLayout is a no-op.
+        super.requestLayout()
+
+        // Invalidate layout flags.
+        forceLayout()
+
+        // Rely on parent to request the layout.
+        parentAsView()?.requestLayout()
+    }
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/subview/StackHeaderSubviewCollapseMode.kt

@@ -0,0 +1,20 @@
+package com.swmansion.rnscreens.gamma.stack.header.subview
+
+import com.google.android.material.appbar.CollapsingToolbarLayout
+
+// Currently, PIN collapse mode is unsupported for background
+// header subviews. To enable flex layouts within the background
+// we use absolute fill, which effectively makes PIN mode equivalent
+// to OFF.
+// More details: https://github.com/software-mansion/react-native-screens/pull/3796.
+enum class StackHeaderSubviewCollapseMode {
+    OFF,
+    PARALLAX,
+    ;
+
+    internal fun toNativeCollapseMode(): Int =
+        when (this) {
+            OFF -> CollapsingToolbarLayout.LayoutParams.COLLAPSE_MODE_OFF
+            PARALLAX -> CollapsingToolbarLayout.LayoutParams.COLLAPSE_MODE_PARALLAX
+        }
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/subview/StackHeaderSubviewProviding.kt

@@ -0,0 +1,14 @@
+package com.swmansion.rnscreens.gamma.stack.header.subview
+
+import android.view.View
+
+interface StackHeaderSubviewProviding {
+    val type: StackHeaderSubviewType
+    val collapseMode: StackHeaderSubviewCollapseMode
+    val view: View
+
+    fun updateContentOriginOffset(
+        x: Int,
+        y: Int,
+    )
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/subview/StackHeaderSubviewType.kt

@@ -0,0 +1,8 @@
+package com.swmansion.rnscreens.gamma.stack.header.subview
+
+enum class StackHeaderSubviewType {
+    BACKGROUND,
+    LEADING,
+    CENTER,
+    TRAILING,
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/header/subview/StackHeaderSubviewViewManager.kt

@@ -0,0 +1,67 @@
+package com.swmansion.rnscreens.gamma.stack.header.subview
+
+import com.facebook.react.bridge.JSApplicationIllegalArgumentException
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.ReactStylesDiffMap
+import com.facebook.react.uimanager.StateWrapper
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.viewmanagers.RNSStackHeaderSubviewAndroidManagerDelegate
+import com.facebook.react.viewmanagers.RNSStackHeaderSubviewAndroidManagerInterface
+
+@ReactModule(name = StackHeaderSubviewViewManager.REACT_CLASS)
+open class StackHeaderSubviewViewManager :
+    ViewGroupManager<StackHeaderSubview>(),
+    RNSStackHeaderSubviewAndroidManagerInterface<StackHeaderSubview> {
+    private val delegate: ViewManagerDelegate<StackHeaderSubview>
+
+    init {
+        delegate = RNSStackHeaderSubviewAndroidManagerDelegate<StackHeaderSubview, StackHeaderSubviewViewManager>(this)
+    }
+
+    override fun getName() = REACT_CLASS
+
+    override fun createViewInstance(reactContext: ThemedReactContext) = StackHeaderSubview(reactContext)
+
+    override fun getDelegate(): ViewManagerDelegate<StackHeaderSubview> = delegate
+
+    override fun setType(
+        view: StackHeaderSubview,
+        value: String?,
+    ) {
+        view.type =
+            when (value) {
+                "leading" -> StackHeaderSubviewType.LEADING
+                "center" -> StackHeaderSubviewType.CENTER
+                "trailing" -> StackHeaderSubviewType.TRAILING
+                "background" -> StackHeaderSubviewType.BACKGROUND
+                else -> throw JSApplicationIllegalArgumentException("[RNScreens] Invalid StackHeaderSubview type: $value")
+            }
+    }
+
+    override fun setCollapseMode(
+        view: StackHeaderSubview,
+        value: String?,
+    ) {
+        view.collapseMode =
+            when (value) {
+                "off" -> StackHeaderSubviewCollapseMode.OFF
+                "parallax" -> StackHeaderSubviewCollapseMode.PARALLAX
+                else -> throw JSApplicationIllegalArgumentException("[RNScreens] Invalid StackHeaderSubview collapseMode: $value")
+            }
+    }
+
+    override fun updateState(
+        view: StackHeaderSubview,
+        props: ReactStylesDiffMap?,
+        stateWrapper: StateWrapper?,
+    ): Any? {
+        view.stateWrapper = stateWrapper
+        return super.updateState(view, props, stateWrapper)
+    }
+
+    companion object {
+        const val REACT_CLASS = "RNSStackHeaderSubviewAndroid"
+    }
+}

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/host/StackContainer.kt

@@ -3,7 +3,7 @@ package com.swmansion.rnscreens.gamma.stack.host
 import android.annotation.SuppressLint
 import android.content.Context
 import android.util.Log
-import androidx.coordinatorlayout.widget.CoordinatorLayout
+import android.widget.FrameLayout
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.FragmentManager
 import com.swmansion.rnscreens.ext.isMeasured
@@ -18,7 +18,7 @@ import java.lang.ref.WeakReference
 internal class StackContainer(
     context: Context,
     private val delegate: WeakReference<StackContainerDelegate>,
-) : CoordinatorLayout(context),
+) : FrameLayout(context),
     FragmentManager.OnBackStackChangedListener {
     private var fragmentManager: FragmentManager? = null
 
@@ -156,7 +156,7 @@ internal class StackContainer(
         }
 
         pendingPushOperations.forEach { operation ->
-            val newFragment = createFragmentForScreen(operation.screen)
+            val newFragment = createFragmentForScreen(operation.screen, canNavigateBack = stackModel.isNotEmpty())
 
             fragmentOps.add(
                 AddAndSetAsPrimaryOp(
@@ -193,8 +193,11 @@ internal class StackContainer(
         }
     }
 
-    private fun createFragmentForScreen(screen: StackScreen): StackScreenFragment =
-        StackScreenFragment(screen).also {
+    private fun createFragmentForScreen(
+        screen: StackScreen,
+        canNavigateBack: Boolean,
+    ): StackScreenFragment =
+        StackScreenFragment(screen, canNavigateBack).also {
             Log.d(TAG, "Created Fragment $it for screen ${screen.screenKey}")
         }
 
@@ -251,6 +254,15 @@ internal class StackContainer(
         }
     }
 
+    internal fun forceSubtreeMeasureAndLayoutPass() {
+        measure(
+            MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
+            MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY),
+        )
+
+        layout(left, top, right, bottom)
+    }
+
     companion object {
         const val TAG = "StackContainer"
     }

package/android/src/main/java/com/swmansion/rnscreens/gamma/stack/host/StackHost.kt

@@ -24,6 +24,7 @@ class StackHost(
     internal val renderedScreens: ArrayList<StackScreen> = arrayListOf()
     private val container = StackContainer(reactContext, WeakReference(this))
     private val containerUpdateCoordinator = StackContainerUpdateCoordinator()
+    private var isLayoutEnqueued = false
 
     init {
         addView(container)
@@ -113,6 +114,32 @@ class StackHost(
         container.layout(l, t, r, b)
     }
 
+    // ReactViewGroup overrides requestLayout to a no-op therefore the request might not be
+    // propagated to the root view. That's why we need to manually force measure and layout pass.
+    override fun requestLayout() {
+        super.requestLayout()
+        refreshLayout()
+    }
+
+    private fun refreshLayout() {
+        if (!isLayoutEnqueued) {
+            isLayoutEnqueued = true
+            post {
+                isLayoutEnqueued = false
+                forceSubtreeMeasureAndLayoutPass()
+            }
+        }
+    }
+
+    private fun forceSubtreeMeasureAndLayoutPass() {
+        measure(
+            MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
+            MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY),
+        )
+
+        layout(left, top, right, bottom)
+    }
+
     override fun layoutContainerNow() {
         if (measuredWidth != container.measuredWidth || measuredHeight != container.measuredHeight) {
             container.measure(