@react-native-oh-tpl/react-native-gesture-handler 2.14.8-rc.1 → 2.14.14

package/harmony/gesture_handler/src/main/ets/gesture-handlers/PinchGestureHandler.ts

@@ -0,0 +1,174 @@
+import {
+  GestureHandler,
+  DEFAULT_TOUCH_SLOP,
+  IncomingEvent,
+  GestureConfig,
+  State,
+  GestureHandlerDependencies
+} from "../core"
+import ScaleGestureDetector, { ScaleGestureListener } from "../detectors/ScaleGestureDetector";
+
+
+export class PinchGestureHandler extends GestureHandler {
+  private scale = 1;
+  private velocity = 0;
+
+  private startingSpan = 0;
+  private spanSlop = DEFAULT_TOUCH_SLOP;
+
+  private scaleDetectorListener: ScaleGestureListener = {
+    onScaleBegin: (detector: ScaleGestureDetector): boolean => {
+      this.startingSpan = detector.getCurrentSpan();
+      return true;
+    },
+    onScale: (detector: ScaleGestureDetector): boolean => {
+      const prevScaleFactor: number = this.scale;
+      this.scale *= detector.getScaleFactor(
+        this.tracker.getTrackedPointersCount()
+      );
+
+      const delta = detector.getTimeDelta();
+      if (delta > 0) {
+        this.velocity = (this.scale - prevScaleFactor) / delta;
+      }
+
+      if (
+        Math.abs(this.startingSpan - detector.getCurrentSpan()) >=
+        this.spanSlop &&
+          this.currentState === State.BEGAN
+      ) {
+        this.activate();
+      }
+      return true;
+    },
+    onScaleEnd: (
+      _detector: ScaleGestureDetector
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    ): void => {
+    },
+  };
+
+  private scaleGestureDetector: ScaleGestureDetector = new ScaleGestureDetector(
+    this.scaleDetectorListener
+  );
+
+
+  public constructor(deps: GestureHandlerDependencies) {
+    super({ ...deps, logger: deps.logger.cloneAndJoinPrefix("PinchGestureHandler") })
+    this.setShouldCancelWhenOutside(false);
+  }
+
+  public getName(): string {
+    return "PinchGestureHandler"
+  }
+
+  public override isGestureContinuous(): boolean {
+    return true
+  }
+
+  public getDefaultConfig() {
+    return {}
+  }
+
+  public updateGestureConfig({ enabled = true, ...props }: GestureConfig): void {
+    super.updateGestureConfig({ enabled: enabled, ...props });
+  }
+
+  protected transformNativeEvent() {
+    return {
+      focalX: this.scaleGestureDetector.getFocusX(),
+      focalY: this.scaleGestureDetector.getFocusY(),
+      velocity: this.velocity,
+      scale: this.scale,
+    };
+  }
+
+  public onPointerDown(event: IncomingEvent): void {
+    this.tracker.addToTracker(event);
+    super.onPointerDown(event);
+  }
+
+  public onAdditionalPointerAdd(event: IncomingEvent): void {
+    this.tracker.addToTracker(event);
+    super.onAdditionalPointerAdd(event);
+    this.tryBegin();
+    this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+  }
+
+  public onPointerUp(event: IncomingEvent): void {
+    super.onPointerUp(event);
+    this.tracker.removeFromTracker(event.pointerId);
+    if (this.currentState !== State.ACTIVE) {
+      return;
+    }
+    this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+
+    if (this.currentState === State.ACTIVE) {
+      this.end();
+    } else {
+      this.fail();
+    }
+  }
+
+  public onAdditionalPointerRemove(event: IncomingEvent): void {
+    super.onAdditionalPointerRemove(event);
+    this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+    this.tracker.removeFromTracker(event.pointerId);
+
+    if (
+      this.currentState === State.ACTIVE &&
+        this.tracker.getTrackedPointersCount() < 2
+    ) {
+      this.end();
+    }
+  }
+
+  public onPointerMove(event: IncomingEvent): void {
+    if (this.tracker.getTrackedPointersCount() < 2) {
+      return;
+    }
+    this.tracker.track(event);
+
+    this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+    super.onPointerMove(event);
+  }
+
+  public onPointerOutOfBounds(event: IncomingEvent): void {
+    if (this.tracker.getTrackedPointersCount() < 2) {
+      return;
+    }
+    this.tracker.track(event);
+
+    this.scaleGestureDetector.onTouchEvent(event, this.tracker);
+    super.onPointerOutOfBounds(event);
+  }
+
+  private tryBegin(): void {
+    if (this.currentState !== State.UNDETERMINED) {
+      return;
+    }
+
+    this.resetProgress();
+    this.begin();
+  }
+
+  public activate(force?: boolean): void {
+    if (this.currentState !== State.ACTIVE) {
+      this.resetProgress();
+    }
+
+    super.activate();
+  }
+
+  protected onReset(): void {
+    this.resetProgress();
+  }
+
+  protected resetProgress(): void {
+    if (this.currentState === State.ACTIVE) {
+      return;
+    }
+    this.velocity = 0;
+    this.scale = 1;
+  }
+}

