From cd6a91343ee24af83c7437b3f2449b41e97760e9 Mon Sep 17 00:00:00 2001 From: hurali97 Date: Thu, 25 Aug 2022 21:03:28 -0700 Subject: [PATCH] fix: border width top/bottom not matching the border radius (#34362) Summary: Fixes https://github.com/facebook/react-native/issues/33950 After analysing the values used for drawing the border specifically the top and bottom values of `mInnerClipTempRectForBorderRadius` weren't matching the needs when it comes to the case of borderTopWidth and borderBottomWidth, when the borderRadius is applied. Asking for reviews cortinico ## Changelog [Android] [Fixed] - Border width top/bottom not matching the border radius Pull Request resolved: https://github.com/facebook/react-native/pull/34362 Test Plan: Tested in a local project, following are the outputs(Details are in the issue attached): Before: After: Reviewed By: hramos Differential Revision: D38805873 Pulled By: lunaleaps fbshipit-source-id: 69f8ff9a9caeeaf88d1c76b639271f642c2e7ea2 --- .../react/views/view/ReactViewBackgroundDrawable.java | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java b/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java index 6a53ed80f1becc..827aaec706eacd 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java +++ b/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java @@ -791,7 +791,7 @@ private void updatePath() { /** Compute mInnerTopLeftCorner */ mInnerTopLeftCorner.x = mInnerClipTempRectForBorderRadius.left; - mInnerTopLeftCorner.y = mInnerClipTempRectForBorderRadius.top; + mInnerTopLeftCorner.y = mInnerClipTempRectForBorderRadius.top * 2; getEllipseIntersectionWithLine( // Ellipse Bounds @@ -817,7 +817,7 @@ private void updatePath() { } mInnerBottomLeftCorner.x = mInnerClipTempRectForBorderRadius.left; - mInnerBottomLeftCorner.y = mInnerClipTempRectForBorderRadius.bottom; + mInnerBottomLeftCorner.y = mInnerClipTempRectForBorderRadius.bottom * -2; getEllipseIntersectionWithLine( // Ellipse Bounds @@ -843,7 +843,7 @@ private void updatePath() { } mInnerTopRightCorner.x = mInnerClipTempRectForBorderRadius.right; - mInnerTopRightCorner.y = mInnerClipTempRectForBorderRadius.top; + mInnerTopRightCorner.y = mInnerClipTempRectForBorderRadius.top * 2; getEllipseIntersectionWithLine( // Ellipse Bounds @@ -869,7 +869,7 @@ private void updatePath() { } mInnerBottomRightCorner.x = mInnerClipTempRectForBorderRadius.right; - mInnerBottomRightCorner.y = mInnerClipTempRectForBorderRadius.bottom; + mInnerBottomRightCorner.y = mInnerClipTempRectForBorderRadius.bottom * -2; getEllipseIntersectionWithLine( // Ellipse Bounds