From 5fb5148e3d8c0bc045692b7f8ce1ee75f2253544 Mon Sep 17 00:00:00 2001 From: Brent Vatne Date: Tue, 21 Apr 2015 10:50:10 -0700 Subject: [PATCH] [SliderIOS] Apply value after minimum/maximumValue in order to ensure it is properly set Summary: `value` is clamped between min/max and so order of prop application matters - `value` always ended up being set first in my tests, and consequently a value outside of the default range 0-1 would not work. So this applies the value when the min/max are set. [Gist of broken example](https://gist.github.com/brentvatne/fc637b3e21d012966f3a) ![screenshot](http://url.brentvatne.ca/SQPC.png) ^ the second slider here should have it's cursor in the middle /cc @tadeuzagallo Closes https://github.com/facebook/react-native/pull/835 Github Author: Brent Vatne Test Plan: Imported from GitHub, without a `Test Plan:` line. --- React/Views/RCTSlider.h | 14 ++++++++++++++ React/Views/RCTSlider.m | 35 ++++++++++++++++++++++++++++++++++ React/Views/RCTSliderManager.m | 20 +++++++++---------- 3 files changed, 59 insertions(+), 10 deletions(-) create mode 100644 React/Views/RCTSlider.h create mode 100644 React/Views/RCTSlider.m diff --git a/React/Views/RCTSlider.h b/React/Views/RCTSlider.h new file mode 100644 index 000000000..916419a29 --- /dev/null +++ b/React/Views/RCTSlider.h @@ -0,0 +1,14 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + */ + +#import + +@interface RCTSlider : UISlider + +@end diff --git a/React/Views/RCTSlider.m b/React/Views/RCTSlider.m new file mode 100644 index 000000000..04e8d841e --- /dev/null +++ b/React/Views/RCTSlider.m @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + */ + +#import "RCTSlider.h" + +@implementation RCTSlider +{ + float _unclippedValue; +} + +- (void)setValue:(float)value +{ + _unclippedValue = value; + super.value = value; +} + +- (void)setMinimumValue:(float)minimumValue +{ + super.minimumValue = minimumValue; + super.value = _unclippedValue; +} + +- (void)setMaximumValue:(float)maximumValue +{ + super.maximumValue = maximumValue; + super.value = _unclippedValue; +} + +@end diff --git a/React/Views/RCTSliderManager.m b/React/Views/RCTSliderManager.m index 58b763b92..a103da98d 100644 --- a/React/Views/RCTSliderManager.m +++ b/React/Views/RCTSliderManager.m @@ -11,6 +11,7 @@ #import "RCTBridge.h" #import "RCTEventDispatcher.h" +#import "RCTSlider.h" #import "UIView+React.h" @implementation RCTSliderManager @@ -19,32 +20,31 @@ RCT_EXPORT_MODULE() - (UIView *)view { - UISlider *slider = [[UISlider alloc] init]; + RCTSlider *slider = [[RCTSlider alloc] init]; [slider addTarget:self action:@selector(sliderValueChanged:) forControlEvents:UIControlEventValueChanged]; [slider addTarget:self action:@selector(sliderTouchEnd:) forControlEvents:UIControlEventTouchUpInside]; return slider; } -- (void)sliderValueChanged:(UISlider *)sender +static void RCTSendSliderEvent(RCTSliderManager *self, UISlider *sender, BOOL continuous) { NSDictionary *event = @{ @"target": sender.reactTag, @"value": @(sender.value), - @"continuous": @YES, + @"continuous": @(continuous), }; [self.bridge.eventDispatcher sendInputEventWithName:@"topChange" body:event]; } +- (void)sliderValueChanged:(UISlider *)sender +{ + RCTSendSliderEvent(self, sender, YES); +} + - (void)sliderTouchEnd:(UISlider *)sender { - NSDictionary *event = @{ - @"target": sender.reactTag, - @"value": @(sender.value), - @"continuous": @NO, - }; - - [self.bridge.eventDispatcher sendInputEventWithName:@"topChange" body:event]; + RCTSendSliderEvent(self, sender, NO); } RCT_EXPORT_VIEW_PROPERTY(value, float);