kylefang/react-navigation
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-navigation.git synced 2026-05-10 05:09:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

Modal gestureEnabled (#1243)

Browse Source 
* Fix Modal Gestures

* Update StackNavigator.md for gesturesEnabled to include modals again

* Remove modal gesture todo

* Gesture response distance top, side => vertical, horizontal
This commit is contained in:
Dave Bennett
2017-04-26 13:55:25 +01:00
committed by Satyajit Sahoo
parent a14ac29c30
commit aa7fe56bb4
2 changed files with 15 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/api/navigators/StackNavigator.md
View File

@@ -138,7 +138,7 @@ Color for material ripple (Android >= 5.0 only)
#### `gesturesEnabled`
Whether you can use gestures to dismiss this screen. Defaults to true on iOS, false on Android. This value when set is only respected in `mode` == `card`.
Whether you can use gestures to dismiss this screen. Defaults to true on iOS, false on Android.
### Navigator Props

24
src/views/CardStack.js
View File

@@ -82,7 +82,8 @@ const RESPOND_THRESHOLD = 12;
/**
* The distance of touch start from the edge of the screen where the gesture will be recognized
*/
const GESTURE_RESPONSE_DISTANCE = 35;
const GESTURE_RESPONSE_DISTANCE_HORIZONTAL = 35;
const GESTURE_RESPONSE_DISTANCE_VERTICAL = 135;
const animatedSubscribeValue = (animatedValue: Animated.Value) => {
if (!animatedValue.__isNative) {
@@ -260,7 +261,7 @@ class CardStack extends Component {
if (index !== scene.index) {
return false;
}
const isVertical = false; // todo: bring back gestures for mode=modal
const isVertical = mode === 'modal';
const immediateIndex = this._immediateIndex == null
? index
: this._immediateIndex;
@@ -275,8 +276,12 @@ class CardStack extends Component {
// Measure the distance from the touch to the edge of the screen
const screenEdgeDistance = currentDragPosition - currentDragDistance;
// GESTURE_RESPONSE_DISTANCE is about 30 or 35
if (screenEdgeDistance > GESTURE_RESPONSE_DISTANCE) {
// Compare to the gesture distance relavant to card or modal
const gestureResponseDistance = isVertical
? GESTURE_RESPONSE_DISTANCE_VERTICAL
: GESTURE_RESPONSE_DISTANCE_HORIZONTAL;
// GESTURE_RESPONSE_DISTANCE is about 30 or 35. Or 135 for modals
if (screenEdgeDistance > gestureResponseDistance) {
// Reject touches that started in the middle of the screen
return false;
}
@@ -293,7 +298,7 @@ class CardStack extends Component {
onPanResponderMove: (event: any, gesture: any) => {
// Handle the moving touches for our granted responder
const layout = this.props.layout;
const isVertical = false;
const isVertical = mode === 'modal';
const startValue = this._gestureStartValue;
const axis = isVertical ? 'dy' : 'dx';
const distance = isVertical
@@ -314,7 +319,7 @@ class CardStack extends Component {
return;
}
this._isResponding = false;
const isVertical = false;
const isVertical = mode === 'modal';
const velocity = gesture[isVertical ? 'vy' : 'vx'];
const immediateIndex = this._immediateIndex == null
? index
@@ -345,10 +350,9 @@ class CardStack extends Component {
});
const { options } = this._getScreenDetails(scene);
const gesturesEnabled = mode === 'card' &&
(typeof options.gesturesEnabled === 'boolean'
? options.gesturesEnabled
: Platform.OS === 'ios');
const gesturesEnabled = typeof options.gesturesEnabled === 'boolean'
? options.gesturesEnabled
: Platform.OS === 'ios';
const handlers = gesturesEnabled ? responder.panHandlers : {};