package/harmony/gesture_handler/src/main/ets/gesture-handlers/RotationGestureHandler.ts

@@ -0,0 +1,172 @@
+import { GestureHandler, State, IncomingEvent, GestureConfig, GestureHandlerDependencies } from '../core';
+import RotationGestureDetector, { RotationGestureListener, } from './detectors/RotationGestureDetector';
+
+const ROTATION_RECOGNITION_THRESHOLD = Math.PI / 36;
+
+export class RotationGestureHandler extends GestureHandler {
+  private rotation = 0;
+  private velocity = 0;
+
+  private cachedAnchorX = 0;
+  private cachedAnchorY = 0;
+  private unlockScrolls: (() => void) | undefined
+
+  constructor(deps: GestureHandlerDependencies) {
+    super({ ...deps, logger: deps.logger.cloneAndJoinPrefix("RotationGestureHandler") })
+  }
+
+  public override getName(): string {
+    return "RotationGestureHandler"
+  }
+
+  public override isGestureContinuous(): boolean {
+    return true
+  }
+
+  private rotationGestureListener: RotationGestureListener = {
+    onRotationBegin: (_detector: RotationGestureDetector): boolean => true,
+    onRotation: (detector: RotationGestureDetector): boolean => {
+      const previousRotation: number = this.rotation;
+      this.rotation += detector.getRotation();
+
+      const delta = detector.getTimeDelta();
+
+      if (delta > 0) {
+        this.velocity = (this.rotation - previousRotation) / delta;
+      }
+
+      if (
+        Math.abs(this.rotation) >= ROTATION_RECOGNITION_THRESHOLD &&
+          this.currentState === State.BEGAN
+      ) {
+        this.activate();
+      }
+
+      return true;
+    },
+    onRotationEnd: (_detector: RotationGestureDetector): void => {
+      this.end();
+    },
+  };
+
+  private rotationGestureDetector: RotationGestureDetector =
+    new RotationGestureDetector(this.rotationGestureListener);
+
+  getDefaultConfig(): GestureConfig {
+    return { shouldCancelWhenOutside: false }
+  }
+
+  protected transformNativeEvent() {
+    return {
+      rotation: this.rotation ? this.rotation : 0,
+      anchorX: this.getAnchorX(),
+      anchorY: this.getAnchorY(),
+      velocity: this.velocity ? this.velocity : 0,
+    };
+  }
+
+  public getAnchorX(): number {
+    const anchorX = this.rotationGestureDetector.getAnchorX();
+
+    return anchorX ? anchorX : this.cachedAnchorX;
+  }
+
+  public getAnchorY(): number {
+    const anchorY = this.rotationGestureDetector.getAnchorY();
+
+    return anchorY ? anchorY : this.cachedAnchorY;
+  }
+
+  public onPointerDown(event: IncomingEvent): void {
+    this.tracker.addToTracker(event);
+    super.onPointerDown(event);
+  }
+
+  public onAdditionalPointerAdd(event: IncomingEvent): void {
+    this.tracker.addToTracker(event);
+    super.onAdditionalPointerAdd(event);
+    this.tryBegin();
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+  }
+
+  public onPointerMove(event: IncomingEvent): void {
+    if (this.tracker.getTrackedPointersCount() < 2) {
+      return;
+    }
+    if (this.getAnchorX()) {
+      this.cachedAnchorX = this.getAnchorX();
+    }
+    if (this.getAnchorY()) {
+      this.cachedAnchorY = this.getAnchorY();
+    }
+    this.tracker.track(event);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    super.onPointerMove(event);
+  }
+
+  public onPointerOutOfBounds(event: IncomingEvent): void {
+    if (this.tracker.getTrackedPointersCount() < 2) {
+      return;
+    }
+    if (this.getAnchorX()) {
+      this.cachedAnchorX = this.getAnchorX();
+    }
+    if (this.getAnchorY()) {
+      this.cachedAnchorY = this.getAnchorY();
+    }
+    this.tracker.track(event);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    super.onPointerOutOfBounds(event);
+  }
+
+  public onPointerUp(event: IncomingEvent): void {
+    super.onPointerUp(event);
+    this.tracker.removeFromTracker(event.pointerId);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    if (this.currentState !== State.ACTIVE) {
+      return;
+    }
+    if (this.currentState === State.ACTIVE) {
+      this.end();
+    } else {
+      this.fail();
+    }
+  }
+
+  public onAdditionalPointerRemove(event: IncomingEvent): void {
+    super.onAdditionalPointerRemove(event);
+    this.rotationGestureDetector.onTouchEvent(event, this.tracker);
+    this.tracker.removeFromTracker(event.pointerId);
+  }
+
+  protected tryBegin(): void {
+    if (this.currentState !== State.UNDETERMINED) {
+      return;
+    }
+
+    this.begin();
+  }
+
+  public activate(): void {
+    super.activate();
+  }
+
+  protected onReset(): void {
+    if (this.currentState === State.ACTIVE) {
+      return;
+    }
+
+    this.rotation = 0;
+    this.velocity = 0;
+    this.rotationGestureDetector.reset();
+  }
+
+  protected onStateChange(newState: State, oldState: State) {
+    super.onStateChange(newState, oldState)
+    if (newState === State.BEGAN) {
+      this.unlockScrolls = this.scrollLocker.lockScrollContainingViewTag(this.view?.getTag())
+    } else if (newState !== State.ACTIVE) {
+      this.unlockScrolls?.()
+    }
+  }
+}

