react-native-screens 5.0.0-alpha.1 → 5.0.0-alpha.2

package/android/src/main/java/com/swmansion/rnscreens/stack/header/StackHeaderCoordinatorLayout.kt

@@ -12,16 +12,23 @@ import com.facebook.react.bridge.ReactContext
 import com.google.android.material.R
 import com.google.android.material.appbar.AppBarLayout
 import com.google.android.material.appbar.MaterialToolbar
+import com.swmansion.rnscreens.stack.header.appbar.StackHeaderAppBarLayout
+import com.swmansion.rnscreens.stack.header.appbar.StackHeaderScrollingViewBehavior
 import com.swmansion.rnscreens.stack.header.config.OnHeaderConfigurationAttachListener
 import com.swmansion.rnscreens.stack.header.config.StackHeaderConfigurationObserver
 import com.swmansion.rnscreens.stack.header.config.StackHeaderConfigurationProviding
 import com.swmansion.rnscreens.stack.header.config.StackHeaderDelegate
 import com.swmansion.rnscreens.stack.header.config.StackHeaderInvalidationFlags
-import com.swmansion.rnscreens.stack.header.subview.StackHeaderSubviewProviding
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuElementUpdate
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuGroupMetadata
+import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuApplicator
+import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuSelectionController
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarMenuElementUpdate
 import com.swmansion.rnscreens.stack.screen.StackScreen
 
