@react-native-oh-tpl/react-native-gesture-handler 2.14.1-2.14.8 → 2.14.1-2.14.9

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

@@ -0,0 +1,164 @@
+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.cloneWithPrefix("RotationGestureHandler") })
+  }
+
+  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,206 @@
+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.cloneWithPrefix(`TapGestureHandler${deps.handlerTag}`)})
+  }
+
+  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.cloneWithPrefix("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.cloneWithPrefix("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;
+  }
+}

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

@@ -0,0 +1,167 @@
+import { PointerTracker, IncomingEvent, EventType } from '../../core';
+
+export interface RotationGestureListener {
+  onRotationBegin: (detector: RotationGestureDetector) => boolean;
+  onRotation: (detector: RotationGestureDetector) => boolean;
+  onRotationEnd: (detector: RotationGestureDetector) => void;
+}
+
+export default class RotationGestureDetector
+  implements RotationGestureListener
+{
+  onRotationBegin: (detector: RotationGestureDetector) => boolean;
+  onRotation: (detector: RotationGestureDetector) => boolean;
+  onRotationEnd: (detector: RotationGestureDetector) => void;
+
+  private currentTime = 0;
+  private previousTime = 0;
+
+  private previousAngle = 0;
+  private rotation = 0;
+
+  private anchorX = 0;
+  private anchorY = 0;
+
+  private isInProgress = false;
+
+  private keyPointers: number[] = [NaN, NaN];
+
+  constructor(callbacks: RotationGestureListener) {
+    this.onRotationBegin = callbacks.onRotationBegin;
+    this.onRotation = callbacks.onRotation;
+    this.onRotationEnd = callbacks.onRotationEnd;
+  }
+
+  private updateCurrent(event: IncomingEvent, tracker: PointerTracker): void {
+    this.previousTime = this.currentTime;
+    this.currentTime = event.time;
+
+    const [firstPointerID, secondPointerID] = this.keyPointers;
+
+    const firstPointerX: number = tracker.getLastX(firstPointerID);
+    const firstPointerY: number = tracker.getLastY(firstPointerID);
+    const secondPointerX: number = tracker.getLastX(secondPointerID);
+    const secondPointerY: number = tracker.getLastY(secondPointerID);
+
+    const vectorX: number = secondPointerX - firstPointerX;
+    const vectorY: number = secondPointerY - firstPointerY;
+
+    this.anchorX = (firstPointerX + secondPointerX) / 2;
+    this.anchorY = (firstPointerY + secondPointerY) / 2;
+
+    //Angle diff should be positive when rotating in clockwise direction
+    const angle: number = -Math.atan2(vectorY, vectorX);
+
+    this.rotation = Number.isNaN(this.previousAngle)
+      ? 0
+      : this.previousAngle - angle;
+
+    this.previousAngle = angle;
+
+    if (this.rotation > Math.PI) {
+      this.rotation -= Math.PI;
+    } else if (this.rotation < -Math.PI) {
+      this.rotation += Math.PI;
+    }
+
+    if (this.rotation > Math.PI / 2) {
+      this.rotation -= Math.PI;
+    } else if (this.rotation < -Math.PI / 2) {
+      this.rotation += Math.PI;
+    }
+  }
+
+  private finish(): void {
+    if (!this.isInProgress) {
+      return;
+    }
+
+    this.isInProgress = false;
+    this.keyPointers = [NaN, NaN];
+    this.onRotationEnd(this);
+  }
+
+  private setKeyPointers(tracker: PointerTracker): void {
+    if (this.keyPointers[0] && this.keyPointers[1]) {
+      return;
+    }
+
+    const pointerIDs: IterableIterator<number> = tracker.getData().keys();
+
+    this.keyPointers[0] = pointerIDs.next().value as number;
+    this.keyPointers[1] = pointerIDs.next().value as number;
+  }
+
+  public onTouchEvent(event: IncomingEvent, tracker: PointerTracker): boolean {
+    switch (event.eventType) {
+      case EventType.DOWN:
+        this.isInProgress = false;
+        break;
+
+      case EventType.ADDITIONAL_POINTER_DOWN:
+        if (this.isInProgress) {
+          break;
+        }
+        this.isInProgress = true;
+
+        this.previousTime = event.time;
+        this.previousAngle = NaN;
+
+        this.setKeyPointers(tracker);
+
+        this.updateCurrent(event, tracker);
+        this.onRotationBegin(this);
+        break;
+
+      case EventType.MOVE:
+        if (!this.isInProgress) {
+          break;
+        }
+
+        this.updateCurrent(event, tracker);
+        this.onRotation(this);
+
+        break;
+
+      case EventType.ADDITIONAL_POINTER_UP:
+        if (!this.isInProgress) {
+          break;
+        }
+
+        if (this.keyPointers.indexOf(event.pointerId) >= 0) {
+          this.finish();
+        }
+
+        break;
+
+      case EventType.UP:
+        if (this.isInProgress) {
+          this.finish();
+        }
+        break;
+    }
+
+    return true;
+  }
+
+  public getTimeDelta(): number {
+    return this.currentTime + this.previousTime;
+  }
+
+  public getAnchorX(): number {
+    return this.anchorX;
+  }
+
+  public getAnchorY(): number {
+    return this.anchorY;
+  }
+
+  public getRotation(): number {
+    return this.rotation;
+  }
+
+  public reset(): void {
+    this.keyPointers = [NaN, NaN];
+    this.isInProgress = false;
+  }
+}

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

