Fix rendering of transparent borders in RN Android

Summary:
This diff fixes the rendering of transparent borders in RN Android views
The fix clips the view ONLY when there is a border color that's non transparent

This change unifies the rendering of transparent and semitransparent borders for Views between RN Android, iOS and Web

Changelog: [Android][Fix] Fix rendering of transparent borders in RN Android

Reviewed By: JoshuaGross

Differential Revision: D36890856

fbshipit-source-id: 38fc2ae215f136160a73ca470e03fada8cb81ced
This commit is contained in:
David Vacca
2022-06-05 15:18:39 -07:00
committed by Facebook GitHub Bot
parent 5ed6ac1f25
commit a9659ce86d
@@ -89,7 +89,7 @@ public class ReactViewBackgroundDrawable extends Drawable {
private @Nullable Path mOuterClipPathForBorderRadius;
private @Nullable Path mPathForBorderRadiusOutline;
private @Nullable Path mPathForBorder;
private Path mPathForSingleBorder = new Path();
private final Path mPathForSingleBorder = new Path();
private @Nullable Path mCenterDrawPath;
private @Nullable RectF mInnerClipTempRectForBorderRadius;
private @Nullable RectF mOuterClipTempRectForBorderRadius;
@@ -217,6 +217,7 @@ public class ReactViewBackgroundDrawable extends Drawable {
public void setBorderColor(int position, float rgb, float alpha) {
this.setBorderRGB(position, rgb);
this.setBorderAlpha(position, alpha);
mNeedUpdatePathForBorderRadius = true;
}
private void setBorderRGB(int position, float rgb) {
@@ -523,10 +524,24 @@ public class ReactViewBackgroundDrawable extends Drawable {
final RectF borderWidth = getDirectionAwareBorderInsets();
mInnerClipTempRectForBorderRadius.top += borderWidth.top;
mInnerClipTempRectForBorderRadius.bottom -= borderWidth.bottom;
mInnerClipTempRectForBorderRadius.left += borderWidth.left;
mInnerClipTempRectForBorderRadius.right -= borderWidth.right;
int colorLeft = getBorderColor(Spacing.LEFT);
int colorTop = getBorderColor(Spacing.TOP);
int colorRight = getBorderColor(Spacing.RIGHT);
int colorBottom = getBorderColor(Spacing.BOTTOM);
int borderColor = getBorderColor(Spacing.ALL);
// Clip border ONLY if its color is non transparent
if (Color.alpha(colorLeft) != 0
&& Color.alpha(colorTop) != 0
&& Color.alpha(colorRight) != 0
&& Color.alpha(colorBottom) != 0
&& Color.alpha(borderColor) != 0) {
mInnerClipTempRectForBorderRadius.top += borderWidth.top;
mInnerClipTempRectForBorderRadius.bottom -= borderWidth.bottom;
mInnerClipTempRectForBorderRadius.left += borderWidth.left;
mInnerClipTempRectForBorderRadius.right -= borderWidth.right;
}
mTempRectForCenterDrawPath.top += borderWidth.top * 0.5f;
mTempRectForCenterDrawPath.bottom -= borderWidth.bottom * 0.5f;