Skip to content

Commit e58d300

Browse files
NickGerlemanfacebook-github-bot
authored andcommitted
Remove ReactHorizontalScrollView Legacy Background Path (facebook#46161)
Summary: Pull Request resolved: facebook#46161 ## This Diff This removes the legacy path from ReactHorizontalScrollView and its view manager. ## This Stack This removes the non-Style-applicator background management paths of the different native components. There have been multiple conflicting changes, and bugs added bc harder to reason about, which motivates making this change as soon as possible. This also lets us formalize guarantees that BaseViewManager may safely manipulate background styling of all built in native components. There is one still known issue, where BackgroundStyleApplicator does not propagate I18nManager derived layout direction to borders (compared to Android derived root direction). This is mostly an issue for apps that with LTR and RTL context, or force a layout direction, which I would guess is relatively rare, so my plan is to forward fix this later this by enabling set_android_layout_direction which will solve that problem mopre generically. Changelog: [Internal] Reviewed By: tdn120 Differential Revision: D61658082 fbshipit-source-id: 98cab5dfcad8beee6d131fcfe122313730a6f665
1 parent 426b300 commit e58d300

File tree

2 files changed

+29
-93
lines changed

2 files changed

+29
-93
lines changed

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactHorizontalScrollView.java

Lines changed: 15 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@
4949
import com.facebook.react.uimanager.ReactClippingViewGroupHelper;
5050
import com.facebook.react.uimanager.ReactOverflowViewWithInset;
5151
import com.facebook.react.uimanager.StateWrapper;
52-
import com.facebook.react.uimanager.ViewProps;
5352
import com.facebook.react.uimanager.events.NativeGestureUtil;
5453
import com.facebook.react.uimanager.style.BorderRadiusProp;
5554
import com.facebook.react.uimanager.style.BorderStyle;
@@ -61,7 +60,6 @@
6160
import com.facebook.react.views.scroll.ReactScrollViewHelper.HasSmoothScroll;
6261
import com.facebook.react.views.scroll.ReactScrollViewHelper.HasStateWrapper;
6362
import com.facebook.react.views.scroll.ReactScrollViewHelper.ReactScrollViewScrollState;
64-
import com.facebook.react.views.view.ReactViewBackgroundManager;
6563
import com.facebook.systrace.Systrace;
6664
import java.lang.reflect.Field;
6765
import java.util.ArrayList;
@@ -118,7 +116,6 @@ public class ReactHorizontalScrollView extends HorizontalScrollView
118116
private boolean mSnapToStart = true;
119117
private boolean mSnapToEnd = true;
120118
private int mSnapToAlignment = SNAP_ALIGNMENT_DISABLED;
121-
private ReactViewBackgroundManager mReactBackgroundManager;
122119
private boolean mPagedArrowScrolling = false;
123120
private int pendingContentOffsetX = UNSET_CONTENT_OFFSET;
124121
private int pendingContentOffsetY = UNSET_CONTENT_OFFSET;
@@ -139,7 +136,6 @@ public ReactHorizontalScrollView(Context context) {
139136

140137
public ReactHorizontalScrollView(Context context, @Nullable FpsListener fpsListener) {
141138
super(context);
142-
mReactBackgroundManager = new ReactViewBackgroundManager(this);
143139
mFpsListener = fpsListener;
144140

145141
ViewCompat.setAccessibilityDelegate(this, new ReactScrollViewAccessibilityDelegate());
@@ -155,7 +151,6 @@ public ReactHorizontalScrollView(Context context, @Nullable FpsListener fpsListe
155151

156152
setOnHierarchyChangeListener(this);
157153
setClipChildren(false);
158-
mReactBackgroundManager.setOverflow(ViewProps.SCROLL);
159154
}
160155

161156
public boolean getScrollEnabled() {
@@ -290,7 +285,6 @@ public void setOverflow(@Nullable String overflow) {
290285
mOverflow = parsedOverflow == null ? Overflow.SCROLL : parsedOverflow;
291286
}
292287

293-
mReactBackgroundManager.setOverflow(overflow == null ? ViewProps.SCROLL : overflow);
294288
invalidate();
295289
}
296290

@@ -334,12 +328,8 @@ public Rect getOverflowInset() {
334328

335329
@Override
336330
public void onDraw(Canvas canvas) {
337-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
338-
if (mOverflow != Overflow.VISIBLE) {
339-
BackgroundStyleApplicator.clipToPaddingBox(this, canvas);
340-
}
341-
} else {
342-
mReactBackgroundManager.maybeClipToPaddingBox(canvas);
331+
if (mOverflow != Overflow.VISIBLE) {
332+
BackgroundStyleApplicator.clipToPaddingBox(this, canvas);
343333
}
344334
super.onDraw(canvas);
345335
}
@@ -1330,55 +1320,35 @@ private void smoothScrollToNextPage(int direction) {
13301320

13311321
@Override
13321322
public void setBackgroundColor(int color) {
1333-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
1334-
BackgroundStyleApplicator.setBackgroundColor(this, color);
1335-
} else {
1336-
mReactBackgroundManager.setBackgroundColor(color);
1337-
}
1323+
BackgroundStyleApplicator.setBackgroundColor(this, color);
13381324
}
13391325

13401326
public void setBorderWidth(int position, float width) {
1341-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
1342-
BackgroundStyleApplicator.setBorderWidth(
1343-
this, LogicalEdge.values()[position], PixelUtil.toDIPFromPixel(width));
1344-
} else {
1345-
mReactBackgroundManager.setBorderWidth(position, width);
1346-
}
1327+
BackgroundStyleApplicator.setBorderWidth(
1328+
this, LogicalEdge.values()[position], PixelUtil.toDIPFromPixel(width));
13471329
}
13481330

13491331
public void setBorderColor(int position, @Nullable Integer color) {
1350-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
1351-
BackgroundStyleApplicator.setBorderColor(this, LogicalEdge.values()[position], color);
1352-
} else {
1353-
mReactBackgroundManager.setBorderColor(position, color);
1354-
}
1332+
BackgroundStyleApplicator.setBorderColor(this, LogicalEdge.values()[position], color);
13551333
}
13561334

13571335
public void setBorderRadius(float borderRadius) {
13581336
setBorderRadius(borderRadius, BorderRadiusProp.BORDER_RADIUS.ordinal());
13591337
}
13601338

13611339
public void setBorderRadius(float borderRadius, int position) {
1362-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
1363-
@Nullable
1364-
LengthPercentage radius =
1365-
Float.isNaN(borderRadius)
1366-
? null
1367-
: new LengthPercentage(
1368-
PixelUtil.toDIPFromPixel(borderRadius), LengthPercentageType.POINT);
1369-
BackgroundStyleApplicator.setBorderRadius(this, BorderRadiusProp.values()[position], radius);
1370-
} else {
1371-
mReactBackgroundManager.setBorderRadius(borderRadius, position);
1372-
}
1340+
@Nullable
1341+
LengthPercentage radius =
1342+
Float.isNaN(borderRadius)
1343+
? null
1344+
: new LengthPercentage(
1345+
PixelUtil.toDIPFromPixel(borderRadius), LengthPercentageType.POINT);
1346+
BackgroundStyleApplicator.setBorderRadius(this, BorderRadiusProp.values()[position], radius);
13731347
}
13741348

13751349
public void setBorderStyle(@Nullable String style) {
1376-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
1377-
BackgroundStyleApplicator.setBorderStyle(
1378-
this, style == null ? null : BorderStyle.fromString(style));
1379-
} else {
1380-
mReactBackgroundManager.setBorderStyle(style);
1381-
}
1350+
BackgroundStyleApplicator.setBorderStyle(
1351+
this, style == null ? null : BorderStyle.fromString(style));
13821352
}
13831353

