diff --git a/samples/RXPTest/src/Tests/ViewTouchTest.tsx b/samples/RXPTest/src/Tests/ViewTouchTest.tsx index de9590664..5e8f7c665 100644 --- a/samples/RXPTest/src/Tests/ViewTouchTest.tsx +++ b/samples/RXPTest/src/Tests/ViewTouchTest.tsx @@ -46,6 +46,14 @@ const _styles = { backgroundColor: '#eee', borderColor: 'black', }), + testContainer4: RX.Styles.createViewStyle({ + flex: 1, + height: 150, + margin: 20, + borderWidth: 1, + backgroundColor: '#eee', + borderColor: 'black', + }), success: RX.Styles.createViewStyle({ borderWidth: 2, backgroundColor: 'green' @@ -59,6 +67,10 @@ interface TouchViewState { view3TouchResponderTestStart: boolean; view3TouchResponderTestGrant: boolean; view3TouchResponderTestRelease: boolean; + touchPositionOnPage: { + x: number | null + y: number | null + }; nestedViewTouchTestParent: boolean; nestedViewTouchTestChild: boolean; pressEvent?: RX.Types.TouchEvent; @@ -75,6 +87,10 @@ class ViewTouch extends RX.Component { view3TouchResponderTestStart: false, view3TouchResponderTestGrant: false, view3TouchResponderTestRelease: false, + touchPositionOnPage: { + x: null, + y: null + }, nestedViewTouchTestParent: false, nestedViewTouchTestChild: false, }; @@ -83,7 +99,7 @@ class ViewTouch extends RX.Component { private static getTouchEventText(touchEvent?: RX.Types.TouchEvent): string { if (touchEvent) { return 'altKey = ' + touchEvent.altKey + - ' changedTouches.length = ' + touchEvent.changedTouches.length + + ' changedTouches.length = ' + (touchEvent.changedTouches && touchEvent.changedTouches.length) + ' ctrlKey = ' + touchEvent.ctrlKey + ' metaKey = ' + touchEvent.metaKey + ' shiftKey = ' + touchEvent.shiftKey + @@ -171,6 +187,27 @@ class ViewTouch extends RX.Component { }} /> + + + { 'When touching this view, it will display the page coordinates of the touch position.' } + + + { + const touch = e.touches[0]; + if (touch) { + this.setState({ touchPositionOnPage: { + x: Math.round(touch.pageX), + y: Math.round(touch.pageY) + }}); + } + }} + > + + { `Touch position on page: x: ${this.state.touchPositionOnPage.x} y: ${this.state.touchPositionOnPage.y}`} + + ); } diff --git a/src/web/View.tsx b/src/web/View.tsx index f5b2b4bcc..99a170447 100644 --- a/src/web/View.tsx +++ b/src/web/View.tsx @@ -357,6 +357,8 @@ export class View extends ViewBase['onTouchMove'], draggable: this.props.onDragStart ? true : undefined, onDragStart: this.props.onDragStart, onDrag: this.props.onDrag,