Skip to content
Permalink
Browse files
feat: add custom color for iOS13 segmented control (#27643)
Summary:
Addresses Issue from react-native-segmented-control/segmented-control#16

SegmentedControlIOS changed how it looks in iOS13.

This PR allows allows more customization of SegmentedControl for iOS13.

## Changelog

[iOS] [Added] - add textColor and backgroundColor props for iOS >=13
Pull Request resolved: #27643

Test Plan:
| Before | After |
| --- | --- |
| <img src="https://user-images.githubusercontent.com/6936373/71608475-e68ff580-2bc4-11ea-9fe4-b85b99130356.png" width="320" /> | <img src="https://user-images.githubusercontent.com/6936373/71608757-dc6ef680-2bc6-11ea-85be-aa31f25ecf36.png" width="320" /> |

Differential Revision: D19296783

Pulled By: cpojer

fbshipit-source-id: 81a31b2d5ae3085a6fd1874e7d72e75be4c51318
  • Loading branch information
Naturalclar authored and facebook-github-bot committed Jan 7, 2020
1 parent ff9def4 commit e8f577e541815bfd8adebdf14f70c9e4205f8e4e
Show file tree
Hide file tree
Showing 5 changed files with 33 additions and 0 deletions.
@@ -33,6 +33,8 @@ type NativeProps = $ReadOnly<{|
selectedIndex?: WithDefault<Int32, 0>,
enabled?: WithDefault<boolean, true>,
tintColor?: ?ColorValue,
textColor?: ?ColorValue,
backgroundColor?: ?ColorValue,
momentary?: WithDefault<boolean, false>,

// Events
@@ -39,6 +39,27 @@ - (void)setSelectedIndex:(NSInteger)selectedIndex
super.selectedSegmentIndex = selectedIndex;
}

- (void)setBackgroundColor:(UIColor *)backgroundColor
{
#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \
__IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0
if (@available(iOS 13.0, *)) {
[super setBackgroundColor:backgroundColor];
}
#endif
}

- (void)setTextColor:(UIColor *)textColor
{
#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \
__IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0
if (@available(iOS 13.0, *)) {
[self setTitleTextAttributes:@{NSForegroundColorAttributeName: textColor}
forState:UIControlStateNormal];
}
#endif
}

- (void)setTintColor:(UIColor *)tintColor
{
[super setTintColor:tintColor];
@@ -23,6 +23,8 @@ - (UIView *)view
RCT_EXPORT_VIEW_PROPERTY(values, NSArray<NSString *>)
RCT_EXPORT_VIEW_PROPERTY(selectedIndex, NSInteger)
RCT_EXPORT_VIEW_PROPERTY(tintColor, UIColor)
RCT_EXPORT_VIEW_PROPERTY(backgroundColor, UIColor)
RCT_EXPORT_VIEW_PROPERTY(textColor, UIColor)
RCT_EXPORT_VIEW_PROPERTY(momentary, BOOL)
RCT_EXPORT_VIEW_PROPERTY(enabled, BOOL)
RCT_EXPORT_VIEW_PROPERTY(onChange, RCTBubblingEventBlock)
@@ -35,6 +35,12 @@ public void setProperty(T view, String propName, @Nullable Object value) {
case "tintColor":
mViewManager.setTintColor(view, value == null ? null : ((Double) value).intValue());
break;
case "textColor":
mViewManager.setTextColor(view, value == null ? null : ((Double) value).intValue());
break;
case "backgroundColor":
mViewManager.setBackgroundColor(view, value == null ? null : ((Double) value).intValue());
break;
case "momentary":
mViewManager.setMomentary(view, value == null ? false : (boolean) value);
break;
@@ -18,5 +18,7 @@
void setSelectedIndex(T view, int value);
void setEnabled(T view, boolean value);
void setTintColor(T view, @Nullable Integer value);
void setTextColor(T view, @Nullable Integer value);
void setBackgroundColor(T view, @Nullable Integer value);
void setMomentary(T view, boolean value);
}

0 comments on commit e8f577e

Please sign in to comment.