From 7579db939d02a1a938f2433829e2b2cf5dfbcfe9 Mon Sep 17 00:00:00 2001 From: Christoph Purrer Date: Fri, 11 Nov 2022 22:20:58 +0100 Subject: [PATCH] Fix contentInsetAdjustmentBehavior set to automatic on ScrollView in the new architecture (#34217) (#1484) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Summary: Fixes https://github.com/facebook/react-native/issues/34165 and [Large title fails](https://github.com/reactwg/react-native-new-architecture/discussions/43) on the new React Native architecture. There are problems with setting `contentInsetAdjustmentBehavior` to `automatic` on the `ScrollView` component in the new React Native architecture. The `automatic` setting matters to navigation libraries (like [my Navigation router](https://github.com/grahammendick/navigation)) because it stops the `ScrollView` from overlapping the `UINavigationBar`. The setting also powers important native features like large titles and search bars on iOS. The `automatic` setting works fine on the old architecture. It doesn’t work on the new architecture because React Native is recycling views. In https://github.com/facebook/react-native/issues/34165 and [Large title fails](https://github.com/reactwg/react-native-new-architecture/discussions/43) there are videos comparing the setting in the old and the new architecture. ## Changelog [iOS] [Fixed] - Fix `contentInsetAdjustmentBehavior` set to `automatic` on `ScrollView` in the new architecture Pull Request resolved: https://github.com/facebook/react-native/pull/34217 Test Plan: I checked the fix in both the repros in https://github.com/facebook/react-native/issues/34165 and [Large title fails](https://github.com/reactwg/react-native-new-architecture/discussions/43). Here is a video of the fix running with large titles in the new architecture. https://user-images.githubusercontent.com/1761227/179612188-162b896b-82c5-45de-bb5a-ba80f452fbee.mov Reviewed By: sammy-SC Differential Revision: D37952506 Pulled By: cipolleschi fbshipit-source-id: 6cff6c85aa33b579405fe34a9e36c8630f4c24bd Co-authored-by: Graham Mendick --- .../ComponentViews/ScrollView/RCTScrollViewComponentView.mm | 3 +++ 1 file changed, 3 insertions(+) diff --git a/React/Fabric/Mounting/ComponentViews/ScrollView/RCTScrollViewComponentView.mm b/React/Fabric/Mounting/ComponentViews/ScrollView/RCTScrollViewComponentView.mm index c50012a849cbfe..2d3bbec1b5f73c 100644 --- a/React/Fabric/Mounting/ComponentViews/ScrollView/RCTScrollViewComponentView.mm +++ b/React/Fabric/Mounting/ComponentViews/ScrollView/RCTScrollViewComponentView.mm @@ -388,6 +388,9 @@ - (void)prepareForRecycle _shouldUpdateContentInsetAdjustmentBehavior = YES; _state.reset(); _isUserTriggeredScrolling = NO; + CGRect oldFrame = self.frame; + self.frame = CGRectZero; + self.frame = oldFrame; [super prepareForRecycle]; }