13841354
/**

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactHorizontalScrollViewManager.java

Lines changed: 14 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@
1616
import com.facebook.react.bridge.ReadableArray;
1717
import com.facebook.react.bridge.ReadableMap;
1818
import com.facebook.react.bridge.RetryableMountingLayerException;
19-
import com.facebook.react.internal.featureflags.ReactNativeFeatureFlags;
2019
import com.facebook.react.module.annotations.ReactModule;
2120
import com.facebook.react.uimanager.BackgroundStyleApplicator;
2221
import com.facebook.react.uimanager.LengthPercentage;
@@ -264,36 +263,20 @@ public void setBottomFillColor(ReactHorizontalScrollView view, int color) {
264263
},
265264
defaultFloat = Float.NaN)
266265
public void setBorderRadius(ReactHorizontalScrollView view, int index, float borderRadius) {
267-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
268-
@Nullable
269-
LengthPercentage radius =
270-
Float.isNaN(borderRadius)
271-
? null
272-
: new LengthPercentage(borderRadius, LengthPercentageType.POINT);
273-
BackgroundStyleApplicator.setBorderRadius(view, BorderRadiusProp.values()[index], radius);
274-
} else {
275-
if (!Float.isNaN(borderRadius)) {
276-
borderRadius = PixelUtil.toPixelFromDIP(borderRadius);
277-
}
278-
279-
if (index == 0) {
280-
view.setBorderRadius(borderRadius);
281-
} else {
282-
view.setBorderRadius(borderRadius, index - 1);
283-
}
284-
}
266+
@Nullable
267+
LengthPercentage radius =
268+
Float.isNaN(borderRadius)
269+
? null
270+
: new LengthPercentage(borderRadius, LengthPercentageType.POINT);
271+
BackgroundStyleApplicator.setBorderRadius(view, BorderRadiusProp.values()[index], radius);
285272
}
286273

287274
@ReactProp(name = "borderStyle")
288275
public void setBorderStyle(ReactHorizontalScrollView view, @Nullable String borderStyle) {
289-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
290-
@Nullable
291-
BorderStyle parsedBorderStyle =
292-
borderStyle == null ? null : BorderStyle.fromString(borderStyle);
293-
BackgroundStyleApplicator.setBorderStyle(view, parsedBorderStyle);
294-
} else {
295-
view.setBorderStyle(borderStyle);
296-
}
276+
@Nullable
277+
BorderStyle parsedBorderStyle =
278+
borderStyle == null ? null : BorderStyle.fromString(borderStyle);
279+
BackgroundStyleApplicator.setBorderStyle(view, parsedBorderStyle);
297280
}
298281

299282
@ReactPropGroup(
@@ -306,14 +289,7 @@ public void setBorderStyle(ReactHorizontalScrollView view, @Nullable String bord
306289
},
307290
defaultFloat = Float.NaN)
308291
public void setBorderWidth(ReactHorizontalScrollView view, int index, float width) {
309-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
310-
BackgroundStyleApplicator.setBorderWidth(view, LogicalEdge.values()[index], width);
311-
} else {
312-
if (!Float.isNaN(width)) {
313-
width = PixelUtil.toPixelFromDIP(width);
314-
}
315-
view.setBorderWidth(SPACING_TYPES[index], width);
316-
}
292+
BackgroundStyleApplicator.setBorderWidth(view, LogicalEdge.values()[index], width);
317293
}
318294

319295
@ReactPropGroup(
@@ -326,11 +302,7 @@ public void setBorderWidth(ReactHorizontalScrollView view, int index, float widt
326302
},
327303
customType = "Color")
328304
public void setBorderColor(ReactHorizontalScrollView view, int index, @Nullable Integer color) {
329-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
330-
BackgroundStyleApplicator.setBorderColor(view, LogicalEdge.ALL, color);
331-
} else {
332-
view.setBorderColor(SPACING_TYPES[index], color);
333-
}
305+
BackgroundStyleApplicator.setBorderColor(view, LogicalEdge.ALL, color);
334306
}
335307

336308
@ReactProp(name = "overflow")
@@ -392,17 +364,11 @@ public void setHorizontal(ReactHorizontalScrollView view, boolean horizontal) {
392364

393365
@ReactProp(name = ViewProps.BOX_SHADOW, customType = "BoxShadow")
394366
public void setBoxShadow(ReactHorizontalScrollView view, @Nullable ReadableArray shadows) {
395-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
396-
BackgroundStyleApplicator.setBoxShadow(view, shadows);
397-
}
367+
BackgroundStyleApplicator.setBoxShadow(view, shadows);
398368
}
399369

400370
@Override
401371
public void setBackgroundColor(ReactHorizontalScrollView view, @ColorInt int backgroundColor) {
402-
if (ReactNativeFeatureFlags.enableBackgroundStyleApplicator()) {
403-
BackgroundStyleApplicator.setBackgroundColor(view, backgroundColor);
404-
} else {
405-
super.setBackgroundColor(view, backgroundColor);
406-
}
372+
BackgroundStyleApplicator.setBackgroundColor(view, backgroundColor);
407373
}
408374
}

0 commit comments

Comments
 (0)