+/**
+ * Root CoordinatorLayout for a screen's header: hosts the app bar and the
+ * content wrapper, wires header-config attach/observe, routes config
+ * invalidations to the applicators, and owns header lifecycle/teardown.
+ */
 @SuppressLint("ViewConstructor")
 internal class StackHeaderCoordinatorLayout(
     context: Context,
@@ -80,15 +87,15 @@ internal class StackHeaderCoordinatorLayout(
                 // then emit a single coalesced event per affected group.
                 val affectedGroups = LinkedHashSet<String>()
                 for (update in updates) {
-                    applicator.updateToolbarMenuElement(
+                    StackHeaderToolbarMenuApplicator.updateToolbarMenuElement(
                         toolbar,
-                        toolbarMenuForwardIdMap,
+                        selectionController.forwardIdMap,
                         update.id,
                         update.options,
                     )
                     val checked = update.options.checked
                     if (checked != null) {
-                        applyGroupItemStateChange(toolbar, update.id, checked)?.let(affectedGroups::add)
+                        selectionController.applyGroupItemStateChange(toolbar, update.id, checked)?.let(affectedGroups::add)
                     }
                 }
                 affectedGroups.forEach { groupId -> emitGroupSelection(toolbar, groupId) }
@@ -123,49 +130,7 @@ internal class StackHeaderCoordinatorLayout(
         val delegate = currentDelegate ?: return
         val provider = currentProvider ?: return
         val appBar = appBarLayout ?: return
-
-        // When config is transparent, the StackScreen is static so we need to offset the header
-        // config by the offset of the AppBarLayout (which is 0 or is negative). When config is
-        // opaque, the Screen always moves with the config, that's why we need to offset the
-        // header config by the negative value of AppBarLayout's height.
-        val configOffset = if (provider.transparent) appBar.top else appBar.top - appBar.bottom
-
-        delegate.onHeaderFrameChanged(
-            appBar.width,
-            appBar.height,
-            configOffset,
-        )
-
-        updateSubviewOffsets(appBar, provider)
-    }
-
-    private fun updateSubviewOffsets(
-        appBar: StackHeaderAppBarLayout,
-        config: StackHeaderConfigurationProviding,
-    ) {
-        config.leadingSubview?.let { updateSubviewOffset(it, appBar) }
-        config.centerSubview?.let { updateSubviewOffset(it, appBar) }
-        config.trailingSubview?.let { updateSubviewOffset(it, appBar) }
-        config.backgroundSubview?.let { updateSubviewOffset(it, appBar) }
-    }
-
-    private fun updateSubviewOffset(
-        subview: StackHeaderSubviewProviding,
-        appBar: StackHeaderAppBarLayout,
-    ) {
-        val view = subview.view
-        if (view.width == 0 && view.height == 0) return
-
-        val appBarPos = IntArray(2)
-        val subviewPos = IntArray(2)
-        appBar.getLocationInWindow(appBarPos)
-        view.getLocationInWindow(subviewPos)
-
-        currentDelegate?.onSubviewOriginChanged(
-            subview.type,
-            x = subviewPos[0] - appBarPos[0],
-            y = subviewPos[1] - appBarPos[1],
-        )
+        StackHeaderFrameSynchronizer.sync(appBar, provider, delegate)
     }
 
     // endregion
@@ -180,10 +145,9 @@ internal class StackHeaderCoordinatorLayout(
 
     private val applicator = StackHeaderApplicator(wrappedContext)
 
-    private var appBarLayout: StackHeaderAppBarLayout? = null
+    private val selectionController = StackHeaderToolbarMenuSelectionController()
 
-    private var toolbarMenuForwardIdMap = emptyMap<String, Int>()
-    private var toolbarMenuGroupMetadata = StackHeaderToolbarMenuGroupMetadata.EMPTY
+    private var appBarLayout: StackHeaderAppBarLayout? = null
 
     private val onNavigationIconClick: () -> Unit = {
         val activity =
@@ -230,26 +194,36 @@ internal class StackHeaderCoordinatorLayout(
                 provider.clearInvalidationFlags(StackHeaderInvalidationFlags.SCROLL_FLAGS)
             }
 
+            if (needsRebuild || provider.invalidationFlags.containsAny(StackHeaderInvalidationFlags.LIFT_ON_SCROLL)) {
+                // Lift-on-scroll is disabled in transparent mode: there is no content
+                // scrolling behavior installed and the app bar overlays the content.
+                applicator.applyLiftOnScroll(
+                    appBar,
+                    enabled = provider.liftOnScroll && !provider.transparent,
+                    targetScrollView = stackScreen.findContentScrollView(),
+                )
+                provider.clearInvalidationFlags(StackHeaderInvalidationFlags.LIFT_ON_SCROLL)
+            }
+
             if (provider.invalidationFlags.containsAny(StackHeaderInvalidationFlags.TOOLBAR_MENU)) {
                 val (forwardIdMap, reverseIdMap) =
-                    applicator.generateToolbarMenuItemMappings(
+                    StackHeaderToolbarMenuApplicator.generateToolbarMenuItemMappings(
                         provider.toolbarMenu,
                     )
                 val forwardGroupIdMap =
-                    applicator.generateToolbarMenuGroupMappings(
+                    StackHeaderToolbarMenuApplicator.generateToolbarMenuGroupMappings(
                         provider.toolbarMenu,
                     )
                 val groupMetadata =
-                    applicator.computeGroupMetadata(
+                    StackHeaderToolbarMenuApplicator.computeGroupMetadata(
                         provider.toolbarMenu,
                     )
 
-                applicator.validateRadioInitialSelection(provider.toolbarMenu)
+                StackHeaderToolbarMenuApplicator.validateRadioInitialSelection(provider.toolbarMenu)
 
-                toolbarMenuForwardIdMap = forwardIdMap
-                toolbarMenuGroupMetadata = groupMetadata
+                selectionController.setMenuMaps(forwardIdMap, groupMetadata)
 
-                applicator.rebuildToolbarMenu(
+                StackHeaderToolbarMenuApplicator.rebuildToolbarMenu(
                     appBar.toolbar,
                     provider.toolbarMenu,
                     forwardIdMap,
@@ -258,7 +232,7 @@ internal class StackHeaderCoordinatorLayout(
                     groupDividerEnabled = provider.toolbarMenuGroupDividerEnabled,
                     onItemClicked = { id, menuItem ->
                         if (menuItem.isCheckable) {
-                            applyGroupItemStateChange(appBar.toolbar, id)?.let { groupId ->
+                            selectionController.applyGroupItemStateChange(appBar.toolbar, id)?.let { groupId ->
                                 emitGroupSelection(appBar.toolbar, groupId)
                             }
                         } else {
@@ -278,63 +252,13 @@ internal class StackHeaderCoordinatorLayout(
 
     // region Group selection
 
-    /**
-     * Mutates the checked state of [itemId] within its group and returns the id of the group
-     * whose selection changed, or `null` when nothing changed (the item is not in a group, an
-     * invalid attempt to uncheck a single-selection item, or the item was already in the
-     * target state). Does not emit — callers decide when to emit so that batched updates can
-     * coalesce into one event per group.
-     */
-    private fun applyGroupItemStateChange(
-        toolbar: MaterialToolbar,
-        itemId: String,
-        explicitCheckedValue: Boolean? = null,
-    ): String? {
-        val groupId = toolbarMenuGroupMetadata.itemGroupMap[itemId] ?: return null
-        val singleSelection = toolbarMenuGroupMetadata.groupSingleSelection[groupId] ?: return null
-        val intId = toolbarMenuForwardIdMap[itemId] ?: return null
-        val menuItem = toolbar.menu.findItem(intId) ?: return null
-
-        if (singleSelection && explicitCheckedValue == false) {
-            Log.w(
-                TAG,
-                "[RNScreens] Cannot uncheck item '$itemId' in single-selection group '$groupId'. " +
-                    "Check a different item instead.",
-            )
-            return null
-        }
-
-        val newChecked =
-            if (singleSelection) {
-                true
-            } else {
-                explicitCheckedValue ?: !menuItem.isChecked
-            }
-        if (menuItem.isChecked == newChecked) return null
-        menuItem.isChecked = newChecked
-
-        return groupId
-    }
-
     private fun emitGroupSelection(
         toolbar: MaterialToolbar,
         groupId: String,
     ) {
-        currentDelegate?.onGroupSelectionChanged(groupId, collectSelectedIds(toolbar, groupId))
+        currentDelegate?.onGroupSelectionChanged(groupId, selectionController.collectSelectedIds(toolbar, groupId))
     }
 
-    private fun collectSelectedIds(
-        toolbar: MaterialToolbar,
-        groupId: String,
-    ): List<String> =
-        toolbarMenuGroupMetadata
-            .groupMemberItems[groupId]
-            .orEmpty()
-            .filter { memberId ->
-                val intId = toolbarMenuForwardIdMap[memberId] ?: return@filter false
-                toolbar.menu.findItem(intId)?.isChecked == true
-            }
-
     // endregion
 
     // region Header lifecycle
@@ -345,8 +269,7 @@ internal class StackHeaderCoordinatorLayout(
             removeView(it)
         }
         appBarLayout = null
-        toolbarMenuForwardIdMap = emptyMap()
-        toolbarMenuGroupMetadata = StackHeaderToolbarMenuGroupMetadata.EMPTY
+        selectionController.clear()
     }
 
     private fun removeHeader() {

package/android/src/main/java/com/swmansion/rnscreens/stack/header/StackHeaderFrameSynchronizer.kt

@@ -0,0 +1,63 @@
+package com.swmansion.rnscreens.stack.header
+
+import com.swmansion.rnscreens.stack.header.appbar.StackHeaderAppBarLayout
+import com.swmansion.rnscreens.stack.header.config.StackHeaderConfigurationProviding
+import com.swmansion.rnscreens.stack.header.config.StackHeaderDelegate
+import com.swmansion.rnscreens.stack.header.subview.StackHeaderSubviewProviding
+
+/**
+ * Reports the header's frame and subview origins to the delegate as the app bar
+ * lays out or scrolls.
+ */
+internal object StackHeaderFrameSynchronizer {
+    internal fun sync(
+        appBar: StackHeaderAppBarLayout,
+        provider: StackHeaderConfigurationProviding,
+        delegate: StackHeaderDelegate,
+    ) {
+        // When config is transparent, the StackScreen is static so we need to offset the header
+        // config by the offset of the AppBarLayout (which is 0 or is negative). When config is
+        // opaque, the Screen always moves with the config, that's why we need to offset the
+        // header config by the negative value of AppBarLayout's height.
+        val configOffset = if (provider.transparent) appBar.top else appBar.top - appBar.bottom
+
+        delegate.onHeaderFrameChanged(
+            appBar.width,
+            appBar.height,
+            configOffset,
+        )
+
+        updateSubviewOffsets(appBar, provider, delegate)
+    }
+
+    private fun updateSubviewOffsets(
+        appBar: StackHeaderAppBarLayout,
+        config: StackHeaderConfigurationProviding,
+        delegate: StackHeaderDelegate,
+    ) {
+        config.leadingSubview?.let { updateSubviewOffset(it, appBar, delegate) }
+        config.centerSubview?.let { updateSubviewOffset(it, appBar, delegate) }
+        config.trailingSubview?.let { updateSubviewOffset(it, appBar, delegate) }
+        config.backgroundSubview?.let { updateSubviewOffset(it, appBar, delegate) }
+    }
+
+    private fun updateSubviewOffset(
+        subview: StackHeaderSubviewProviding,
+        appBar: StackHeaderAppBarLayout,
+        delegate: StackHeaderDelegate,
+    ) {
+        val view = subview.view
+        if (view.width == 0 && view.height == 0) return
+
+        val appBarPos = IntArray(2)
+        val subviewPos = IntArray(2)
+        appBar.getLocationInWindow(appBarPos)
+        view.getLocationInWindow(subviewPos)
+
+        delegate.onSubviewOriginChanged(
+            subview.type,
+            x = subviewPos[0] - appBarPos[0],
+            y = subviewPos[1] - appBarPos[1],
+        )
+    }
+}

package/android/src/main/java/com/swmansion/rnscreens/stack/header/{StackHeaderAppBarLayout.kt → appbar/StackHeaderAppBarLayout.kt}

@@ -1,4 +1,4 @@
-package com.swmansion.rnscreens.stack.header
+package com.swmansion.rnscreens.stack.header.appbar
 
 import android.annotation.SuppressLint
 import android.content.Context
@@ -24,11 +24,6 @@ internal sealed class StackHeaderAppBarLayout(
                 behavior = StackHeaderAppBarLayoutBehavior()
             }
 
-        // TODO: this should be exposed in the future via prop. Also, it might not work correctly
-        //       until we set liftOnScrollView manually. Also, we should disable it in transparent
-        //       mode or set elevation higher.
-        isLiftOnScroll = true
-
         // TODO: this won't work with nested header but there were some problems with lift on scroll
         //       without it when I was researching this.
         fitsSystemWindows = true

package/android/src/main/java/com/swmansion/rnscreens/stack/header/{StackHeaderAppBarLayoutBehavior.kt → appbar/StackHeaderAppBarLayoutBehavior.kt}

@@ -1,4 +1,4 @@
-package com.swmansion.rnscreens.stack.header
+package com.swmansion.rnscreens.stack.header.appbar
 
 import android.view.View
 import androidx.coordinatorlayout.widget.CoordinatorLayout

package/android/src/main/java/com/swmansion/rnscreens/stack/header/{StackHeaderScrollingViewBehavior.kt → appbar/StackHeaderScrollingViewBehavior.kt}

@@ -1,4 +1,4 @@
-package com.swmansion.rnscreens.stack.header
+package com.swmansion.rnscreens.stack.header.appbar
 
 import android.view.View
 import androidx.coordinatorlayout.widget.CoordinatorLayout

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

@@ -17,12 +17,12 @@ import com.swmansion.rnscreens.helpers.resolveImage
 import com.swmansion.rnscreens.stack.header.subview.OnStackHeaderSubviewChangeListener
 import com.swmansion.rnscreens.stack.header.subview.StackHeaderSubview
 import com.swmansion.rnscreens.stack.header.subview.StackHeaderSubviewType
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarFieldUpdate
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuConfig
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuElementRawUpdate
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuIconResolver
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuItemIconSource
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuUpdateQueue
+import com.swmansion.rnscreens.stack.header.toolbar.model.StackHeaderToolbarMenuConfig
+import com.swmansion.rnscreens.stack.header.toolbar.model.StackHeaderToolbarMenuItemIconSource
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarFieldUpdate
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarMenuElementRawUpdate
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarMenuIconResolver
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarMenuUpdateQueue
 import java.lang.ref.WeakReference
 import kotlin.properties.Delegates
 
@@ -141,6 +141,11 @@ internal class StackHeaderConfig(
     }
         internal set
 
+    override var liftOnScroll: Boolean by Delegates.observable(true) { _, old, new ->
+        if (old != new) invalidate(StackHeaderInvalidationFlags.LIFT_ON_SCROLL)
+    }
+        internal set
+
     override var toolbarMenu: StackHeaderToolbarMenuConfig
         by Delegates.observable(StackHeaderToolbarMenuConfig(emptyList(), emptyList())) { _, old, new ->
             if (old != new) invalidate(StackHeaderInvalidationFlags.TOOLBAR_MENU)
@@ -157,6 +162,23 @@ internal class StackHeaderConfig(
 
     // endregion
 
+    // region Content scroll view
+
+    /**
+     * Called by the owning [com.swmansion.rnscreens.stack.screen.StackScreen]
+     * when its content scroll view changes (e.g. a `ScrollViewMarker` registered
+     * one). Re-triggers lift-on-scroll so the coordinator can resolve and apply
+     * the up-to-date `liftOnScrollTargetView`.
+     */
+    internal fun onContentScrollViewChanged() {
+        invalidate(StackHeaderInvalidationFlags.LIFT_ON_SCROLL)
+        if (!isInsideMountTransaction) {
+            flushUpdates()
+        }
+    }
+
+    // endregion
+
     // region Back button icon resolution
 
     // Staging fields for back button icon resolution.

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

@@ -15,8 +15,8 @@ import com.facebook.react.uimanager.ViewManagerDelegate
 import com.facebook.react.viewmanagers.RNSStackHeaderConfigAndroidManagerDelegate
 import com.facebook.react.viewmanagers.RNSStackHeaderConfigAndroidManagerInterface
 import com.swmansion.rnscreens.stack.header.subview.StackHeaderSubview
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuElementRawUpdate
 import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuMapper
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarMenuElementRawUpdate
 
 @ReactModule(name = StackHeaderConfigViewManager.REACT_CLASS)
 internal open class StackHeaderConfigViewManager :
@@ -218,6 +218,13 @@ internal open class StackHeaderConfigViewManager :
         view.scrollFlagSnap = value
     }
 
+    override fun setLiftOnScroll(
+        view: StackHeaderConfig,
+        value: Boolean,
+    ) {
+        view.liftOnScroll = value
+    }
+
     override fun setToolbarMenuGroupDividerEnabled(
         view: StackHeaderConfig,
         value: Boolean,

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

@@ -1,6 +1,6 @@
 package com.swmansion.rnscreens.stack.header.config
 
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuElementUpdate
+import com.swmansion.rnscreens.stack.header.toolbar.update.StackHeaderToolbarMenuElementUpdate
 
 internal interface StackHeaderConfigurationObserver {
     fun onConfigChanged(config: StackHeaderConfigurationProviding)

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

@@ -2,7 +2,7 @@ package com.swmansion.rnscreens.stack.header.config
 
 import android.graphics.drawable.Drawable
 import com.swmansion.rnscreens.stack.header.subview.StackHeaderSubviewProviding
-import com.swmansion.rnscreens.stack.header.toolbar.StackHeaderToolbarMenuConfig
+import com.swmansion.rnscreens.stack.header.toolbar.model.StackHeaderToolbarMenuConfig
 
 internal interface StackHeaderConfigurationProviding {
     val type: StackHeaderType
@@ -19,6 +19,7 @@ internal interface StackHeaderConfigurationProviding {
     val scrollFlagEnterAlwaysCollapsed: Boolean
     val scrollFlagExitUntilCollapsed: Boolean
     val scrollFlagSnap: Boolean
+    val liftOnScroll: Boolean
     val leadingSubview: StackHeaderSubviewProviding?
     val centerSubview: StackHeaderSubviewProviding?
     val trailingSubview: StackHeaderSubviewProviding?

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

@@ -12,9 +12,10 @@ internal value class StackHeaderInvalidationFlags(
         val BACK_BUTTON = StackHeaderInvalidationFlags(1 shl 3)
         val SCROLL_FLAGS = StackHeaderInvalidationFlags(1 shl 4)
         val TOOLBAR_MENU = StackHeaderInvalidationFlags(1 shl 5)
+        val LIFT_ON_SCROLL = StackHeaderInvalidationFlags(1 shl 6)
 
         val APPEARANCE = TITLE or BACK_BUTTON
-        val ALL = STRUCTURE or SUBVIEWS or APPEARANCE or SCROLL_FLAGS or TOOLBAR_MENU
+        val ALL = STRUCTURE or SUBVIEWS or APPEARANCE or SCROLL_FLAGS or TOOLBAR_MENU or LIFT_ON_SCROLL
     }
 
     infix fun or(other: StackHeaderInvalidationFlags) = StackHeaderInvalidationFlags(raw or other.raw)