Skip to content

Commit d1a33cd

Browse files
obladorfacebook-github-bot
authored andcommitted
Fix Android border positioning regression (#32398)
Summary: #29099 introduced a regression where non-rounded borders on Android would render partly outside of the bounds of the view as I reported in #32393. This PR addresses that by rendering the borders completely inside the view like it works on iOS, previous version of RN and for rounded corners. ## Changelog <!-- Help reviewers and the release process by writing your own changelog entry. For an example, see: https://github.com/facebook/react-native/wiki/Changelog --> [Android] [Fixed] - Fix Android border positioning regression Pull Request resolved: #32398 Test Plan: Rendering the following code (as reported in the issue) in the RN Tester app: ```jsx <View style={{ aspectRatio: 1, backgroundColor: 'green', borderWidth: 8, borderColor: 'black', borderStyle: 'dashed', }} /> ``` |Before|After| |--|--| |![before](https://user-images.githubusercontent.com/378279/137178113-dd2fea7e-48c8-450b-be3a-92706ef93194.png)|![after](https://user-images.githubusercontent.com/378279/137178140-b5ce7b3d-d455-48a9-a57f-0f3194a65c9a.png)| Reviewed By: yungsters Differential Revision: D31623647 Pulled By: lunaleaps fbshipit-source-id: c38d172ae4a9dc48f800c63258223a59e2f621ed
1 parent 046a7d2 commit d1a33cd

File tree

1 file changed

+8
-8
lines changed

1 file changed

+8
-8
lines changed

ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java

+8-8
Original file line numberDiff line numberDiff line change
@@ -1106,35 +1106,35 @@ private void drawRectangularBackgroundWithBorders(Canvas canvas) {
11061106
int width = Math.round(borderWidth.left);
11071107
updatePathEffect(width);
11081108
mPaint.setStrokeWidth(width);
1109-
mPathForSingleBorder.moveTo(left, top - borderWidth.top / 2);
1110-
mPathForSingleBorder.lineTo(left, bottom + borderWidth.bottom / 2);
1109+
mPathForSingleBorder.moveTo(left + width / 2, top);
1110+
mPathForSingleBorder.lineTo(left + width / 2, bottom);
11111111
canvas.drawPath(mPathForSingleBorder, mPaint);
11121112
}
11131113
if (borderTop > 0) {
11141114
mPathForSingleBorder.reset();
11151115
int width = Math.round(borderWidth.top);
11161116
updatePathEffect(width);
11171117
mPaint.setStrokeWidth(width);
1118-
mPathForSingleBorder.moveTo(left, top);
1119-
mPathForSingleBorder.lineTo(right, top);
1118+
mPathForSingleBorder.moveTo(left, top + width / 2);
1119+
mPathForSingleBorder.lineTo(right, top + width / 2);
11201120
canvas.drawPath(mPathForSingleBorder, mPaint);
11211121
}
11221122
if (borderRight > 0) {
11231123
mPathForSingleBorder.reset();
11241124
int width = Math.round(borderWidth.right);
11251125
updatePathEffect(width);
11261126
mPaint.setStrokeWidth(width);
1127-
mPathForSingleBorder.moveTo(right, top - borderWidth.top / 2);
1128-
mPathForSingleBorder.lineTo(right, bottom + borderWidth.bottom / 2);
1127+
mPathForSingleBorder.moveTo(right - width / 2, top);
1128+
mPathForSingleBorder.lineTo(right - width / 2, bottom);
11291129
canvas.drawPath(mPathForSingleBorder, mPaint);
11301130
}
11311131
if (borderBottom > 0) {
11321132
mPathForSingleBorder.reset();
11331133
int width = Math.round(borderWidth.bottom);
11341134
updatePathEffect(width);
11351135
mPaint.setStrokeWidth(width);
1136-
mPathForSingleBorder.moveTo(left, bottom);
1137-
mPathForSingleBorder.lineTo(right, bottom);
1136+
mPathForSingleBorder.moveTo(left, bottom - width / 2);
1137+
mPathForSingleBorder.lineTo(right, bottom - width / 2);
11381138
canvas.drawPath(mPathForSingleBorder, mPaint);
11391139
}
11401140
}

0 commit comments

Comments
 (0)