Fabric: Data model of Touch Events
Summary: The data model of Touch events and payload serialization. The implementation mimics W3C standard and current React Native implementation. Reviewed By: fkgozali Differential Revision: D8246711 fbshipit-source-id: 955b2068674f290d8bdb82da1ebfb796dd32971b
This commit is contained in:
Родитель
bb9bf26169
Коммит
d01290dd34
|
@ -38,5 +38,54 @@ void ViewEventHandlers::onLayout(const LayoutMetrics &layoutMetrics) const {
|
|||
dispatchEvent("layout", payload);
|
||||
}
|
||||
|
||||
#pragma mark - Touches
|
||||
|
||||
static folly::dynamic touchPayload(const Touch &touch) {
|
||||
folly::dynamic object = folly::dynamic::object();
|
||||
object["locationX"] = touch.offsetPoint.x;
|
||||
object["locationY"] = touch.offsetPoint.x;
|
||||
object["pageX"] = touch.pagePoint.x;
|
||||
object["pageY"] = touch.pagePoint.x;
|
||||
object["screenX"] = touch.screenPoint.x;
|
||||
object["screenY"] = touch.screenPoint.x;
|
||||
object["identifier"] = touch.identifier;
|
||||
object["target"] = touch.target;
|
||||
object["timestamp"] = touch.timestamp * 1000;
|
||||
object["force"] = touch.force;
|
||||
return object;
|
||||
}
|
||||
|
||||
static folly::dynamic touchesPayload(const Touches &touches) {
|
||||
folly::dynamic array = folly::dynamic::array();
|
||||
for (auto &&touch : touches) {
|
||||
array.push_back(touchPayload(touch));
|
||||
}
|
||||
return array;
|
||||
}
|
||||
|
||||
static folly::dynamic touchEventPayload(const TouchEvent &event) {
|
||||
folly::dynamic object = folly::dynamic::object();
|
||||
object["touches"] = touchesPayload(event.touches);
|
||||
object["changedTouches"] = touchesPayload(event.changedTouches);
|
||||
object["targetTouches"] = touchesPayload(event.targetTouches);
|
||||
return object;
|
||||
}
|
||||
|
||||
void ViewEventHandlers::onTouchStart(const TouchEvent &event) const {
|
||||
dispatchEvent("touchStart", touchEventPayload(event));
|
||||
}
|
||||
|
||||
void ViewEventHandlers::onTouchMove(const TouchEvent &event) const {
|
||||
dispatchEvent("touchMove", touchEventPayload(event));
|
||||
}
|
||||
|
||||
void ViewEventHandlers::onTouchEnd(const TouchEvent &event) const {
|
||||
dispatchEvent("touchEnd", touchEventPayload(event));
|
||||
}
|
||||
|
||||
void ViewEventHandlers::onTouchCancel(const TouchEvent &event) const {
|
||||
dispatchEvent("touchCancel", touchEventPayload(event));
|
||||
}
|
||||
|
||||
} // namespace react
|
||||
} // namespace facebook
|
||||
|
|
|
@ -10,10 +10,93 @@
|
|||
|
||||
#include <fabric/core/EventHandlers.h>
|
||||
#include <fabric/core/LayoutMetrics.h>
|
||||
#include <fabric/core/ReactPrimitives.h>
|
||||
|
||||
namespace facebook {
|
||||
namespace react {
|
||||
|
||||
/*
|
||||
* Describes an individual touch point for a touch event.
|
||||
* See https://www.w3.org/TR/touch-events/ for more details.
|
||||
*/
|
||||
struct Touch {
|
||||
/*
|
||||
* The coordinate of point relative to the root component in points.
|
||||
*/
|
||||
Point pagePoint;
|
||||
|
||||
/*
|
||||
* The coordinate of point relative to the target component in points.
|
||||
*/
|
||||
Point offsetPoint;
|
||||
|
||||
/*
|
||||
* The coordinate of point relative to the screen component in points.
|
||||
*/
|
||||
Point screenPoint;
|
||||
|
||||
/*
|
||||
* An identification number for each touch point.
|
||||
*/
|
||||
int identifier;
|
||||
|
||||
/*
|
||||
* The tag of a component on which the touch point started when it was first placed on the surface,
|
||||
* even if the touch point has since moved outside the interactive area of that element.
|
||||
*/
|
||||
Tag target;
|
||||
|
||||
/*
|
||||
* The force of the touch.
|
||||
*/
|
||||
Float force;
|
||||
|
||||
/*
|
||||
* The time in seconds when the touch occurred or when it was last mutated.
|
||||
*/
|
||||
Float timestamp;
|
||||
|
||||
/*
|
||||
* The particular implementation of `Hasher` and (especially) `Comparator`
|
||||
* make sense only when `Touch` object is used as a *key* in indexed collections.
|
||||
* Because of that they are expressed as separate classes.
|
||||
*/
|
||||
struct Hasher {
|
||||
size_t operator()(const Touch &touch) const {
|
||||
return std::hash<decltype(touch.identifier)>()(touch.identifier);
|
||||
}
|
||||
};
|
||||
|
||||
struct Comparator {
|
||||
bool operator()(const Touch &lhs, const Touch &rhs) const {
|
||||
return lhs.identifier == rhs.identifier;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
using Touches = std::unordered_set<Touch, Touch::Hasher, Touch::Comparator>;
|
||||
|
||||
/*
|
||||
* Defines the `touchstart`, `touchend`, `touchmove`, and `touchcancel` event types.
|
||||
*/
|
||||
struct TouchEvent {
|
||||
/*
|
||||
* A list of Touches for every point of contact currently touching the surface.
|
||||
*/
|
||||
Touches touches;
|
||||
|
||||
/*
|
||||
* A list of Touches for every point of contact which contributed to the event.
|
||||
*/
|
||||
Touches changedTouches;
|
||||
|
||||
/*
|
||||
* A list of Touches for every point of contact that is touching the surface
|
||||
* and started on the element that is the target of the current event.
|
||||
*/
|
||||
Touches targetTouches;
|
||||
};
|
||||
|
||||
class ViewEventHandlers;
|
||||
|
||||
using SharedViewEventHandlers = std::shared_ptr<const ViewEventHandlers>;
|
||||
|
@ -34,6 +117,13 @@ public:
|
|||
#pragma mark - Layout
|
||||
|
||||
void onLayout(const LayoutMetrics &layoutMetrics) const;
|
||||
|
||||
#pragma mark - Touches
|
||||
|
||||
void onTouchStart(const TouchEvent &event) const;
|
||||
void onTouchMove(const TouchEvent &event) const;
|
||||
void onTouchEnd(const TouchEvent &event) const;
|
||||
void onTouchCancel(const TouchEvent &event) const;
|
||||
};
|
||||
|
||||
} // namespace react
|
||||
|
|
Загрузка…
Ссылка в новой задаче