Skip to content

Commit fc032cd

Browse files
JoshuaGrossfacebook-github-bot
authored andcommitted
Fix RTL content jumping
Summary: Whenever layout updates in a horizontal scrollview, in RTL mode we adjust the position - the impact *should* be that initially, we jump from position 0 to the right side of the scroll view, such that scrolling starts from the right. However, we were doing this entirely too aggressively before. We should only make this adjustment *if the layout changes the width*. Changelog: [Android][Changed] Fixed jumpy RTL horizontal ScrollViews. If you have Android-specific JS hacks for handling RTL in ScrollViews, you probably can/probably want to remove them, because they should be reliable now and require fewer hacks. Reviewed By: mdvacca Differential Revision: D26771366 fbshipit-source-id: de11bd1cae1414018d88ce44b3583a8b15f3b330
1 parent 00959ff commit fc032cd

File tree

1 file changed

+14
-12
lines changed

1 file changed

+14
-12
lines changed

ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactHorizontalScrollContainerView.java

+14-12
Original file line numberDiff line numberDiff line change
@@ -44,13 +44,6 @@ public void setRemoveClippedSubviews(boolean removeClippedSubviews) {
4444

4545
@Override
4646
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
47-
/**
48-
* Note: in RTL mode, *when layout width changes*, we adjust the scroll position. Practically,
49-
* this means that on the first (meaningful) layout we will go from position 0 to position
50-
* (right - screenWidth). In theory this means if the width of the view ever changes during
51-
* layout again, scrolling could jump. Which shouldn't happen in theory, but... if you find a
52-
* weird product bug that looks related, keep this in mind.
53-
*/
5447
if (mLayoutDirection == LAYOUT_DIRECTION_RTL) {
5548
// When the layout direction is RTL, we expect Yoga to give us a layout
5649
// that extends off the screen to the left so we re-center it with left=0
@@ -60,11 +53,20 @@ protected void onLayout(boolean changed, int left, int top, int right, int botto
6053
setLeft(newLeft);
6154
setRight(newRight);
6255

63-
// Call with the present values in order to re-layout if necessary
64-
ReactHorizontalScrollView parent = (ReactHorizontalScrollView) getParent();
65-
// Fix the ScrollX position when using RTL language
66-
int offsetX = parent.getScrollX() + getWidth() - mCurrentWidth;
67-
parent.reactScrollTo(offsetX, parent.getScrollY());
56+
/**
57+
* Note: in RTL mode, *when layout width changes*, we adjust the scroll position. Practically,
58+
* this means that on the first (meaningful) layout we will go from position 0 to position
59+
* (right - screenWidth). In theory this means if the width of the view ever changes during
60+
* layout again, scrolling could jump. Which shouldn't happen in theory, but... if you find a
61+
* weird product bug that looks related, keep this in mind.
62+
*/
63+
if (mCurrentWidth != getWidth()) {
64+
// Call with the present values in order to re-layout if necessary
65+
ReactHorizontalScrollView parent = (ReactHorizontalScrollView) getParent();
66+
// Fix the ScrollX position when using RTL language
67+
int offsetX = parent.getScrollX() + getWidth() - mCurrentWidth;
68+
parent.reactScrollTo(offsetX, parent.getScrollY());
69+
}
6870
}
6971
mCurrentWidth = getWidth();
7072
}

0 commit comments

Comments
 (0)