diff --git a/React/Fabric/RCTSurfaceTouchHandler.mm b/React/Fabric/RCTSurfaceTouchHandler.mm index 68bee422a62f94..9c6e7c8946ebf8 100644 --- a/React/Fabric/RCTSurfaceTouchHandler.mm +++ b/React/Fabric/RCTSurfaceTouchHandler.mm @@ -63,6 +63,11 @@ typedef NS_ENUM(NSInteger, RCTTouchEventType) { */ UITouchType touchType; + /* + * The radius (in points) of the touch. + */ + CGFloat majorRadius; + /* * A component view on which the touch was begun. */ @@ -105,6 +110,7 @@ static void UpdateActiveTouchWithUITouch( } activeTouch.touchType = uiTouch.type; + activeTouch.majorRadius = uiTouch.majorRadius; } static ActiveTouch CreateTouchWithUITouch(UITouch *uiTouch, UIView *rootComponentView, CGPoint rootViewOriginOffset) @@ -180,6 +186,17 @@ static PointerEvent CreatePointerEventFromActiveTouch(ActiveTouch activeTouch) event.pressure = touch.force; event.pointerType = PointerTypeCStringFromUITouchType(activeTouch.touchType); event.clientPoint = touch.pagePoint; + + CGFloat pointerSize = activeTouch.majorRadius * 2.0; + if (@available(iOS 13.4, *)) { + if (activeTouch.touchType == UITouchTypeIndirectPointer) { + // mouse type pointers should always report a size of 1 + pointerSize = 1.0; + } + } + event.width = pointerSize; + event.height = pointerSize; + return event; } @@ -194,6 +211,8 @@ static PointerEvent CreatePointerEventFromActiveTouch(ActiveTouch activeTouch) event.pressure = 0.0; event.pointerType = "mouse"; event.clientPoint = RCTPointFromCGPoint(clientLocation); + event.width = 1.0; + event.height = 1.0; return event; } diff --git a/ReactCommon/react/renderer/components/view/PointerEvent.cpp b/ReactCommon/react/renderer/components/view/PointerEvent.cpp index 6e9ec3ed1d6c4b..2b0f1ba1033def 100644 --- a/ReactCommon/react/renderer/components/view/PointerEvent.cpp +++ b/ReactCommon/react/renderer/components/view/PointerEvent.cpp @@ -24,6 +24,8 @@ std::vector getDebugProps( {"pressure", getDebugDescription(pointerEvent.pressure, options)}, {"pointerType", getDebugDescription(pointerEvent.pointerType, options)}, {"clientPoint", getDebugDescription(pointerEvent.clientPoint, options)}, + {"width", getDebugDescription(pointerEvent.width, options)}, + {"height", getDebugDescription(pointerEvent.height, options)}, }; } diff --git a/ReactCommon/react/renderer/components/view/PointerEvent.h b/ReactCommon/react/renderer/components/view/PointerEvent.h index a62e8ac530e455..0fdfe4e89c7501 100644 --- a/ReactCommon/react/renderer/components/view/PointerEvent.h +++ b/ReactCommon/react/renderer/components/view/PointerEvent.h @@ -34,6 +34,16 @@ struct PointerEvent { * opposed to the coordinate within the page). */ Point clientPoint; + /* + * The width (magnitude on the X axis), in CSS pixels, of the contact geometry + * of the pointer + */ + Float width; + /* + * The height (magnitude on the y axis), in CSS pixels, of the contact + * geometry of the pointer + */ + Float height; }; #if RN_DEBUG_STRING_CONVERTIBLE diff --git a/ReactCommon/react/renderer/components/view/TouchEventEmitter.cpp b/ReactCommon/react/renderer/components/view/TouchEventEmitter.cpp index 35ed17a1abb749..f63b5a297ae907 100644 --- a/ReactCommon/react/renderer/components/view/TouchEventEmitter.cpp +++ b/ReactCommon/react/renderer/components/view/TouchEventEmitter.cpp @@ -68,6 +68,8 @@ static jsi::Value pointerEventPayload( object.setProperty(runtime, "pointerType", event.pointerType); object.setProperty(runtime, "clientX", event.clientPoint.x); object.setProperty(runtime, "clientY", event.clientPoint.y); + object.setProperty(runtime, "width", event.width); + object.setProperty(runtime, "height", event.height); return object; }