diff --git a/src/components/Touchable/TouchableHighlight.js b/src/components/Touchable/TouchableHighlight.js index 12e4f93b..948e9646 100644 --- a/src/components/Touchable/TouchableHighlight.js +++ b/src/components/Touchable/TouchableHighlight.js @@ -263,7 +263,7 @@ const TouchableHighlight = createReactClass({ onResponderTerminationRequest={this.touchableHandleResponderTerminationRequest} onStartShouldSetResponder={this.touchableHandleStartShouldSetResponder} ref={this._setUnderlayRef} - style={[styles.root, this.props.disabled && styles.disabled, this.state.underlayStyle]} + style={[styles.root, !this.props.disabled && styles.actionable, this.state.underlayStyle]} > {React.cloneElement(React.Children.only(this.props.children), { ref: this._setChildRef @@ -283,11 +283,11 @@ const INACTIVE_UNDERLAY_PROPS = { const styles = StyleSheet.create({ root: { - cursor: 'pointer', userSelect: 'none' }, - disabled: { - cursor: 'default' + actionable: { + cursor: 'pointer', + touchAction: 'manipulate' } }); diff --git a/src/components/Touchable/TouchableOpacity.js b/src/components/Touchable/TouchableOpacity.js index 70f77165..99a7a6ce 100644 --- a/src/components/Touchable/TouchableOpacity.js +++ b/src/components/Touchable/TouchableOpacity.js @@ -187,7 +187,7 @@ const TouchableOpacity = createReactClass({ onResponderTerminate={this.touchableHandleResponderTerminate} onResponderTerminationRequest={this.touchableHandleResponderTerminationRequest} onStartShouldSetResponder={this.touchableHandleStartShouldSetResponder} - style={[styles.root, this.props.disabled && styles.disabled, this.props.style]} + style={[styles.root, !this.props.disabled && styles.actionable, this.props.style]} > {this.props.children} {Touchable.renderDebugView({ color: 'blue', hitSlop: this.props.hitSlop })} @@ -198,13 +198,13 @@ const TouchableOpacity = createReactClass({ const styles = StyleSheet.create({ root: { - cursor: 'pointer', transitionProperty: 'opacity', transitionDuration: '0.15s', userSelect: 'none' }, - disabled: { - cursor: 'default' + actionable: { + cursor: 'pointer', + touchAction: 'manipulate' } }); diff --git a/src/components/Touchable/TouchableWithoutFeedback.js b/src/components/Touchable/TouchableWithoutFeedback.js index 95c34c70..b6605acd 100644 --- a/src/components/Touchable/TouchableWithoutFeedback.js +++ b/src/components/Touchable/TouchableWithoutFeedback.js @@ -179,8 +179,8 @@ const TouchableWithoutFeedback = createReactClass({ } const style = Touchable.TOUCH_TARGET_DEBUG && child.type && child.type.displayName === 'Text' - ? [styles.root, this.props.disabled && styles.disabled, child.props.style, { color: 'red' }] - : [styles.root, this.props.disabled && styles.disabled, child.props.style]; + ? [!this.props.disabled && styles.actionable, child.props.style, { color: 'red' }] + : [!this.props.disabled && styles.actionable, child.props.style]; return (React: any).cloneElement(child, { ...other, accessible: this.props.accessible !== false, @@ -199,11 +199,9 @@ const TouchableWithoutFeedback = createReactClass({ }); const styles = StyleSheet.create({ - root: { - cursor: 'pointer' - }, - disabled: { - cursor: 'default' + actionable: { + cursor: 'pointer', + touchAction: 'manipulate' } });