diff --git a/Libraries/Components/Touchable/Touchable.js b/Libraries/Components/Touchable/Touchable.js index 5383de2da..e7925e63c 100644 --- a/Libraries/Components/Touchable/Touchable.js +++ b/Libraries/Components/Touchable/Touchable.js @@ -17,7 +17,6 @@ const React = require('React'); const ReactNative = require('ReactNative'); const StyleSheet = require('StyleSheet'); const TVEventHandler = require('TVEventHandler'); -const TouchEventUtils = require('fbjs/lib/TouchEventUtils'); const UIManager = require('UIManager'); const View = require('View'); @@ -27,6 +26,19 @@ const normalizeColor = require('normalizeColor'); import type {PressEvent} from 'CoreEventTypes'; import type {EdgeInsetsProp} from 'EdgeInsetsPropType'; +const extractSingleTouch = nativeEvent => { + const touches = nativeEvent.touches; + const changedTouches = nativeEvent.changedTouches; + const hasTouches = touches && touches.length > 0; + const hasChangedTouches = changedTouches && changedTouches.length > 0; + + return !hasTouches && hasChangedTouches + ? changedTouches[0] + : hasTouches + ? touches[0] + : nativeEvent; +}; + /** * `Touchable`: Taps done right. * @@ -526,7 +538,7 @@ const TouchableMixin = { pressExpandBottom += hitSlop.bottom; } - const touch = TouchEventUtils.extractSingleTouch(e.nativeEvent); + const touch = extractSingleTouch(e.nativeEvent); const pageX = touch && touch.pageX; const pageY = touch && touch.pageY; @@ -779,7 +791,7 @@ const TouchableMixin = { }, _savePressInLocation: function(e: PressEvent) { - const touch = TouchEventUtils.extractSingleTouch(e.nativeEvent); + const touch = extractSingleTouch(e.nativeEvent); const pageX = touch && touch.pageX; const pageY = touch && touch.pageY; const locationX = touch && touch.locationX; diff --git a/ReactAndroid/src/androidTest/js/MultitouchHandlingTestAppModule.js b/ReactAndroid/src/androidTest/js/MultitouchHandlingTestAppModule.js index 61e0824c1..1eeebc78a 100644 --- a/ReactAndroid/src/androidTest/js/MultitouchHandlingTestAppModule.js +++ b/ReactAndroid/src/androidTest/js/MultitouchHandlingTestAppModule.js @@ -12,21 +12,33 @@ const React = require('React'); const Recording = require('NativeModules').Recording; const StyleSheet = require('StyleSheet'); -const TouchEventUtils = require('fbjs/lib/TouchEventUtils'); const View = require('View'); +const extractSingleTouch = nativeEvent => { + const touches = nativeEvent.touches; + const changedTouches = nativeEvent.changedTouches; + const hasTouches = touches && touches.length > 0; + const hasChangedTouches = changedTouches && changedTouches.length > 0; + + return !hasTouches && hasChangedTouches + ? changedTouches[0] + : hasTouches + ? touches[0] + : nativeEvent; +}; + class TouchTestApp extends React.Component { handleStartShouldSetResponder = e => { return true; }; handleOnResponderMove = e => { - e = TouchEventUtils.extractSingleTouch(e.nativeEvent); + e = extractSingleTouch(e.nativeEvent); Recording.record('move;' + e.touches.length); }; handleResponderStart = e => { - e = TouchEventUtils.extractSingleTouch(e.nativeEvent); + e = extractSingleTouch(e.nativeEvent); if (e.touches) { Recording.record('start;' + e.touches.length); } else { @@ -35,7 +47,7 @@ class TouchTestApp extends React.Component { }; handleResponderEnd = e => { - e = TouchEventUtils.extractSingleTouch(e.nativeEvent); + e = extractSingleTouch(e.nativeEvent); if (e.touches) { Recording.record('end;' + e.touches.length); } else {