From 9a3581879764f3f1b2743905e3e54611e96bb618 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Danilo=20B=C3=BCrger?= Date: Mon, 7 Feb 2022 10:22:41 -0800 Subject: [PATCH] Use trait collection to resolve border colors (#32492) Summary: https://github.com/facebook/react-native/commit/c974cbff04a8d90ac0f856dbada3fc5a75c75b49 changed the border colors to be of UIColor instead of CGColor. This allowed working with dark mode to switch the border colors automatically. However, in certain situation the system can't resolve the current trait collection (see https://stackoverflow.com/a/57177411/2525941). This commit resolves the colors with the current trait collection to ensure the right colors are selected. This matches with the behavior of how the background color is resolved (also in displayLayer:). ## Changelog [iOS] [Fixed] - Resolve border platform color based on current trait collection Pull Request resolved: https://github.com/facebook/react-native/pull/32492 Test Plan: Same test plan as https://github.com/facebook/react-native/pull/29728 Reviewed By: sammy-SC Differential Revision: D33819225 Pulled By: cortinico fbshipit-source-id: 2f8024be7ee7b32d1852373b47fa1437cc569391 --- React/Views/RCTView.m | 46 +++++++++++++++++++++++++++---------------- 1 file changed, 29 insertions(+), 17 deletions(-) diff --git a/React/Views/RCTView.m b/React/Views/RCTView.m index 8ed93cdf51cf1e..a18da5c92389d0 100644 --- a/React/Views/RCTView.m +++ b/React/Views/RCTView.m @@ -706,33 +706,45 @@ - (RCTCornerRadii)cornerRadii }; } -- (RCTBorderColors)borderColors +- (RCTBorderColors)borderColorsWithTraitCollection:(UITraitCollection *)traitCollection { const BOOL isRTL = _reactLayoutDirection == UIUserInterfaceLayoutDirectionRightToLeft; + UIColor *directionAwareBorderLeftColor = nil; + UIColor *directionAwareBorderRightColor = nil; + if ([[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL]) { UIColor *borderStartColor = _borderStartColor ?: _borderLeftColor; UIColor *borderEndColor = _borderEndColor ?: _borderRightColor; - UIColor *directionAwareBorderLeftColor = isRTL ? borderEndColor : borderStartColor; - UIColor *directionAwareBorderRightColor = isRTL ? borderStartColor : borderEndColor; - - return (RCTBorderColors){ - (_borderTopColor ?: _borderColor).CGColor, - (directionAwareBorderLeftColor ?: _borderColor).CGColor, - (_borderBottomColor ?: _borderColor).CGColor, - (directionAwareBorderRightColor ?: _borderColor).CGColor, - }; + directionAwareBorderLeftColor = isRTL ? borderEndColor : borderStartColor; + directionAwareBorderRightColor = isRTL ? borderStartColor : borderEndColor; + } else { + directionAwareBorderLeftColor = (isRTL ? _borderEndColor : _borderStartColor) ?: _borderLeftColor; + directionAwareBorderRightColor = (isRTL ? _borderStartColor : _borderEndColor) ?: _borderRightColor; } - UIColor *directionAwareBorderLeftColor = isRTL ? _borderEndColor : _borderStartColor; - UIColor *directionAwareBorderRightColor = isRTL ? _borderStartColor : _borderEndColor; + UIColor *borderColor = _borderColor; + UIColor *borderTopColor = _borderTopColor; + UIColor *borderBottomColor = _borderBottomColor; + +#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED >= 130000 + if (@available(iOS 13.0, *)) { + borderColor = [borderColor resolvedColorWithTraitCollection:self.traitCollection]; + borderTopColor = [borderTopColor resolvedColorWithTraitCollection:self.traitCollection]; + directionAwareBorderLeftColor = + [directionAwareBorderLeftColor resolvedColorWithTraitCollection:self.traitCollection]; + borderBottomColor = [borderBottomColor resolvedColorWithTraitCollection:self.traitCollection]; + directionAwareBorderRightColor = + [directionAwareBorderRightColor resolvedColorWithTraitCollection:self.traitCollection]; + } +#endif return (RCTBorderColors){ - (_borderTopColor ?: _borderColor).CGColor, - (directionAwareBorderLeftColor ?: _borderLeftColor ?: _borderColor).CGColor, - (_borderBottomColor ?: _borderColor).CGColor, - (directionAwareBorderRightColor ?: _borderRightColor ?: _borderColor).CGColor, + (borderTopColor ?: borderColor).CGColor, + (directionAwareBorderLeftColor ?: borderColor).CGColor, + (borderBottomColor ?: borderColor).CGColor, + (directionAwareBorderRightColor ?: borderColor).CGColor, }; } @@ -758,7 +770,7 @@ - (void)displayLayer:(CALayer *)layer const RCTCornerRadii cornerRadii = [self cornerRadii]; const UIEdgeInsets borderInsets = [self bordersAsInsets]; - const RCTBorderColors borderColors = [self borderColors]; + const RCTBorderColors borderColors = [self borderColorsWithTraitCollection:self.traitCollection]; BOOL useIOSBorderRendering = RCTCornerRadiiAreEqual(cornerRadii) && RCTBorderInsetsAreEqual(borderInsets) && RCTBorderColorsAreEqual(borderColors) && _borderStyle == RCTBorderStyleSolid &&