diff --git a/src/Slider.js b/src/Slider.js
index 552af3b6..7174a159 100644
--- a/src/Slider.js
+++ b/src/Slider.js
@@ -1,6 +1,15 @@
import React, { PureComponent } from 'react';
-import { Animated, Image, StyleSheet, PanResponder, View, Easing, ViewPropTypes, I18nManager } from 'react-native';
+import {
+ Animated,
+ Image,
+ StyleSheet,
+ PanResponder,
+ View,
+ Easing,
+ ViewPropTypes,
+ I18nManager,
+} from 'react-native';
import PropTypes from 'prop-types';
@@ -14,8 +23,13 @@ function Rect(x, y, width, height) {
this.height = height;
}
-Rect.prototype.containsPoint = function (x, y) {
- return x >= this.x && y >= this.y && x <= this.x + this.width && y <= this.y + this.height;
+Rect.prototype.containsPoint = function(x, y) {
+ return (
+ x >= this.x &&
+ y >= this.y &&
+ x <= this.x + this.width &&
+ y <= this.y + this.height
+ );
};
const DEFAULT_ANIMATION_CONFIGS = {
@@ -92,7 +106,10 @@ export default class Slider extends PureComponent {
* to move it easily.
* The default is {width: 40, height: 40}.
*/
- thumbTouchSize: PropTypes.shape({ width: PropTypes.number, height: PropTypes.number }),
+ thumbTouchSize: PropTypes.shape({
+ width: PropTypes.number,
+ height: PropTypes.number,
+ }),
/**
* Callback continuously called while the user is dragging the slider.
@@ -213,7 +230,11 @@ export default class Slider extends PureComponent {
...other
} = this.props;
const {
- value, containerSize, trackSize, thumbSize, allMeasured,
+ value,
+ containerSize,
+ trackSize,
+ thumbSize,
+ allMeasured,
} = this.state;
const mainStyles = styles || defaultStyles;
const thumbLeft = value.interpolate({
@@ -243,13 +264,24 @@ export default class Slider extends PureComponent {
const touchOverflowStyle = this._getTouchOverflowStyle();
return (
-
+
-
+
- {debugTouchArea === true && this._renderDebugThumbTouchRect(minimumTrackWidth)}
+ {debugTouchArea === true &&
+ this._renderDebugThumbTouchRect(minimumTrackWidth)}
);
@@ -291,7 +324,9 @@ export default class Slider extends PureComponent {
return otherProps;
}
- _handleStartShouldSetPanResponder = (e: Object /* gestureState: Object */): boolean =>
+ _handleStartShouldSetPanResponder = (
+ e: Object /* gestureState: Object */,
+ ): boolean =>
// Should we become active when the user presses down on the thumb?
this._thumbHitTest(e);
@@ -346,7 +381,11 @@ export default class Slider extends PureComponent {
const storeName = `_${name}`;
const currentSize = this[storeName];
- if (currentSize && width === currentSize.width && height === currentSize.height) {
+ if (
+ currentSize &&
+ width === currentSize.width &&
+ height === currentSize.height
+ ) {
return;
}
this[storeName] = size;
@@ -362,12 +401,15 @@ export default class Slider extends PureComponent {
};
_getRatio = (value: number) =>
- (value - this.props.minimumValue) / (this.props.maximumValue - this.props.minimumValue);
+ (value - this.props.minimumValue) /
+ (this.props.maximumValue - this.props.minimumValue);
_getThumbLeft = (value: number) => {
const nonRtlRatio = this._getRatio(value);
const ratio = I18nManager.isRTL ? 1 - nonRtlRatio : nonRtlRatio;
- return ratio * (this.state.containerSize.width - this.state.thumbSize.width);
+ return (
+ ratio * (this.state.containerSize.width - this.state.thumbSize.width)
+ );
};
_getValue = (gestureState: Object) => {
@@ -383,7 +425,12 @@ export default class Slider extends PureComponent {
Math.min(
this.props.maximumValue,
this.props.minimumValue +
- Math.round(ratio * (this.props.maximumValue - this.props.minimumValue) / this.props.step) * this.props.step,
+ Math.round(
+ ratio *
+ (this.props.maximumValue - this.props.minimumValue) /
+ this.props.step,
+ ) *
+ this.props.step,
),
);
}
@@ -391,7 +438,8 @@ export default class Slider extends PureComponent {
this.props.minimumValue,
Math.min(
this.props.maximumValue,
- ratio * (this.props.maximumValue - this.props.minimumValue) + this.props.minimumValue,
+ ratio * (this.props.maximumValue - this.props.minimumValue) +
+ this.props.minimumValue,
),
);
};
@@ -404,14 +452,19 @@ export default class Slider extends PureComponent {
_setCurrentValueAnimated = (value: number) => {
const animationType = this.props.animationType;
- const animationConfig = Object.assign({}, DEFAULT_ANIMATION_CONFIGS[animationType], this.props.animationConfig, {
- toValue: value,
- });
+ const animationConfig = Object.assign(
+ {},
+ DEFAULT_ANIMATION_CONFIGS[animationType],
+ this.props.animationConfig,
+ {
+ toValue: value,
+ },
+ );
Animated[animationType](this.state.value, animationConfig).start();
};
- _fireChangeEvent = (event) => {
+ _fireChangeEvent = event => {
if (this.props[event]) {
this.props[event](this._getCurrentValue());
}
@@ -423,8 +476,14 @@ export default class Slider extends PureComponent {
const size = {};
if (state.allMeasured === true) {
- size.width = Math.max(0, props.thumbTouchSize.width - state.thumbSize.width);
- size.height = Math.max(0, props.thumbTouchSize.height - state.containerSize.height);
+ size.width = Math.max(
+ 0,
+ props.thumbTouchSize.width - state.thumbSize.width,
+ );
+ size.height = Math.max(
+ 0,
+ props.thumbTouchSize.height - state.containerSize.height,
+ );
}
return size;
@@ -455,7 +514,10 @@ export default class Slider extends PureComponent {
_thumbHitTest = (e: Object) => {
const nativeEvent = e.nativeEvent;
const thumbTouchRect = this._getThumbTouchRect();
- return thumbTouchRect.containsPoint(nativeEvent.locationX, nativeEvent.locationY);
+ return thumbTouchRect.containsPoint(
+ nativeEvent.locationX,
+ nativeEvent.locationY,
+ );
};
_getThumbTouchRect = () => {
@@ -467,13 +529,14 @@ export default class Slider extends PureComponent {
touchOverflowSize.width / 2 +
this._getThumbLeft(this._getCurrentValue()) +
(state.thumbSize.width - props.thumbTouchSize.width) / 2,
- touchOverflowSize.height / 2 + (state.containerSize.height - props.thumbTouchSize.height) / 2,
+ touchOverflowSize.height / 2 +
+ (state.containerSize.height - props.thumbTouchSize.height) / 2,
props.thumbTouchSize.width,
props.thumbTouchSize.height,
);
};
- _renderDebugThumbTouchRect = (thumbLeft) => {
+ _renderDebugThumbTouchRect = thumbLeft => {
const thumbTouchRect = this._getThumbTouchRect();
const positionStyle = {
left: thumbLeft,
@@ -482,7 +545,12 @@ export default class Slider extends PureComponent {
height: thumbTouchRect.height,
};
- return ;
+ return (
+
+ );
};
_renderThumbImage = () => {