Fix inverted `contentOffset` in scroll events in RTL (#39031)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/39031

`UIScrollView` `contentOffset` is flow-relative, so `x` is relative to the right edge of the screen. This coordinate space disagrees with layout events, `scrollTo` coordinates, and other platforms.

This applies the same logic we use for inverting `scrollTo` coordinates to invert `contentOffset` in scroll events, in both Paper and Fabric. We then remove the iOS specific workaround we have in VirtualizedList.

I did not test `contentInset` as part of this, whose structure has explicit edges like `left` and `right`.

Changelog:
[iOS][Fixed] - Fix inverted `contentOffset` in scroll events in RTL

Reviewed By: rozele

Differential Revision: D48379915

fbshipit-source-id: 8a9cbb01608e79ef3b179a76fbe3997a0cd23845
This commit is contained in:
Nick Gerleman 2023-08-21 18:03:43 -07:00 коммит произвёл Facebook GitHub Bot
Родитель 145659241a
Коммит 4f8a8ce316
3 изменённых файлов: 19 добавлений и 8 удалений

Просмотреть файл

@ -390,6 +390,11 @@ static void RCTSendScrollEventForNativeAnimations_DEPRECATED(UIScrollView *scrol
metrics.contentInset = RCTEdgeInsetsFromUIEdgeInsets(_scrollView.contentInset);
metrics.containerSize = RCTSizeFromCGSize(_scrollView.bounds.size);
metrics.zoomScale = _scrollView.zoomScale;
if (_layoutMetrics.layoutDirection == LayoutDirection::RightToLeft) {
metrics.contentOffset.x = metrics.contentSize.width - metrics.containerSize.width - metrics.contentOffset.x;
}
return metrics;
}

Просмотреть файл

@ -1038,9 +1038,15 @@ RCT_SET_AND_PRESERVE_OFFSET(setScrollIndicatorInsets, scrollIndicatorInsets, UIE
_coalescingKey++;
_lastEmittedEventName = [eventName copy];
}
CGPoint offset = scrollView.contentOffset;
if ([UIApplication sharedApplication].userInterfaceLayoutDirection == UIUserInterfaceLayoutDirectionRightToLeft) {
offset.x = scrollView.contentSize.width - scrollView.frame.size.width - offset.x;
}
RCTScrollEvent *scrollEvent = [[RCTScrollEvent alloc] initWithEventName:eventName
reactTag:self.reactTag
scrollViewContentOffset:scrollView.contentOffset
scrollViewContentOffset:offset
scrollViewContentInset:scrollView.contentInset
scrollViewContentSize:scrollView.contentSize
scrollViewFrame:scrollView.frame

Просмотреть файл

@ -1735,15 +1735,15 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
_offsetFromScrollEvent(e: ScrollEvent): number {
const {contentOffset, contentSize, layoutMeasurement} = e.nativeEvent;
const {horizontal, rtl} = this._orientation();
if (Platform.OS === 'ios' || !(horizontal && rtl)) {
if (horizontal && rtl) {
return (
this._selectLength(contentSize) -
(this._selectOffset(contentOffset) +
this._selectLength(layoutMeasurement))
);
} else {
return this._selectOffset(contentOffset);
}
return (
this._selectLength(contentSize) -
(this._selectOffset(contentOffset) +
this._selectLength(layoutMeasurement))
);
}
_scheduleCellsToRenderUpdate(opts?: {allowImmediateExecution?: boolean}) {