diff --git a/React/Views/RCTView.h b/React/Views/RCTView.h
index 7b86d088ae66e9..c82242d90b1042 100644
--- a/React/Views/RCTView.h
+++ b/React/Views/RCTView.h
@@ -82,13 +82,13 @@ extern const UIAccessibilityTraits SwitchAccessibilityTrait;
/**
* Border colors (actually retained).
*/
-@property (nonatomic, assign) CGColorRef borderTopColor;
-@property (nonatomic, assign) CGColorRef borderRightColor;
-@property (nonatomic, assign) CGColorRef borderBottomColor;
-@property (nonatomic, assign) CGColorRef borderLeftColor;
-@property (nonatomic, assign) CGColorRef borderStartColor;
-@property (nonatomic, assign) CGColorRef borderEndColor;
-@property (nonatomic, assign) CGColorRef borderColor;
+@property (nonatomic, strong) UIColor *borderTopColor;
+@property (nonatomic, strong) UIColor *borderRightColor;
+@property (nonatomic, strong) UIColor *borderBottomColor;
+@property (nonatomic, strong) UIColor *borderLeftColor;
+@property (nonatomic, strong) UIColor *borderStartColor;
+@property (nonatomic, strong) UIColor *borderEndColor;
+@property (nonatomic, strong) UIColor *borderColor;
/**
* Border widths.
diff --git a/React/Views/RCTView.m b/React/Views/RCTView.m
index 91e28ab95ec664..87ff206081f6f8 100644
--- a/React/Views/RCTView.m
+++ b/React/Views/RCTView.m
@@ -729,28 +729,28 @@ - (RCTBorderColors)borderColors
const BOOL isRTL = _reactLayoutDirection == UIUserInterfaceLayoutDirectionRightToLeft;
if ([[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL]) {
- const CGColorRef borderStartColor = _borderStartColor ?: _borderLeftColor;
- const CGColorRef borderEndColor = _borderEndColor ?: _borderRightColor;
+ UIColor *borderStartColor = _borderStartColor ?: _borderLeftColor;
+ UIColor *borderEndColor = _borderEndColor ?: _borderRightColor;
- const CGColorRef directionAwareBorderLeftColor = isRTL ? borderEndColor : borderStartColor;
- const CGColorRef directionAwareBorderRightColor = isRTL ? borderStartColor : borderEndColor;
+ UIColor *directionAwareBorderLeftColor = isRTL ? borderEndColor : borderStartColor;
+ UIColor *directionAwareBorderRightColor = isRTL ? borderStartColor : borderEndColor;
return (RCTBorderColors){
- _borderTopColor ?: _borderColor,
- directionAwareBorderLeftColor ?: _borderColor,
- _borderBottomColor ?: _borderColor,
- directionAwareBorderRightColor ?: _borderColor,
+ (_borderTopColor ?: _borderColor).CGColor,
+ (directionAwareBorderLeftColor ?: _borderColor).CGColor,
+ (_borderBottomColor ?: _borderColor).CGColor,
+ (directionAwareBorderRightColor ?: _borderColor).CGColor,
};
}
- const CGColorRef directionAwareBorderLeftColor = isRTL ? _borderEndColor : _borderStartColor;
- const CGColorRef directionAwareBorderRightColor = isRTL ? _borderStartColor : _borderEndColor;
+ UIColor *directionAwareBorderLeftColor = isRTL ? _borderEndColor : _borderStartColor;
+ UIColor *directionAwareBorderRightColor = isRTL ? _borderStartColor : _borderEndColor;
return (RCTBorderColors){
- _borderTopColor ?: _borderColor,
- directionAwareBorderLeftColor ?: _borderLeftColor ?: _borderColor,
- _borderBottomColor ?: _borderColor,
- directionAwareBorderRightColor ?: _borderRightColor ?: _borderColor,
+ (_borderTopColor ?: _borderColor).CGColor,
+ (directionAwareBorderLeftColor ?: _borderLeftColor ?: _borderColor).CGColor,
+ (_borderBottomColor ?: _borderColor).CGColor,
+ (directionAwareBorderRightColor ?: _borderRightColor ?: _borderColor).CGColor,
};
}
@@ -902,19 +902,18 @@ - (void)updateClippingForLayer:(CALayer *)layer
#pragma mark Border Color
-#define setBorderColor(side) \
- -(void)setBorder##side##Color : (CGColorRef)color \
- { \
- if (CGColorEqualToColor(_border##side##Color, color)) { \
- return; \
- } \
- CGColorRelease(_border##side##Color); \
- _border##side##Color = CGColorRetain(color); \
- [self.layer setNeedsDisplay]; \
+#define setBorderColor(side) \
+ -(void)setBorder##side##Color : (UIColor *)color \
+ { \
+ if ([_border##side##Color isEqual:color]) { \
+ return; \
+ } \
+ _border##side##Color = color; \
+ [self.layer setNeedsDisplay]; \
}
setBorderColor() setBorderColor(Top) setBorderColor(Right) setBorderColor(Bottom) setBorderColor(Left)
- setBorderColor(Start) setBorderColor(End)
+ setBorderColor(Start) setBorderColor(End)
#pragma mark - Border Width
@@ -928,8 +927,8 @@ -(void)setBorder##side##Width : (CGFloat)width \
[self.layer setNeedsDisplay]; \
}
- setBorderWidth() setBorderWidth(Top) setBorderWidth(Right) setBorderWidth(Bottom) setBorderWidth(Left)
- setBorderWidth(Start) setBorderWidth(End)
+ setBorderWidth() setBorderWidth(Top) setBorderWidth(Right) setBorderWidth(Bottom) setBorderWidth(Left)
+ setBorderWidth(Start) setBorderWidth(End)
#pragma mark - Border Radius
@@ -943,9 +942,9 @@ -(void)setBorder##side##Radius : (CGFloat)radius \
[self.layer setNeedsDisplay]; \
}
- setBorderRadius() setBorderRadius(TopLeft) setBorderRadius(TopRight) setBorderRadius(TopStart)
- setBorderRadius(TopEnd) setBorderRadius(BottomLeft) setBorderRadius(BottomRight)
- setBorderRadius(BottomStart) setBorderRadius(BottomEnd)
+ setBorderRadius() setBorderRadius(TopLeft) setBorderRadius(TopRight) setBorderRadius(TopStart)
+ setBorderRadius(TopEnd) setBorderRadius(BottomLeft) setBorderRadius(BottomRight)
+ setBorderRadius(BottomStart) setBorderRadius(BottomEnd)
#pragma mark - Border Style
@@ -959,17 +958,6 @@ -(void)setBorder##side##Style : (RCTBorderStyle)style \
[self.layer setNeedsDisplay]; \
}
- setBorderStyle()
+ setBorderStyle()
- - (void)dealloc
-{
- CGColorRelease(_borderColor);
- CGColorRelease(_borderTopColor);
- CGColorRelease(_borderRightColor);
- CGColorRelease(_borderBottomColor);
- CGColorRelease(_borderLeftColor);
- CGColorRelease(_borderStartColor);
- CGColorRelease(_borderEndColor);
-}
-
-@end
+ @end
diff --git a/React/Views/RCTViewManager.m b/React/Views/RCTViewManager.m
index 48dcd0a06ce4a3..5d7c7839fbc9b6 100644
--- a/React/Views/RCTViewManager.m
+++ b/React/Views/RCTViewManager.m
@@ -261,7 +261,7 @@ - (RCTShadowView *)shadowView
RCT_CUSTOM_VIEW_PROPERTY(borderColor, CGColor, RCTView)
{
if ([view respondsToSelector:@selector(setBorderColor:)]) {
- view.borderColor = json ? [RCTConvert CGColor:json] : defaultView.borderColor;
+ view.borderColor = json ? [RCTConvert UIColor:json] : defaultView.borderColor;
} else {
view.layer.borderColor = json ? [RCTConvert CGColor:json] : defaultView.layer.borderColor;
}
@@ -303,7 +303,7 @@ - (RCTShadowView *)shadowView
RCT_CUSTOM_VIEW_PROPERTY(border##SIDE##Color, UIColor, RCTView) \
{ \
if ([view respondsToSelector:@selector(setBorder##SIDE##Color:)]) { \
- view.border##SIDE##Color = json ? [RCTConvert CGColor:json] : defaultView.border##SIDE##Color; \
+ view.border##SIDE##Color = json ? [RCTConvert UIColor:json] : defaultView.border##SIDE##Color; \
} \
}
diff --git a/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js b/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js
index ebed5b1fdfa1ef..9cf616184f46f4 100644
--- a/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js
+++ b/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js
@@ -236,6 +236,20 @@ function DynamicColorsExample() {
}}
/>
+
+
+ DynamicColorIOS({'{\n'}
+ {' '}light: 'red', dark: 'blue'{'\n'}
+ {'}'})
+
+
+
DynamicColorIOS({'{\n'}