diff --git a/Examples/UIExplorer/SliderIOSExample.js b/Examples/UIExplorer/SliderIOSExample.js index 245fe10ad57e7b..9b3c584db151c7 100644 --- a/Examples/UIExplorer/SliderIOSExample.js +++ b/Examples/UIExplorer/SliderIOSExample.js @@ -83,5 +83,11 @@ exports.examples = [ render(): ReactElement { return ; } + }, + { + title: 'Custom thumb image', + render(): ReactElement { + return ; + } } ]; diff --git a/Libraries/Components/SliderIOS/SliderIOS.ios.js b/Libraries/Components/SliderIOS/SliderIOS.ios.js index a23fb5c458f07a..e47e3a0d1009aa 100644 --- a/Libraries/Components/SliderIOS/SliderIOS.ios.js +++ b/Libraries/Components/SliderIOS/SliderIOS.ios.js @@ -82,6 +82,12 @@ var SliderIOS = React.createClass({ */ trackImage: Image.propTypes.source, + /** + * Sets an image for the thumb. It only supports static images. + */ + thumbImage: Image.propTypes.source, + + /** * Callback continuously called while the user is dragging the slider. */ diff --git a/React/Views/RCTSlider.h b/React/Views/RCTSlider.h index 0c2269ce8436a7..83e3d7eadfb1f7 100644 --- a/React/Views/RCTSlider.h +++ b/React/Views/RCTSlider.h @@ -20,5 +20,7 @@ @property (nonatomic, assign) float lastValue; @property (nonatomic, strong) UIImage *trackImage; +@property (nonatomic, strong) UIImage *thumbImage; + @end diff --git a/React/Views/RCTSlider.m b/React/Views/RCTSlider.m index 0886c8e20ef37a..2b34f1c2da3673 100644 --- a/React/Views/RCTSlider.m +++ b/React/Views/RCTSlider.m @@ -46,5 +46,13 @@ - (void)setTrackImage:(UIImage *)trackImage [super setMaximumTrackImage:maximumTrackImage forState:UIControlStateNormal]; } } +- (void)setThumbImage:(UIImage *) thumbImage +{ + if (thumbImage != _thumbImage) { + _thumbImage = thumbImage; + + [self setThumbImage:thumbImage forState:UIControlStateNormal]; + } +} @end diff --git a/React/Views/RCTSliderManager.m b/React/Views/RCTSliderManager.m index 92eb4b7c47094c..bdb89ab06f5182 100644 --- a/React/Views/RCTSliderManager.m +++ b/React/Views/RCTSliderManager.m @@ -83,6 +83,7 @@ - (void)sliderTouchEnd:(RCTSlider *)sender RCT_EXPORT_VIEW_PROPERTY(maximumTrackTintColor, UIColor); RCT_EXPORT_VIEW_PROPERTY(onValueChange, RCTBubblingEventBlock); RCT_EXPORT_VIEW_PROPERTY(onSlidingComplete, RCTBubblingEventBlock); +RCT_EXPORT_VIEW_PROPERTY(thumbImage, UIImage); RCT_CUSTOM_VIEW_PROPERTY(disabled, BOOL, RCTSlider) { if (json) {