diff --git a/Libraries/Components/SliderIOS/SliderIOS.ios.js b/Libraries/Components/SliderIOS/SliderIOS.ios.js index acc0ea842..a23fb5c45 100644 --- a/Libraries/Components/SliderIOS/SliderIOS.ios.js +++ b/Libraries/Components/SliderIOS/SliderIOS.ios.js @@ -11,6 +11,7 @@ */ 'use strict'; +var Image = require('Image'); var NativeMethodsMixin = require('NativeMethodsMixin'); var PropTypes = require('ReactPropTypes'); var React = require('React'); @@ -76,6 +77,11 @@ var SliderIOS = React.createClass({ */ disabled: PropTypes.bool, + /** + * Sets an image for the track. It only supports images that are included as assets + */ + trackImage: 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 38e471cde..0c2269ce8 100644 --- a/React/Views/RCTSlider.h +++ b/React/Views/RCTSlider.h @@ -19,4 +19,6 @@ @property (nonatomic, assign) float step; @property (nonatomic, assign) float lastValue; +@property (nonatomic, strong) UIImage *trackImage; + @end diff --git a/React/Views/RCTSlider.m b/React/Views/RCTSlider.m index 04e8d841e..0886c8e20 100644 --- a/React/Views/RCTSlider.m +++ b/React/Views/RCTSlider.m @@ -32,4 +32,19 @@ super.value = _unclippedValue; } +- (void)setTrackImage:(UIImage *)trackImage +{ + if (trackImage != _trackImage) { + _trackImage = trackImage; + + CGFloat width = trackImage.size.width; + + UIImage *minimumTrackImage = [trackImage resizableImageWithCapInsets:(UIEdgeInsets){0, width, 0, 0}]; + UIImage *maximumTrackImage = [trackImage resizableImageWithCapInsets:(UIEdgeInsets){0, 0, 0, width}]; + + [super setMinimumTrackImage:minimumTrackImage forState:UIControlStateNormal]; + [super setMaximumTrackImage:maximumTrackImage forState:UIControlStateNormal]; + } +} + @end diff --git a/React/Views/RCTSliderManager.m b/React/Views/RCTSliderManager.m index bef916c16..92eb4b7c4 100644 --- a/React/Views/RCTSliderManager.m +++ b/React/Views/RCTSliderManager.m @@ -76,6 +76,7 @@ static void RCTSendSliderEvent(RCTSlider *sender, BOOL continuous) RCT_EXPORT_VIEW_PROPERTY(value, float); RCT_EXPORT_VIEW_PROPERTY(step, float); +RCT_EXPORT_VIEW_PROPERTY(trackImage, UIImage); RCT_EXPORT_VIEW_PROPERTY(minimumValue, float); RCT_EXPORT_VIEW_PROPERTY(maximumValue, float); RCT_EXPORT_VIEW_PROPERTY(minimumTrackTintColor, UIColor);