@@ -0,0 +1 @@
+export * from "./GestureHandlerFactory"

package/harmony/gesture_handler/src/main/ets/namespace/RNGestureHandlerModule.ts

@@ -0,0 +1,24 @@
+// This file was generated.
+
+export namespace RNGestureHandlerModule {
+  export const NAME = 'RNGestureHandlerModule' as const
+
+  export interface Spec {
+    handleSetJSResponder(tag: number, blockNativeResponder: boolean): void;
+
+    handleClearJSResponder(): void;
+
+    createGestureHandler(handlerName: string, handlerTag: number, config: Object): void;
+
+    attachGestureHandler(handlerTag: number, newView: number, actionType: number): void;
+
+    updateGestureHandler(handlerTag: number, newConfig: Object): void;
+
+    dropGestureHandler(handlerTag: number): void;
+
+    install(): boolean;
+
+    flushOperations(): void;
+
+  }
+}

package/harmony/gesture_handler/src/main/ets/namespace/components/RNGestureHandlerButton.ts

@@ -0,0 +1,139 @@
+// This file was generated.
+import {
+  Descriptor as ComponentDescriptor,
+  ViewBaseProps,
+  ViewRawProps,
+  ViewDescriptorWrapperBase,
+  ColorValue,
+  Color,
+  RNInstance,
+  Tag,
+  RNComponentCommandReceiver,
+  ViewPropsSelector,
+} from '@rnoh/react-native-openharmony/ts';
+
+
+export namespace RNGestureHandlerButton {
+  export const NAME = "RNGestureHandlerButton" as const
+
+  export interface DirectRawProps {
+    exclusive?: boolean;
+    foreground?: boolean;
+    borderless?: boolean;
+    enabled?: boolean;
+    rippleColor?: ColorValue;
+    rippleRadius?: number;
+    touchSoundDisabled?: boolean;
+  }
+
+  export interface Props extends ViewBaseProps {}
+
+  export interface State {}
+
+  export interface RawProps extends ViewRawProps, DirectRawProps {}
+
+  export class PropsSelector extends ViewPropsSelector<Props, RawProps> {
+    get exclusive() {
+      return this.rawProps.exclusive ?? true;
+    }
+
+    get foreground() {
+      return this.rawProps.foreground ?? false;
+    }
+
+    get borderless() {
+      return this.rawProps.borderless ?? false;
+    }
+
+    get enabled() {
+      return this.rawProps.enabled ?? true;
+    }
+
+    get rippleRadius() {
+      return this.rawProps.rippleRadius ?? 0;
+    }
+
+    get touchSoundDisabled() {
+      return this.rawProps.touchSoundDisabled ?? false;
+    }
+
+
+    get rippleColor() {
+      if (this.rawProps.rippleColor) {
+        return Color.fromColorValue(this.rawProps.rippleColor)
+      } else {
+        return new Color({ r: 0, g: 0, b: 0, a: 255})
+      }
+    }
+
+  }
+
+  export type Descriptor = ComponentDescriptor<
+  typeof NAME,
+  Props,
+  State,
+  RawProps
+  >;
+
+  export class DescriptorWrapper extends ViewDescriptorWrapperBase<
+  typeof NAME,
+  Props,
+  State,
+  RawProps,
+  PropsSelector
+  > {
+    protected createPropsSelector() {
+      return new PropsSelector(this.descriptor.props, this.descriptor.rawProps)
+    }
+  }
+
+  export interface EventPayloadByName {
+  }
+
+  export class EventEmitter {
+    constructor(private rnInstance: RNInstance, private tag: Tag) {}
+
+    emit<TEventName extends keyof EventPayloadByName>(eventName: TEventName, payload: EventPayloadByName[TEventName]) {
+      this.rnInstance.emitComponentEvent(this.tag, eventName, payload)
+    }
+  }
+
+  export interface CommandArgvByName {
+  }
+
+  export class CommandReceiver {
+    private listenersByCommandName = new Map<string, Set<(...args: any[]) => void>>()
+    private cleanUp: (() => void) | undefined = undefined
+
+    constructor(private componentCommandReceiver: RNComponentCommandReceiver, private tag: Tag) {
+    }
+
+    subscribe<TCommandName extends keyof CommandArgvByName>(commandName: TCommandName, listener: (argv: CommandArgvByName[TCommandName]) => void) {
+      if (!this.listenersByCommandName.has(commandName)) {
+        this.listenersByCommandName.set(commandName, new Set())
+      }
+      this.listenersByCommandName.get(commandName)!.add(listener)
+      const hasRegisteredCommandReceiver = !!this.cleanUp
+      if (!hasRegisteredCommandReceiver) {
+        this.cleanUp = this.componentCommandReceiver.registerCommandCallback(this.tag, (commandName: string, argv: any[]) => {
+          if (this.listenersByCommandName.has(commandName)) {
+            const listeners = this.listenersByCommandName.get(commandName)!
+            listeners.forEach(listener => {
+              listener(argv)
+            })
+          }
+        })
+      }
+
+      return () => {
+        this.listenersByCommandName.get(commandName)?.delete(listener)
+        if (this.listenersByCommandName.get(commandName)?.size ?? 0 === 0) {
+          this.listenersByCommandName.delete(commandName)
+        }
+        if (this.listenersByCommandName.size === 0) {
+          this.cleanUp?.()
+        }
+      }
+    }
+  }
+}