package/harmony/gesture_handler/src/main/ets/gesture-handlers/TapGestureHandler.ts

@@ -0,0 +1,216 @@
+import { GestureHandler, GestureHandlerDependencies, IncomingEvent, EventType, State, getStateName } from "../core"
+
+const DEFAULT_MAX_DURATION_MS = 500;
+const DEFAULT_NUMBER_OF_TAPS = 1;
+const DEFAULT_MAX_DELAY_MS = 500;
+
+export class TapGestureHandler extends GestureHandler {
+  private startX = 0;
+  private startY = 0;
+  private offsetX = 0;
+  private offsetY = 0;
+  private lastX = 0;
+  private lastY = 0;
+  private maxNumberOfPointersSoFar = 0;
+  private numberOfTapsSoFar: number = 0;
+  private waitTimeout: number | undefined;
+  private delayTimeout: number | undefined;
+
+  constructor(deps: GestureHandlerDependencies) {
+    super({ ...deps, logger: deps.logger.cloneAndJoinPrefix(`TapGestureHandler${deps.handlerTag}`) })
+  }
+
+  public override getName(): string {
+    return "TapGestureHandler"
+  }
+
+  public override isGestureContinuous(): boolean {
+    return false
+  }
+
+  onPointerDown(event) {
+    this.tracker.addToTracker(event);
+    super.onPointerDown(event);
+    this.trySettingPosition(event);
+    this.lastX = event.x;
+    this.lastY = event.y;
+    this.updateState(event);
+  }
+
+  onAdditionalPointerAdd(event: IncomingEvent): void {
+    super.onAdditionalPointerAdd(event);
+    this.tracker.addToTracker(event);
+    this.trySettingPosition(event);
+
+    this.offsetX += this.lastX - this.startX;
+    this.offsetY += this.lastY - this.startY;
+
+    this.lastX = this.tracker.getLastAvgX();
+    this.lastY = this.tracker.getLastAvgY();
+
+    this.startX = this.tracker.getLastAvgX();
+    this.startY = this.tracker.getLastAvgY();
+
+    this.updateState(event);
+  }
+
+  onPointerUp(event: IncomingEvent): void {
+    super.onPointerUp(event);
+    this.lastX = this.tracker.getLastAvgX();
+    this.lastY = this.tracker.getLastAvgY();
+
+    this.tracker.removeFromTracker(event.pointerId);
+
+    this.updateState(event);
+  }
+
+  onAdditionalPointerRemove(event: IncomingEvent): void {
+    super.onAdditionalPointerRemove(event);
+    this.tracker.removeFromTracker(event.pointerId);
+
+    this.offsetX += this.lastX - this.startX;
+    this.offsetY += this.lastY = this.startY;
+
+    this.lastX = this.tracker.getLastAvgX();
+    this.lastY = this.tracker.getLastAvgY();
+
+    this.startX = this.lastX;
+    this.startY = this.lastY;
+
+    this.updateState(event);
+  }
+
+  onPointerMove(event: IncomingEvent): void {
+    this.trySettingPosition(event);
+    this.tracker.track(event);
+
+    this.lastX = this.tracker.getLastAvgX();
+    this.lastY = this.tracker.getLastAvgY();
+
+    this.updateState(event);
+
+    super.onPointerMove(event);
+  }
+
+  onPointerOutOfBounds(event: IncomingEvent): void {
+    this.trySettingPosition(event);
+    this.tracker.track(event);
+
+    this.lastX = this.tracker.getLastAvgX();
+    this.lastY = this.tracker.getLastAvgY();
+
+    this.updateState(event);
+
+    super.onPointerOutOfBounds(event);
+  }
+
+  getDefaultConfig() {
+    return {}
+  }
+
+  private trySettingPosition(event: IncomingEvent): void {
+    if (this.currentState !== State.UNDETERMINED) {
+      return;
+    }
+    this.offsetX = 0;
+    this.offsetY = 0;
+    this.startX = event.x;
+    this.startY = event.y;
+  }
+
+  private updateState(event: IncomingEvent): void {
+    const logger = this.logger.cloneAndJoinPrefix("updateState")
+    if (this.maxNumberOfPointersSoFar < this.tracker.getTrackedPointersCount()) {
+      this.maxNumberOfPointersSoFar = this.tracker.getTrackedPointersCount()
+    }
+    if (this.shouldFail()) {
+      logger.info("fail")
+      this.fail()
+      return;
+    }
+    switch (this.currentState) {
+      case State.UNDETERMINED:
+        if (event.eventType === EventType.DOWN) {
+          this.begin()
+        }
+        this.startTap();
+        break;
+      case State.BEGAN:
+        if (event.eventType === EventType.UP) {
+          logger.info("endTap")
+          this.endTap();
+        }
+        if (event.eventType === EventType.DOWN) {
+          this.startTap();
+        }
+        break;
+      default:
+        logger.info(`default case - currentState ${getStateName(this.currentState)}`)
+        break;
+    }
+  }
+
+  private shouldFail(): boolean {
+    const maxDeltaX = this.config.maxDeltaX ?? Number.MIN_SAFE_INTEGER
+    const maxDeltaY = this.config.maxDeltaY ?? Number.MIN_SAFE_INTEGER
+    const maxDistSq = this.config.maxDistSq ?? Number.MIN_SAFE_INTEGER
+
+    const dx = this.lastX - this.startX + this.offsetX;
+    if (
+      maxDeltaX !== Number.MIN_SAFE_INTEGER &&
+        Math.abs(dx) > maxDeltaX
+    ) {
+      return true;
+    }
+    const dy = this.lastY - this.startY + this.offsetY;
+    if (
+      maxDeltaY !== Number.MIN_SAFE_INTEGER &&
+        Math.abs(dy) > maxDeltaY
+    ) {
+      return true;
+    }
+    const distSq = dy * dy + dx * dx;
+    const result = maxDistSq !== Number.MIN_SAFE_INTEGER && distSq > maxDistSq
+    return result;
+  }
+
+  private startTap() {
+    this.clearTimeouts();
+    this.waitTimeout = setTimeout(() => this.fail(), this.config.maxDurationMs ?? DEFAULT_MAX_DURATION_MS);
+  }
+
+  private clearTimeouts() {
+    clearTimeout(this.waitTimeout);
+    clearTimeout(this.delayTimeout);
+  }
+
+  private endTap() {
+    const logger = this.logger.cloneAndJoinPrefix("endTap")
+    this.clearTimeouts();
+    if (
+      ++this.numberOfTapsSoFar === (this.config.numberOfTaps ?? DEFAULT_NUMBER_OF_TAPS) &&
+        this.maxNumberOfPointersSoFar >= (this.config.minNumberOfPointers ?? 0)
+    ) {
+      logger.info(JSON.stringify({ numberOfTapsSoFar: this.numberOfTapsSoFar }))
+      this.activate();
+    } else {
+      this.delayTimeout = setTimeout(() => this.fail(), this.config.maxDelayMs ?? DEFAULT_MAX_DELAY_MS);
+    }
+  }
+
+  public activate(): void {
+    super.activate();
+    this.end();
+  }
+
+  protected onCancel() {
+    super.onCancel()
+    this.resetProgress()
+  }
+
+  protected resetProgress(): void {
+    this.clearTimeouts();
+    this.numberOfTapsSoFar = 0;
+    this.maxNumberOfPointersSoFar = 0;
+  }
+}