fix: clicking on Pressable located in screen header

android/src/fabric/java/com/swmansion/rnscreens/FabricEnabledHeaderConfigViewGroup.kt

@@ -14,43 +14,50 @@ abstract class FabricEnabledHeaderConfigViewGroup(
 ) : ViewGroup(context) {
     private var mStateWrapper: StateWrapper? = null
 
-    private var lastPaddingStart = 0f
-    private var lastPaddingEnd = 0f
+    private var lastWidth = 0f
+    private var lastHeight = 0f
 
     fun setStateWrapper(wrapper: StateWrapper?) {
         mStateWrapper = wrapper
     }
-
-    fun updatePaddingsFabric(
+    
+    fun updatePaddings(
         paddingStart: Int,
-        paddingEnd: Int,
+        paddingEnd: Int
     ) {
-        updateState(paddingStart, paddingEnd)
+        // do nothing
+    }
+
+    fun updateHeaderConfigState(
+        width: Int,
+        height: Int,
+    ) {
+        updateState(width, height)
     }
 
     @UiThread
     fun updateState(
-        paddingStart: Int,
-        paddingEnd: Int,
+        width: Int,
+        height: Int,
     ) {
-        val paddingStartDip: Float = PixelUtil.toDIPFromPixel(paddingStart.toFloat())
-        val paddingEndDip: Float = PixelUtil.toDIPFromPixel(paddingEnd.toFloat())
+        val realWidth: Float = PixelUtil.toDIPFromPixel(width.toFloat())
+        val realHeight: Float = PixelUtil.toDIPFromPixel(height.toFloat())
 
         // Check incoming state values. If they're already the correct value, return early to prevent
         // infinite UpdateState/SetState loop.
-        if (abs(lastPaddingStart - paddingStart) < DELTA &&
-            abs(lastPaddingEnd - paddingEnd) < DELTA
+        if (abs(lastWidth - realWidth) < DELTA &&
+            abs(lastHeight - realHeight) < DELTA
         ) {
             return
         }
 
-        lastPaddingStart = paddingStartDip
-        lastPaddingEnd = paddingEndDip
+        lastWidth = realWidth
+        lastHeight = realHeight
 
         val map: WritableMap =
             WritableNativeMap().apply {
-                putDouble("paddingStart", paddingStartDip.toDouble())
-                putDouble("paddingEnd", paddingEndDip.toDouble())
+                putDouble("frameWidth", realWidth.toDouble())
+                putDouble("frameHeight", realHeight.toDouble())
             }
         mStateWrapper?.updateState(map)
     }

android/src/fabric/java/com/swmansion/rnscreens/FabricEnabledHeaderSubviewGroup.kt

@@ -0,0 +1,49 @@
+package com.swmansion.rnscreens
+
+import android.content.Context
+import android.view.ViewGroup
+import androidx.annotation.UiThread
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.bridge.WritableNativeMap
+import com.facebook.react.uimanager.StateWrapper
+import com.facebook.react.uimanager.PixelUtil
+
+abstract class FabricEnabledHeaderSubviewGroup(context: Context?): ViewGroup(context) {
+    private var mStateWrapper: StateWrapper? = null
+
+    fun setStateWrapper(wrapper: StateWrapper?) {
+        mStateWrapper = wrapper
+    }
+
+    protected fun updateSubviewFrameState(
+        width: Int,
+        height: Int,
+        offsetX: Int,
+        offsetY: Int
+    ) {
+        updateState(width, height, offsetX, offsetY)
+    }
+
+    @UiThread
+    fun updateState(
+        width: Int,
+        height: Int,
+        offsetX: Int,
+        offsetY: Int
+    ) {
+        val realWidth: Float = PixelUtil.toDIPFromPixel(width.toFloat())
+        val realHeight: Float = PixelUtil.toDIPFromPixel(height.toFloat())
+        val offsetXDip: Float = PixelUtil.toDIPFromPixel(offsetX.toFloat())
+        val offsetYDip: Float = PixelUtil.toDIPFromPixel(offsetY.toFloat())
+
+        val map: WritableMap = WritableNativeMap().apply {
+            putDouble("frameWidth", realWidth.toDouble())
+            putDouble("frameHeight", realHeight.toDouble())
+            putDouble("contentOffsetX", offsetXDip.toDouble())
+            putDouble("contentOffsetY", offsetYDip.toDouble())
+        }
+
+        mStateWrapper?.updateState(map)
+    }
+
+}

android/src/main/java/com/swmansion/rnscreens/CustomToolbar.kt

@@ -68,8 +68,14 @@ open class CustomToolbar(
     ) {
         super.onLayout(changed, l, t, r, b)
 
-        // our children are already laid out
-        val contentInsetStart = if (navigationIcon != null) contentInsetStartWithNavigation else contentInsetStart
-        config.updatePaddingsFabric(contentInsetStart, contentInsetEnd)
+        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+            val width = r - l;
+            val height = b - t;
+            config.updateHeaderConfigState(width, height)
+        } else {
+            // our children are already laid out
+            val contentInsetStart = if (navigationIcon != null) contentInsetStartWithNavigation else contentInsetStart
+            config.updatePaddings(contentInsetStart, contentInsetEnd)
+        }
     }
 }

android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderSubview.kt

@@ -8,7 +8,7 @@ import com.facebook.react.views.view.ReactViewGroup
 @SuppressLint("ViewConstructor")
 class ScreenStackHeaderSubview(
     context: ReactContext?,
-) : ReactViewGroup(context) {
+) : FabricEnabledHeaderSubviewGroup(context) {
     private var reactWidth = 0
     private var reactHeight = 0
     var type = Type.RIGHT
@@ -37,11 +37,17 @@ class ScreenStackHeaderSubview(
 
     override fun onLayout(
         changed: Boolean,
-        left: Int,
-        top: Int,
-        right: Int,
-        bottom: Int,
-    ) = Unit
+        l: Int,
+        t: Int,
+        r: Int,
+        b: Int,
+    ) {
+       if (changed && BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+           val width = r - l;
+           val height = b - t;
+           updateSubviewFrameState(width, height, l, t)
+       }
+    }
 
     enum class Type {
         LEFT,

android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderSubviewManager.kt

@@ -2,6 +2,8 @@ package com.swmansion.rnscreens
 
 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
@@ -39,6 +41,17 @@ class ScreenStackHeaderSubviewManager :
             }
     }
 
+    override fun updateState(
+        view: ScreenStackHeaderSubview,
+        props: ReactStylesDiffMap?,
+        stateWrapper: StateWrapper?
+    ): Any? {
+        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+            view.setStateWrapper(stateWrapper)
+        }
+        return super.updateState(view, props, stateWrapper)
+    }
+
     protected override fun getDelegate(): ViewManagerDelegate<ScreenStackHeaderSubview> = delegate
 
     companion object {

android/src/paper/java/com/swmansion/rnscreens/FabricEnabledHeaderConfigViewGroup.kt

@@ -16,7 +16,14 @@ abstract class FabricEnabledHeaderConfigViewGroup(
 
     fun setStateWrapper(wrapper: StateWrapper?) = Unit
 
-    fun updatePaddingsFabric(
+    fun updateHeaderConfigState(
+        width: Int,
+        height: Int,
+    ) {
+        // do nothing
+    }
+
+    fun updatePaddings(
         paddingStart: Int,
         paddingEnd: Int,
     ) {

android/src/paper/java/com/swmansion/rnscreens/FabricEnabledHeaderSubviewGroup.kt

@@ -0,0 +1,21 @@
+package com.swmansion.rnscreens
+
+import android.content.Context
+import android.view.ViewGroup
+import com.facebook.react.uimanager.StateWrapper
+
+abstract class FabricEnabledHeaderSubviewGroup(context: Context?): ViewGroup(context) {
+
+    fun setStateWrapper(wrapper: StateWrapper?) = Unit
+
+    protected fun updateSubviewFrameState(
+        width: Int,
+        height: Int,
+        offsetX: Int,
+        offsetY: Int
+    ) {
+        // do nothing
+    }
+
+
+}

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderConfigComponentDescriptor.h

@@ -34,8 +34,9 @@ class RNSScreenStackHeaderConfigComponentDescriptor final
         shadowNode.getState());
     auto stateData = state->getData();
 
-    layoutableShadowNode.setPadding(
-        {stateData.getPaddingStart(), 0, stateData.getPaddingEnd(), 0});
+    if (stateData.frameSize.width != 0 && stateData.frameSize.height != 0) {
+        layoutableShadowNode.setSize(Size{stateData.frameSize.width, stateData.frameSize.height});
+    }
 
     ConcreteComponentDescriptor::adopt(shadowNode);
 #if !defined(ANDROID) && !defined(NDEBUG)

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderConfigShadowNode.cpp

@@ -5,6 +5,18 @@ namespace facebook::react {
 extern const char RNSScreenStackHeaderConfigComponentName[] =
     "RNSScreenStackHeaderConfig";
 
+void RNSScreenStackHeaderConfigShadowNode::layout(LayoutContext layoutContext) {
+    YogaLayoutableShadowNode::layout(layoutContext);
+    applyFrameCorrections();
+}
+
+void RNSScreenStackHeaderConfigShadowNode::applyFrameCorrections() {
+    ensureUnsealed();
+
+    const auto &stateData = getStateData();
+    layoutMetrics_.frame.origin.y = -stateData.frameSize.height;
+}
+
 #if !defined(ANDROID) && !defined(NDEBUG)
 void RNSScreenStackHeaderConfigShadowNode::setImageLoader(
     std::weak_ptr<void> imageLoader) {

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderConfigShadowNode.h

@@ -25,8 +25,12 @@ class JSI_EXPORT RNSScreenStackHeaderConfigShadowNode final
   using StateData = ConcreteViewShadowNode::ConcreteStateData;
 
 #pragma mark - ShadowNode overrides
+  void layout(LayoutContext layoutContext) override;
 
 #pragma mark - Custom interface
+
+  void applyFrameCorrections();
+
 #if !defined(ANDROID) && !defined(NDEBUG)
   void setImageLoader(std::weak_ptr<void> imageLoader);
 #endif // !ANDROID && !NDEBUG

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderConfigState.cpp

@@ -1,12 +1,14 @@
+
 #include "RNSScreenStackHeaderConfigState.h"
 
 namespace facebook {
 namespace react {
 
 #ifdef ANDROID
 folly::dynamic RNSScreenStackHeaderConfigState::getDynamic() const {
-  return folly::dynamic::object("paddingStart", paddingStart_)(
-      "paddingEnd_", paddingEnd_);
+  return folly::dynamic::object("frameWidth", frameSize.width)(
+      "frameHeight", frameSize.height)("contentOffsetX", contentOffset.x)(
+      "contentOffsetY", contentOffset.y);
 }
 #else // ANDROID
 #ifndef NDEBUG
@@ -22,13 +24,6 @@ std::weak_ptr<void> RNSScreenStackHeaderConfigState::getImageLoader()
 #endif // !NDEBUG
 #endif // ANDROID
 
-Float RNSScreenStackHeaderConfigState::getPaddingStart() const noexcept {
-  return paddingStart_;
-}
-
-Float RNSScreenStackHeaderConfigState::getPaddingEnd() const noexcept {
-  return paddingEnd_;
-}
 
 } // namespace react
 } // namespace facebook

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderConfigState.h

@@ -17,15 +17,16 @@ class JSI_EXPORT RNSScreenStackHeaderConfigState final {
 
   RNSScreenStackHeaderConfigState() = default;
 
-  RNSScreenStackHeaderConfigState(Float paddingStart, Float paddingEnd)
-      : paddingStart_{paddingStart}, paddingEnd_{paddingEnd} {}
+  RNSScreenStackHeaderConfigState(Size frameSize_)
+    : frameSize(frameSize_) {}
 
 #ifdef ANDROID
   RNSScreenStackHeaderConfigState(
       RNSScreenStackHeaderConfigState const &previousState,
       folly::dynamic data)
-      : paddingStart_{static_cast<Float>(data["paddingStart"].getDouble())},
-        paddingEnd_{static_cast<Float>(data["paddingEnd"].getDouble())} {}
+      : frameSize(Size{
+          (Float)data["frameWidth"].getDouble(),
+          (Float)data["frameHeight"].getDouble()}){}
 #endif
 
 #ifdef ANDROID
@@ -40,15 +41,12 @@ class JSI_EXPORT RNSScreenStackHeaderConfigState final {
 #endif // !NDEBUG
 #endif // ANDROID
 
-#pragma mark - Getters
-
-  [[nodiscard]] Float getPaddingStart() const noexcept;
+  const Size frameSize{};
+  Point contentOffset;
 
-  [[nodiscard]] Float getPaddingEnd() const noexcept;
+#pragma mark - Getters
 
  private:
-  Float paddingStart_{0.f};
-  Float paddingEnd_{0.f};
 #if !defined(ANDROID) && !defined(NDEBUG)
   std::weak_ptr<void> imageLoader_;
 #endif // !ANDROID && !NDEBUG

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderSubviewComponentDescriptor.h

@@ -20,6 +20,25 @@ class RNSScreenStackHeaderSubviewComponentDescriptor final
   using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
 
   void adopt(ShadowNode &shadowNode) const override {
+      react_native_assert(
+              dynamic_cast<RNSScreenStackHeaderSubviewShadowNode *>(&shadowNode));
+      auto &subviewShadowNode =
+              static_cast<RNSScreenStackHeaderSubviewShadowNode &>(shadowNode);
+
+      react_native_assert(
+              dynamic_cast<YogaLayoutableShadowNode *>(&subviewShadowNode));
+      auto &layoutableShadowNode =
+              dynamic_cast<YogaLayoutableShadowNode &>(subviewShadowNode);
+
+      auto state = std::static_pointer_cast<
+              const RNSScreenStackHeaderSubviewShadowNode::ConcreteState>(
+              shadowNode.getState());
+      auto stateData = state->getData();
+
+      if (stateData.frameSize.width != 0 && stateData.frameSize.height != 0) {
+          layoutableShadowNode.setSize(Size{stateData.frameSize.width, stateData.frameSize.height});
+      }
+
     ConcreteComponentDescriptor::adopt(shadowNode);
   }
 };

common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderSubviewShadowNode.cpp

@@ -5,4 +5,18 @@ namespace facebook::react {
 extern const char RNSScreenStackHeaderSubviewComponentName[] =
     "RNSScreenStackHeaderSubview";
 
-} // namespace facebook::react
+void RNSScreenStackHeaderSubviewShadowNode::layout(LayoutContext layoutContext) {
+    YogaLayoutableShadowNode::layout(layoutContext);
+    applyFrameCorrections();
+}
+
+void RNSScreenStackHeaderSubviewShadowNode::applyFrameCorrections() {
+    ensureUnsealed();
+
+    const auto &stateData = getStateData();
+    layoutMetrics_.frame.origin.x = stateData.contentOffset.x;
+    layoutMetrics_.frame.origin.y = stateData.contentOffset.y;
+}
+
+}
+