Skip to content

Commit

Permalink
Fixed fractional border width on iOS
Browse files Browse the repository at this point in the history 
Summary:
Incorrect render for borders that are not proportional to device pixel: borders get stretched and become significantly bigger than expected.
Rdar: http://www.openradar.me/15959788

Incorrect render for borders that are not proportional to device pixel: borders get stretched and become significantly bigger than expected.
Rdar: http://www.openradar.me/15959788

Reviewed By: shergin

Differential Revision: D6317674

fbshipit-source-id: 6bc331447458583a02c0e56d0d011a31d31d70a8
  • Loading branch information
@Nikita2k @facebook-github-bot
Nikita2k authored and facebook-github-bot committed Nov 21, 2017
1 parent 5aa1fb3 commit 15179f1
Showing 1 changed file with 14 additions and 0 deletions.
14 changes: 14 additions & 0 deletions React/Views/RCTBorderDrawing.m
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,15 @@ RCTCornerInsets RCTGetCornerInsets(RCTCornerRadii cornerRadii,
};
}

static UIEdgeInsets RCTRoundInsetsToPixel(UIEdgeInsets edgeInsets) {
edgeInsets.top = RCTRoundPixelValue(edgeInsets.top);
edgeInsets.bottom = RCTRoundPixelValue(edgeInsets.bottom);
edgeInsets.left = RCTRoundPixelValue(edgeInsets.left);
edgeInsets.right = RCTRoundPixelValue(edgeInsets.right);

return edgeInsets;
}

static void RCTPathAddEllipticArc(CGMutablePathRef path,
const CGAffineTransform *m,
CGPoint origin,
Expand Down Expand Up @@ -195,6 +204,11 @@ static CGContextRef RCTUIGraphicsBeginImageContext(CGSize size, CGColorRef backg
const BOOL hasCornerRadii = RCTCornerRadiiAreAboveThreshold(cornerRadii);
const RCTCornerInsets cornerInsets = RCTGetCornerInsets(cornerRadii, borderInsets);

// Incorrect render for borders that are not proportional to device pixel: borders get stretched and become
// significantly bigger than expected.
// Rdar: http://www.openradar.me/15959788
borderInsets = RCTRoundInsetsToPixel(borderInsets);

const BOOL makeStretchable =
(borderInsets.left + cornerInsets.topLeft.width +
borderInsets.right + cornerInsets.bottomRight.width <= viewSize.width) &&
Expand Down

3 comments on commit 15179f1

@aleclarson
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should the borderInsets be rounded before the cornerInsets are calculated based off them?

Or was this intended?

react-native/React/Views/RCTBorderDrawing.m

Lines 205 to 210 in 15179f1

const RCTCornerInsets cornerInsets = RCTGetCornerInsets(cornerRadii, borderInsets);
// Incorrect render for borders that are not proportional to device pixel: borders get stretched and become
// significantly bigger than expected.
// Rdar: http://www.openradar.me/15959788
borderInsets = RCTRoundInsetsToPixel(borderInsets);

/cc @shergin

@shergin
Copy link
Contributor

@shergin shergin commented on 15179f1 Feb 6, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@aleclarson I am not sure, I assume it was intended. Do you have a counterexample?

@aleclarson
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@shergin Nah, it just looks suspicious. :P

Please sign in to comment.