@shopify/react-native-skia 1.4.2 → 1.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/android/CMakeLists.txt +38 -6
- package/android/build.gradle +1 -0
- package/android/cpp/jni/include/JniSkiaBaseView.h +0 -4
- package/android/cpp/jni/include/JniSkiaDomView.h +0 -6
- package/android/cpp/jni/include/JniSkiaPictureView.h +0 -6
- package/android/cpp/rnskia-android/RNSkAndroidView.h +0 -20
- package/android/src/main/java/com/shopify/reactnative/skia/SkiaBaseView.java +0 -72
- package/cpp/rnskia/RNSkDomView.cpp +0 -79
- package/cpp/rnskia/RNSkDomView.h +1 -39
- package/cpp/rnskia/RNSkPictureView.h +0 -1
- package/cpp/rnskia/RNSkView.h +0 -17
- package/ios/RNSkia-iOS/DisplayLink.mm +7 -0
- package/ios/RNSkia-iOS/SkiaUIView.mm +0 -51
- package/lib/commonjs/mock/index.js +0 -1
- package/lib/commonjs/mock/index.js.map +1 -1
- package/lib/commonjs/renderer/Canvas.d.ts +1 -2
- package/lib/commonjs/renderer/Canvas.js +0 -3
- package/lib/commonjs/renderer/Canvas.js.map +1 -1
- package/lib/commonjs/skia/web/JsiSkia.js.map +1 -1
- package/lib/commonjs/views/SkiaBaseWebView.d.ts +2 -11
- package/lib/commonjs/views/SkiaBaseWebView.js +3 -31
- package/lib/commonjs/views/SkiaBaseWebView.js.map +1 -1
- package/lib/commonjs/views/SkiaDomView.js +0 -12
- package/lib/commonjs/views/SkiaDomView.js.map +1 -1
- package/lib/commonjs/views/SkiaDomView.web.d.ts +2 -2
- package/lib/commonjs/views/SkiaDomView.web.js +1 -6
- package/lib/commonjs/views/SkiaDomView.web.js.map +1 -1
- package/lib/commonjs/views/SkiaJSDomView.js +0 -12
- package/lib/commonjs/views/SkiaJSDomView.js.map +1 -1
- package/lib/commonjs/views/index.d.ts +0 -1
- package/lib/commonjs/views/index.js +0 -11
- package/lib/commonjs/views/index.js.map +1 -1
- package/lib/commonjs/views/types.d.ts +0 -26
- package/lib/commonjs/views/types.js +0 -8
- package/lib/commonjs/views/types.js.map +1 -1
- package/lib/commonjs/web/WithSkiaWeb.js +4 -1
- package/lib/commonjs/web/WithSkiaWeb.js.map +1 -1
- package/lib/module/mock/index.js +0 -1
- package/lib/module/mock/index.js.map +1 -1
- package/lib/module/renderer/Canvas.d.ts +1 -2
- package/lib/module/renderer/Canvas.js +0 -3
- package/lib/module/renderer/Canvas.js.map +1 -1
- package/lib/module/skia/web/JsiSkia.js.map +1 -1
- package/lib/module/views/SkiaBaseWebView.d.ts +2 -11
- package/lib/module/views/SkiaBaseWebView.js +3 -31
- package/lib/module/views/SkiaBaseWebView.js.map +1 -1
- package/lib/module/views/SkiaDomView.js +0 -12
- package/lib/module/views/SkiaDomView.js.map +1 -1
- package/lib/module/views/SkiaDomView.web.d.ts +2 -2
- package/lib/module/views/SkiaDomView.web.js +1 -6
- package/lib/module/views/SkiaDomView.web.js.map +1 -1
- package/lib/module/views/SkiaJSDomView.js +0 -12
- package/lib/module/views/SkiaJSDomView.js.map +1 -1
- package/lib/module/views/index.d.ts +0 -1
- package/lib/module/views/index.js +0 -1
- package/lib/module/views/index.js.map +1 -1
- package/lib/module/views/types.d.ts +0 -26
- package/lib/module/views/types.js +1 -7
- package/lib/module/views/types.js.map +1 -1
- package/lib/module/web/WithSkiaWeb.js +4 -1
- package/lib/module/web/WithSkiaWeb.js.map +1 -1
- package/lib/typescript/lib/commonjs/mock/index.d.ts +0 -1
- package/lib/typescript/lib/commonjs/views/SkiaBaseWebView.d.ts +0 -3
- package/lib/typescript/lib/commonjs/views/SkiaDomView.web.d.ts +1 -1
- package/lib/typescript/lib/commonjs/views/types.d.ts +0 -1
- package/lib/typescript/lib/module/mock/index.d.ts +0 -1
- package/lib/typescript/lib/module/views/SkiaBaseWebView.d.ts +0 -3
- package/lib/typescript/lib/module/views/SkiaDomView.web.d.ts +1 -1
- package/lib/typescript/lib/module/views/index.d.ts +0 -1
- package/lib/typescript/lib/module/views/types.d.ts +1 -1
- package/lib/typescript/src/renderer/Canvas.d.ts +1 -2
- package/lib/typescript/src/views/SkiaBaseWebView.d.ts +2 -11
- package/lib/typescript/src/views/SkiaDomView.web.d.ts +2 -2
- package/lib/typescript/src/views/index.d.ts +0 -1
- package/lib/typescript/src/views/types.d.ts +0 -26
- package/libs/ios/libskia.xcframework/ios-arm64_arm64e/libskia.a +0 -0
- package/libs/ios/libskia.xcframework/ios-arm64_arm64e_x86_64-simulator/libskia.a +0 -0
- package/libs/ios/libskottie.xcframework/Info.plist +5 -5
- package/libs/ios/libskottie.xcframework/ios-arm64_arm64e/libskottie.a +0 -0
- package/libs/ios/libskottie.xcframework/ios-arm64_arm64e_x86_64-simulator/libskottie.a +0 -0
- package/libs/ios/libskparagraph.xcframework/Info.plist +5 -5
- package/libs/ios/libskparagraph.xcframework/ios-arm64_arm64e/libskparagraph.a +0 -0
- package/libs/ios/libskparagraph.xcframework/ios-arm64_arm64e_x86_64-simulator/libskparagraph.a +0 -0
- package/libs/ios/libsksg.xcframework/ios-arm64_arm64e/libsksg.a +0 -0
- package/libs/ios/libsksg.xcframework/ios-arm64_arm64e_x86_64-simulator/libsksg.a +0 -0
- package/libs/ios/libskshaper.xcframework/Info.plist +5 -5
- package/libs/ios/libskshaper.xcframework/ios-arm64_arm64e/libskshaper.a +0 -0
- package/libs/ios/libskshaper.xcframework/ios-arm64_arm64e_x86_64-simulator/libskshaper.a +0 -0
- package/libs/ios/libskunicode_core.xcframework/ios-arm64_arm64e/libskunicode_core.a +0 -0
- package/libs/ios/libskunicode_core.xcframework/ios-arm64_arm64e_x86_64-simulator/libskunicode_core.a +0 -0
- package/libs/ios/libskunicode_libgrapheme.xcframework/ios-arm64_arm64e/libskunicode_libgrapheme.a +0 -0
- package/libs/ios/libskunicode_libgrapheme.xcframework/ios-arm64_arm64e_x86_64-simulator/libskunicode_libgrapheme.a +0 -0
- package/libs/ios/libsvg.xcframework/Info.plist +5 -5
- package/libs/ios/libsvg.xcframework/ios-arm64_arm64e/libsvg.a +0 -0
- package/libs/ios/libsvg.xcframework/ios-arm64_arm64e_x86_64-simulator/libsvg.a +0 -0
- package/package.json +3 -6
- package/src/mock/index.ts +0 -1
- package/src/renderer/Canvas.tsx +1 -5
- package/src/renderer/__tests__/setup.tsx +0 -2
- package/src/skia/web/JsiSkia.ts +1 -1
- package/src/views/SkiaBaseWebView.tsx +5 -42
- package/src/views/SkiaDomView.tsx +2 -14
- package/src/views/SkiaDomView.web.tsx +2 -9
- package/src/views/SkiaJSDomView.tsx +2 -14
- package/src/views/index.ts +0 -1
- package/src/views/types.ts +0 -32
- package/src/web/WithSkiaWeb.tsx +3 -1
- package/cpp/rnskia/RNSkInfoParameter.h +0 -92
- package/lib/commonjs/renderer/__tests__/TouchHandler.spec.d.ts +0 -1
- package/lib/commonjs/views/useTouchHandler.d.ts +0 -22
- package/lib/commonjs/views/useTouchHandler.js +0 -83
- package/lib/commonjs/views/useTouchHandler.js.map +0 -1
- package/lib/module/renderer/__tests__/TouchHandler.spec.d.ts +0 -1
- package/lib/module/views/useTouchHandler.d.ts +0 -22
- package/lib/module/views/useTouchHandler.js +0 -75
- package/lib/module/views/useTouchHandler.js.map +0 -1
- package/lib/typescript/lib/commonjs/views/useTouchHandler.d.ts +0 -12
- package/lib/typescript/lib/module/views/useTouchHandler.d.ts +0 -2
- package/lib/typescript/src/renderer/__tests__/TouchHandler.spec.d.ts +0 -1
- package/lib/typescript/src/views/useTouchHandler.d.ts +0 -22
- package/src/renderer/__tests__/TouchHandler.spec.tsx +0 -113
- package/src/views/useTouchHandler.ts +0 -107
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
/* global HTMLCanvasElement */
|
|
2
2
|
import React from "react";
|
|
3
|
-
import type { PointerEvent } from "react";
|
|
4
3
|
import type { LayoutChangeEvent } from "react-native";
|
|
5
4
|
|
|
6
5
|
import type { SkRect, SkCanvas } from "../skia/types";
|
|
7
6
|
import { JsiSkSurface } from "../skia/web/JsiSkSurface";
|
|
8
7
|
import { Platform } from "../Platform";
|
|
9
8
|
|
|
10
|
-
import type { DrawMode, SkiaBaseViewProps
|
|
11
|
-
import { TouchType } from "./types";
|
|
9
|
+
import type { DrawMode, SkiaBaseViewProps } from "./types";
|
|
12
10
|
|
|
13
11
|
const pd = Platform.PixelRatio;
|
|
14
12
|
|
|
@@ -22,7 +20,6 @@ export abstract class SkiaBaseWebView<
|
|
|
22
20
|
|
|
23
21
|
private _surface: JsiSkSurface | null = null;
|
|
24
22
|
private _unsubscriptions: Array<() => void> = [];
|
|
25
|
-
private _touches: Array<TouchInfo> = [];
|
|
26
23
|
private _canvas: SkCanvas | null = null;
|
|
27
24
|
private _canvasRef = React.createRef<HTMLCanvasElement>();
|
|
28
25
|
private _mode: DrawMode;
|
|
@@ -95,7 +92,7 @@ export abstract class SkiaBaseWebView<
|
|
|
95
92
|
*/
|
|
96
93
|
public makeImageSnapshot(rect?: SkRect) {
|
|
97
94
|
this._canvas!.clear(CanvasKit.TRANSPARENT);
|
|
98
|
-
this.renderInCanvas(this._canvas
|
|
95
|
+
this.renderInCanvas(this._canvas!);
|
|
99
96
|
this._surface?.ref.flush();
|
|
100
97
|
return this._surface?.makeImageSnapshot(rect);
|
|
101
98
|
}
|
|
@@ -103,10 +100,7 @@ export abstract class SkiaBaseWebView<
|
|
|
103
100
|
/**
|
|
104
101
|
* Override to render
|
|
105
102
|
*/
|
|
106
|
-
protected abstract renderInCanvas(
|
|
107
|
-
canvas: SkCanvas,
|
|
108
|
-
touches: TouchInfo[]
|
|
109
|
-
): void;
|
|
103
|
+
protected abstract renderInCanvas(canvas: SkCanvas): void;
|
|
110
104
|
|
|
111
105
|
/**
|
|
112
106
|
* Sends a redraw request to the native SkiaView.
|
|
@@ -115,13 +109,11 @@ export abstract class SkiaBaseWebView<
|
|
|
115
109
|
if (this._mode === "continuous" || this._redrawRequests > 0) {
|
|
116
110
|
this._redrawRequests = 0;
|
|
117
111
|
if (this._canvas) {
|
|
118
|
-
const touches = [...this._touches];
|
|
119
|
-
this._touches = [];
|
|
120
112
|
const canvas = this._canvas!;
|
|
121
113
|
canvas.clear(Float32Array.of(0, 0, 0, 0));
|
|
122
114
|
canvas.save();
|
|
123
115
|
canvas.scale(pd, pd);
|
|
124
|
-
this.renderInCanvas(canvas
|
|
116
|
+
this.renderInCanvas(canvas);
|
|
125
117
|
canvas.restore();
|
|
126
118
|
this._surface?.ref.flush();
|
|
127
119
|
}
|
|
@@ -147,42 +139,13 @@ export abstract class SkiaBaseWebView<
|
|
|
147
139
|
this.tick();
|
|
148
140
|
}
|
|
149
141
|
|
|
150
|
-
private handleTouchEvent(evt: PointerEvent, touchType: TouchType) {
|
|
151
|
-
this._touches.push({
|
|
152
|
-
id: evt.pointerId,
|
|
153
|
-
x: evt.clientX - evt.currentTarget.getClientRects()[0].left,
|
|
154
|
-
y: evt.clientY - evt.currentTarget.getClientRects()[0].top,
|
|
155
|
-
force: evt.pressure,
|
|
156
|
-
type: touchType,
|
|
157
|
-
timestamp: Date.now(),
|
|
158
|
-
});
|
|
159
|
-
this.redraw();
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
createTouchHandler(touchType: TouchType) {
|
|
163
|
-
return (evt: PointerEvent) => this.handleTouchEvent(evt, touchType);
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
private onStart = this.createTouchHandler(TouchType.Start);
|
|
167
|
-
private onActive = this.createTouchHandler(TouchType.Active);
|
|
168
|
-
private onCancel = this.createTouchHandler(TouchType.Cancelled);
|
|
169
|
-
private onEnd = this.createTouchHandler(TouchType.End);
|
|
170
142
|
private onLayout = this.onLayoutEvent.bind(this);
|
|
171
143
|
|
|
172
144
|
render() {
|
|
173
145
|
const { mode, debug = false, ...viewProps } = this.props;
|
|
174
146
|
return (
|
|
175
147
|
<Platform.View {...viewProps} onLayout={this.onLayout}>
|
|
176
|
-
<canvas
|
|
177
|
-
ref={this._canvasRef}
|
|
178
|
-
style={{ display: "flex", flex: 1 }}
|
|
179
|
-
onPointerDown={this.onStart}
|
|
180
|
-
onPointerMove={this.onActive}
|
|
181
|
-
onPointerUp={this.onEnd}
|
|
182
|
-
onPointerCancel={this.onCancel}
|
|
183
|
-
onPointerLeave={this.onEnd}
|
|
184
|
-
onPointerOut={this.onEnd}
|
|
185
|
-
/>
|
|
148
|
+
<canvas ref={this._canvasRef} style={{ display: "flex", flex: 1 }} />
|
|
186
149
|
</Platform.View>
|
|
187
150
|
);
|
|
188
151
|
}
|
|
@@ -19,19 +19,11 @@ export class SkiaDomView extends React.Component<SkiaDomViewProps> {
|
|
|
19
19
|
constructor(props: SkiaDomViewProps) {
|
|
20
20
|
super(props);
|
|
21
21
|
this._nativeId = SkiaViewNativeId.current++;
|
|
22
|
-
const { root,
|
|
22
|
+
const { root, onSize } = props;
|
|
23
23
|
if (root) {
|
|
24
24
|
assertSkiaViewApi();
|
|
25
25
|
SkiaViewApi.setJsiProperty(this._nativeId, "root", root);
|
|
26
26
|
}
|
|
27
|
-
if (onTouch) {
|
|
28
|
-
assertSkiaViewApi();
|
|
29
|
-
console.warn(
|
|
30
|
-
`The onTouch property is deprecated and will be removed in the next Skia release.
|
|
31
|
-
See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
|
|
32
|
-
);
|
|
33
|
-
SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
|
|
34
|
-
}
|
|
35
27
|
if (onSize) {
|
|
36
28
|
assertSkiaViewApi();
|
|
37
29
|
SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
|
|
@@ -45,15 +37,11 @@ See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
|
|
|
45
37
|
}
|
|
46
38
|
|
|
47
39
|
componentDidUpdate(prevProps: SkiaDomViewProps) {
|
|
48
|
-
const { root,
|
|
40
|
+
const { root, onSize } = this.props;
|
|
49
41
|
if (root !== prevProps.root) {
|
|
50
42
|
assertSkiaViewApi();
|
|
51
43
|
SkiaViewApi.setJsiProperty(this._nativeId, "root", root);
|
|
52
44
|
}
|
|
53
|
-
if (onTouch !== prevProps.onTouch) {
|
|
54
|
-
assertSkiaViewApi();
|
|
55
|
-
SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
|
|
56
|
-
}
|
|
57
45
|
if (onSize !== prevProps.onSize) {
|
|
58
46
|
assertSkiaViewApi();
|
|
59
47
|
SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
|
|
@@ -3,21 +3,14 @@ import type { SkCanvas } from "../skia/types";
|
|
|
3
3
|
import { JsiDrawingContext } from "../dom/types/DrawingContext";
|
|
4
4
|
|
|
5
5
|
import { SkiaBaseWebView } from "./SkiaBaseWebView";
|
|
6
|
-
import type { SkiaDomViewProps
|
|
6
|
+
import type { SkiaDomViewProps } from "./types";
|
|
7
7
|
|
|
8
8
|
export class SkiaDomView extends SkiaBaseWebView<SkiaDomViewProps> {
|
|
9
9
|
constructor(props: SkiaDomViewProps) {
|
|
10
10
|
super(props);
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
protected renderInCanvas(canvas: SkCanvas
|
|
14
|
-
if (this.props.onTouch) {
|
|
15
|
-
console.warn(
|
|
16
|
-
`The onTouch property is deprecated and will be removed in the next Skia release.
|
|
17
|
-
See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
|
|
18
|
-
);
|
|
19
|
-
this.props.onTouch([touches]);
|
|
20
|
-
}
|
|
13
|
+
protected renderInCanvas(canvas: SkCanvas): void {
|
|
21
14
|
if (this.props.onSize) {
|
|
22
15
|
const { width, height } = this.getSize();
|
|
23
16
|
this.props.onSize.value = { width, height };
|
|
@@ -22,19 +22,11 @@ export class SkiaJSDomView extends React.Component<
|
|
|
22
22
|
constructor(props: SkiaDomViewProps & { Skia: Skia }) {
|
|
23
23
|
super(props);
|
|
24
24
|
this._nativeId = SkiaViewNativeId.current++;
|
|
25
|
-
const { root,
|
|
25
|
+
const { root, onSize } = props;
|
|
26
26
|
if (root) {
|
|
27
27
|
assertSkiaViewApi();
|
|
28
28
|
SkiaViewApi.setJsiProperty(this._nativeId, "root", root);
|
|
29
29
|
}
|
|
30
|
-
if (onTouch) {
|
|
31
|
-
assertSkiaViewApi();
|
|
32
|
-
console.warn(
|
|
33
|
-
`The onTouch property is deprecated and will be removed in the next Skia release.
|
|
34
|
-
See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
|
|
35
|
-
);
|
|
36
|
-
SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
|
|
37
|
-
}
|
|
38
30
|
if (onSize) {
|
|
39
31
|
assertSkiaViewApi();
|
|
40
32
|
SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
|
|
@@ -48,15 +40,11 @@ See: https://shopify.github.io/react-native-skia/docs/animations/gestures`
|
|
|
48
40
|
}
|
|
49
41
|
|
|
50
42
|
componentDidUpdate(prevProps: SkiaDomViewProps & { Skia: Skia }) {
|
|
51
|
-
const { root,
|
|
43
|
+
const { root, onSize } = this.props;
|
|
52
44
|
if (root !== prevProps.root && root !== undefined) {
|
|
53
45
|
assertSkiaViewApi();
|
|
54
46
|
this.draw();
|
|
55
47
|
}
|
|
56
|
-
if (onTouch !== prevProps.onTouch) {
|
|
57
|
-
assertSkiaViewApi();
|
|
58
|
-
SkiaViewApi.setJsiProperty(this._nativeId, "onTouch", onTouch);
|
|
59
|
-
}
|
|
60
48
|
if (onSize !== prevProps.onSize) {
|
|
61
49
|
assertSkiaViewApi();
|
|
62
50
|
SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
|
package/src/views/index.ts
CHANGED
package/src/views/types.ts
CHANGED
|
@@ -11,43 +11,12 @@ export type NativeSkiaViewProps = ViewProps & {
|
|
|
11
11
|
debug?: boolean;
|
|
12
12
|
};
|
|
13
13
|
|
|
14
|
-
export enum TouchType {
|
|
15
|
-
Start,
|
|
16
|
-
Active,
|
|
17
|
-
End,
|
|
18
|
-
Cancelled,
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export interface TouchInfo {
|
|
22
|
-
x: number;
|
|
23
|
-
y: number;
|
|
24
|
-
force: number;
|
|
25
|
-
type: TouchType;
|
|
26
|
-
id: number;
|
|
27
|
-
timestamp: number;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
14
|
export interface DrawingInfo {
|
|
31
15
|
width: number;
|
|
32
16
|
height: number;
|
|
33
17
|
timestamp: number;
|
|
34
|
-
touches: Array<Array<TouchInfo>>;
|
|
35
18
|
}
|
|
36
19
|
|
|
37
|
-
export type ExtendedTouchInfo = TouchInfo & {
|
|
38
|
-
// points per second
|
|
39
|
-
velocityX: number;
|
|
40
|
-
velocityY: number;
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
export type TouchHandlers = {
|
|
44
|
-
onStart?: (touchInfo: TouchInfo) => void;
|
|
45
|
-
onActive?: (touchInfo: ExtendedTouchInfo) => void;
|
|
46
|
-
onEnd?: (touchInfo: ExtendedTouchInfo) => void;
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
export type TouchHandler = (touchInfo: Array<Array<TouchInfo>>) => void;
|
|
50
|
-
|
|
51
20
|
export interface ISkiaViewApi {
|
|
52
21
|
setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;
|
|
53
22
|
requestRedraw: (nativeId: number) => void;
|
|
@@ -82,5 +51,4 @@ export interface SkiaPictureViewProps extends SkiaBaseViewProps {
|
|
|
82
51
|
|
|
83
52
|
export interface SkiaDomViewProps extends SkiaBaseViewProps {
|
|
84
53
|
root?: RenderNode<GroupProps>;
|
|
85
|
-
onTouch?: TouchHandler;
|
|
86
54
|
}
|
package/src/web/WithSkiaWeb.tsx
CHANGED
|
@@ -41,7 +41,9 @@ export const WithSkiaWeb = <TProps extends object>({
|
|
|
41
41
|
}
|
|
42
42
|
return getComponent();
|
|
43
43
|
}),
|
|
44
|
-
|
|
44
|
+
// We we to run this only once.
|
|
45
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
46
|
+
[]
|
|
45
47
|
);
|
|
46
48
|
return (
|
|
47
49
|
<Suspense fallback={fallback ?? null}>
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
#pragma once
|
|
2
|
-
|
|
3
|
-
#include <chrono>
|
|
4
|
-
#include <memory>
|
|
5
|
-
#include <mutex>
|
|
6
|
-
#include <utility>
|
|
7
|
-
#include <vector>
|
|
8
|
-
|
|
9
|
-
#include <jsi/jsi.h>
|
|
10
|
-
|
|
11
|
-
#include "JsiHostObject.h"
|
|
12
|
-
#include "RNSkView.h"
|
|
13
|
-
|
|
14
|
-
namespace RNSkia {
|
|
15
|
-
|
|
16
|
-
namespace jsi = facebook::jsi;
|
|
17
|
-
|
|
18
|
-
class RNSkInfoObject : public RNJsi::JsiHostObject {
|
|
19
|
-
public:
|
|
20
|
-
JSI_PROPERTY_GET(width) { return _width; }
|
|
21
|
-
JSI_PROPERTY_GET(height) { return _height; }
|
|
22
|
-
JSI_PROPERTY_GET(timestamp) { return _timestamp; }
|
|
23
|
-
|
|
24
|
-
JSI_PROPERTY_GET(touches) {
|
|
25
|
-
auto ops = jsi::Array(runtime, _touchesCache.size());
|
|
26
|
-
for (size_t i = 0; i < _touchesCache.size(); i++) {
|
|
27
|
-
auto cur = _touchesCache.at(i);
|
|
28
|
-
auto touches = jsi::Array(runtime, cur.size());
|
|
29
|
-
for (size_t n = 0; n < cur.size(); n++) {
|
|
30
|
-
auto touchObj = jsi::Object(runtime);
|
|
31
|
-
auto t = cur.at(n);
|
|
32
|
-
touchObj.setProperty(runtime, "x", t.x);
|
|
33
|
-
touchObj.setProperty(runtime, "y", t.y);
|
|
34
|
-
touchObj.setProperty(runtime, "force", t.force);
|
|
35
|
-
touchObj.setProperty(runtime, "type", static_cast<double>(t.type));
|
|
36
|
-
touchObj.setProperty(runtime, "timestamp",
|
|
37
|
-
static_cast<double>(t.timestamp / 1000.0));
|
|
38
|
-
touchObj.setProperty(runtime, "id", static_cast<double>(t.id));
|
|
39
|
-
touches.setValueAtIndex(runtime, n, touchObj);
|
|
40
|
-
}
|
|
41
|
-
ops.setValueAtIndex(runtime, i, touches);
|
|
42
|
-
}
|
|
43
|
-
return ops;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
JSI_EXPORT_PROPERTY_GETTERS(JSI_EXPORT_PROP_GET(RNSkInfoObject, width),
|
|
47
|
-
JSI_EXPORT_PROP_GET(RNSkInfoObject, height),
|
|
48
|
-
JSI_EXPORT_PROP_GET(RNSkInfoObject, timestamp),
|
|
49
|
-
JSI_EXPORT_PROP_GET(RNSkInfoObject, touches))
|
|
50
|
-
|
|
51
|
-
void beginDrawOperation(int width, int height, double timestamp) {
|
|
52
|
-
_width = width;
|
|
53
|
-
_height = height;
|
|
54
|
-
_timestamp = timestamp;
|
|
55
|
-
|
|
56
|
-
// Copy touches so that we can continue to add/receive touch points while
|
|
57
|
-
// in the drawing callback.
|
|
58
|
-
std::lock_guard<std::mutex> lock(_mutex);
|
|
59
|
-
_touchesCache.clear();
|
|
60
|
-
_touchesCache.reserve(_currentTouches.size());
|
|
61
|
-
for (size_t i = 0; i < _currentTouches.size(); ++i) {
|
|
62
|
-
_touchesCache.push_back(_currentTouches.at(i));
|
|
63
|
-
}
|
|
64
|
-
_currentTouches.clear();
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
void endDrawOperation() { _touchesCache.clear(); }
|
|
68
|
-
|
|
69
|
-
void updateTouches(std::vector<RNSkTouchInfo> &touches) {
|
|
70
|
-
std::lock_guard<std::mutex> lock(_mutex);
|
|
71
|
-
// Add timestamp
|
|
72
|
-
auto ms = std::chrono::duration_cast<std::chrono::milliseconds>(
|
|
73
|
-
std::chrono::system_clock::now().time_since_epoch())
|
|
74
|
-
.count();
|
|
75
|
-
|
|
76
|
-
for (size_t i = 0; i < touches.size(); i++) {
|
|
77
|
-
touches.at(i).timestamp = ms;
|
|
78
|
-
}
|
|
79
|
-
_currentTouches.push_back(std::move(touches));
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
RNSkInfoObject() : JsiHostObject() {}
|
|
83
|
-
|
|
84
|
-
private:
|
|
85
|
-
int _width;
|
|
86
|
-
int _height;
|
|
87
|
-
double _timestamp;
|
|
88
|
-
std::vector<std::vector<RNSkTouchInfo>> _currentTouches;
|
|
89
|
-
std::vector<std::vector<RNSkTouchInfo>> _touchesCache;
|
|
90
|
-
std::mutex _mutex;
|
|
91
|
-
};
|
|
92
|
-
} // namespace RNSkia
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import type { DependencyList } from "react";
|
|
2
|
-
import type { TouchHandlers, TouchHandler } from "./types";
|
|
3
|
-
/**
|
|
4
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
5
|
-
* This touch handler only handles single touches.
|
|
6
|
-
* @param handlers Callbacks for the different touch states
|
|
7
|
-
* @param deps optional Dependency array to update the handlers
|
|
8
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
9
|
-
* update and handle touch events. Call it with the touches property from
|
|
10
|
-
* the info object.
|
|
11
|
-
*/
|
|
12
|
-
export declare const useTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
|
|
13
|
-
/**
|
|
14
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
15
|
-
* This touch handler handles multiple touches.
|
|
16
|
-
* @param handlers Callbacks for the different touch states
|
|
17
|
-
* @param deps optional Dependency array to update the handlers
|
|
18
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
19
|
-
* update and handle touch events. Call it with the touches property from
|
|
20
|
-
* the info object.
|
|
21
|
-
*/
|
|
22
|
-
export declare const useMultiTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.useTouchHandler = exports.useMultiTouchHandler = void 0;
|
|
7
|
-
var _react = require("react");
|
|
8
|
-
var _Platform = require("../Platform");
|
|
9
|
-
var _types = require("./types");
|
|
10
|
-
const useInternalTouchHandler = (handlers, deps = [], multiTouch = false) => {
|
|
11
|
-
const prevTouchInfoRef = (0, _react.useRef)({});
|
|
12
|
-
const prevVelocityRef = (0, _react.useRef)({});
|
|
13
|
-
return (0, _react.useCallback)(history => {
|
|
14
|
-
// Process all items in the current touch history
|
|
15
|
-
history.forEach(touches => {
|
|
16
|
-
// Enumerate touches
|
|
17
|
-
for (let i = 0; i < touches.length; i++) {
|
|
18
|
-
var _prevTouchInfoRef$cur, _prevTouchInfoRef$cur2, _prevTouch$x, _prevTouch$y, _prevVelocityRef$curr, _prevVelocityRef$curr2, _prevVelocityRef$curr3, _prevVelocityRef$curr4;
|
|
19
|
-
if (!multiTouch && i > 0) {
|
|
20
|
-
break;
|
|
21
|
-
}
|
|
22
|
-
const touch = touches[i];
|
|
23
|
-
const prevTouch = prevTouchInfoRef.current[touch.id];
|
|
24
|
-
// Calculate the velocity from the previous touch.
|
|
25
|
-
const timeDiffseconds = touch.timestamp - ((_prevTouchInfoRef$cur = (_prevTouchInfoRef$cur2 = prevTouchInfoRef.current[touch.id]) === null || _prevTouchInfoRef$cur2 === void 0 ? void 0 : _prevTouchInfoRef$cur2.timestamp) !== null && _prevTouchInfoRef$cur !== void 0 ? _prevTouchInfoRef$cur : touch.timestamp);
|
|
26
|
-
const distX = touch.x - ((_prevTouch$x = prevTouch === null || prevTouch === void 0 ? void 0 : prevTouch.x) !== null && _prevTouch$x !== void 0 ? _prevTouch$x : touch.x);
|
|
27
|
-
const distY = touch.y - ((_prevTouch$y = prevTouch === null || prevTouch === void 0 ? void 0 : prevTouch.y) !== null && _prevTouch$y !== void 0 ? _prevTouch$y : touch.y);
|
|
28
|
-
if (touch.type !== _types.TouchType.Start && touch.type !== _types.TouchType.End && touch.type !== _types.TouchType.Cancelled && timeDiffseconds > 0) {
|
|
29
|
-
prevVelocityRef.current[touch.id] = {
|
|
30
|
-
x: distX / timeDiffseconds / _Platform.Platform.PixelRatio,
|
|
31
|
-
y: distY / timeDiffseconds / _Platform.Platform.PixelRatio
|
|
32
|
-
};
|
|
33
|
-
}
|
|
34
|
-
const extendedTouchInfo = {
|
|
35
|
-
...touch,
|
|
36
|
-
velocityX: (_prevVelocityRef$curr = (_prevVelocityRef$curr2 = prevVelocityRef.current[touch.id]) === null || _prevVelocityRef$curr2 === void 0 ? void 0 : _prevVelocityRef$curr2.x) !== null && _prevVelocityRef$curr !== void 0 ? _prevVelocityRef$curr : 0,
|
|
37
|
-
velocityY: (_prevVelocityRef$curr3 = (_prevVelocityRef$curr4 = prevVelocityRef.current[touch.id]) === null || _prevVelocityRef$curr4 === void 0 ? void 0 : _prevVelocityRef$curr4.y) !== null && _prevVelocityRef$curr3 !== void 0 ? _prevVelocityRef$curr3 : 0
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
// Save previous touch
|
|
41
|
-
prevTouchInfoRef.current[touch.id] = touch;
|
|
42
|
-
if (touch.type === _types.TouchType.Start) {
|
|
43
|
-
delete prevVelocityRef.current[touch.id];
|
|
44
|
-
handlers.onStart && handlers.onStart(touch);
|
|
45
|
-
} else if (touch.type === _types.TouchType.Active) {
|
|
46
|
-
handlers.onActive && handlers.onActive(extendedTouchInfo);
|
|
47
|
-
} else {
|
|
48
|
-
handlers.onEnd && handlers.onEnd(extendedTouchInfo);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
});
|
|
52
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
53
|
-
}, deps);
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
/**
|
|
57
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
58
|
-
* This touch handler only handles single touches.
|
|
59
|
-
* @param handlers Callbacks for the different touch states
|
|
60
|
-
* @param deps optional Dependency array to update the handlers
|
|
61
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
62
|
-
* update and handle touch events. Call it with the touches property from
|
|
63
|
-
* the info object.
|
|
64
|
-
*/
|
|
65
|
-
const useTouchHandler = (handlers, deps = []) => {
|
|
66
|
-
return useInternalTouchHandler(handlers, deps, false);
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
71
|
-
* This touch handler handles multiple touches.
|
|
72
|
-
* @param handlers Callbacks for the different touch states
|
|
73
|
-
* @param deps optional Dependency array to update the handlers
|
|
74
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
75
|
-
* update and handle touch events. Call it with the touches property from
|
|
76
|
-
* the info object.
|
|
77
|
-
*/
|
|
78
|
-
exports.useTouchHandler = useTouchHandler;
|
|
79
|
-
const useMultiTouchHandler = (handlers, deps = []) => {
|
|
80
|
-
return useInternalTouchHandler(handlers, deps, true);
|
|
81
|
-
};
|
|
82
|
-
exports.useMultiTouchHandler = useMultiTouchHandler;
|
|
83
|
-
//# sourceMappingURL=useTouchHandler.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_Platform","_types","useInternalTouchHandler","handlers","deps","multiTouch","prevTouchInfoRef","useRef","prevVelocityRef","useCallback","history","forEach","touches","i","length","_prevTouchInfoRef$cur","_prevTouchInfoRef$cur2","_prevTouch$x","_prevTouch$y","_prevVelocityRef$curr","_prevVelocityRef$curr2","_prevVelocityRef$curr3","_prevVelocityRef$curr4","touch","prevTouch","current","id","timeDiffseconds","timestamp","distX","x","distY","y","type","TouchType","Start","End","Cancelled","Platform","PixelRatio","extendedTouchInfo","velocityX","velocityY","onStart","Active","onActive","onEnd","useTouchHandler","exports","useMultiTouchHandler"],"sources":["useTouchHandler.ts"],"sourcesContent":["import type { DependencyList } from \"react\";\nimport { useCallback, useRef } from \"react\";\n\nimport type { Vector } from \"../skia/types\";\nimport { Platform } from \"../Platform\";\n\nimport type {\n ExtendedTouchInfo,\n TouchHandlers,\n TouchHandler,\n TouchInfo,\n} from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst useInternalTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = [],\n multiTouch = false\n): TouchHandler => {\n const prevTouchInfoRef = useRef<{ [key: number]: TouchInfo | undefined }>({});\n const prevVelocityRef = useRef<{ [key: number]: Vector | undefined }>({});\n\n return useCallback((history: Array<Array<TouchInfo>>) => {\n // Process all items in the current touch history\n history.forEach((touches) => {\n // Enumerate touches\n for (let i = 0; i < touches.length; i++) {\n if (!multiTouch && i > 0) {\n break;\n }\n\n const touch = touches[i];\n const prevTouch = prevTouchInfoRef.current[touch.id];\n // Calculate the velocity from the previous touch.\n const timeDiffseconds =\n touch.timestamp -\n (prevTouchInfoRef.current[touch.id]?.timestamp ?? touch.timestamp);\n\n const distX = touch.x - (prevTouch?.x ?? touch.x);\n const distY = touch.y - (prevTouch?.y ?? touch.y);\n\n if (\n touch.type !== TouchType.Start &&\n touch.type !== TouchType.End &&\n touch.type !== TouchType.Cancelled &&\n timeDiffseconds > 0\n ) {\n prevVelocityRef.current[touch.id] = {\n x: distX / timeDiffseconds / Platform.PixelRatio,\n y: distY / timeDiffseconds / Platform.PixelRatio,\n };\n }\n\n const extendedTouchInfo: ExtendedTouchInfo = {\n ...touch,\n velocityX: prevVelocityRef.current[touch.id]?.x ?? 0,\n velocityY: prevVelocityRef.current[touch.id]?.y ?? 0,\n };\n\n // Save previous touch\n prevTouchInfoRef.current[touch.id] = touch;\n\n if (touch.type === TouchType.Start) {\n delete prevVelocityRef.current[touch.id];\n handlers.onStart && handlers.onStart(touch);\n } else if (touch.type === TouchType.Active) {\n handlers.onActive && handlers.onActive(extendedTouchInfo);\n } else {\n handlers.onEnd && handlers.onEnd(extendedTouchInfo);\n }\n }\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, deps);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler only handles single touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = []\n): TouchHandler => {\n return useInternalTouchHandler(handlers, deps, false);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler handles multiple touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useMultiTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = []\n): TouchHandler => {\n return useInternalTouchHandler(handlers, deps, true);\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import type { DependencyList } from "react";
|
|
2
|
-
import type { TouchHandlers, TouchHandler } from "./types";
|
|
3
|
-
/**
|
|
4
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
5
|
-
* This touch handler only handles single touches.
|
|
6
|
-
* @param handlers Callbacks for the different touch states
|
|
7
|
-
* @param deps optional Dependency array to update the handlers
|
|
8
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
9
|
-
* update and handle touch events. Call it with the touches property from
|
|
10
|
-
* the info object.
|
|
11
|
-
*/
|
|
12
|
-
export declare const useTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
|
|
13
|
-
/**
|
|
14
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
15
|
-
* This touch handler handles multiple touches.
|
|
16
|
-
* @param handlers Callbacks for the different touch states
|
|
17
|
-
* @param deps optional Dependency array to update the handlers
|
|
18
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
19
|
-
* update and handle touch events. Call it with the touches property from
|
|
20
|
-
* the info object.
|
|
21
|
-
*/
|
|
22
|
-
export declare const useMultiTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import { useCallback, useRef } from "react";
|
|
2
|
-
import { Platform } from "../Platform";
|
|
3
|
-
import { TouchType } from "./types";
|
|
4
|
-
const useInternalTouchHandler = (handlers, deps = [], multiTouch = false) => {
|
|
5
|
-
const prevTouchInfoRef = useRef({});
|
|
6
|
-
const prevVelocityRef = useRef({});
|
|
7
|
-
return useCallback(history => {
|
|
8
|
-
// Process all items in the current touch history
|
|
9
|
-
history.forEach(touches => {
|
|
10
|
-
// Enumerate touches
|
|
11
|
-
for (let i = 0; i < touches.length; i++) {
|
|
12
|
-
var _prevTouchInfoRef$cur, _prevTouchInfoRef$cur2, _prevTouch$x, _prevTouch$y, _prevVelocityRef$curr, _prevVelocityRef$curr2, _prevVelocityRef$curr3, _prevVelocityRef$curr4;
|
|
13
|
-
if (!multiTouch && i > 0) {
|
|
14
|
-
break;
|
|
15
|
-
}
|
|
16
|
-
const touch = touches[i];
|
|
17
|
-
const prevTouch = prevTouchInfoRef.current[touch.id];
|
|
18
|
-
// Calculate the velocity from the previous touch.
|
|
19
|
-
const timeDiffseconds = touch.timestamp - ((_prevTouchInfoRef$cur = (_prevTouchInfoRef$cur2 = prevTouchInfoRef.current[touch.id]) === null || _prevTouchInfoRef$cur2 === void 0 ? void 0 : _prevTouchInfoRef$cur2.timestamp) !== null && _prevTouchInfoRef$cur !== void 0 ? _prevTouchInfoRef$cur : touch.timestamp);
|
|
20
|
-
const distX = touch.x - ((_prevTouch$x = prevTouch === null || prevTouch === void 0 ? void 0 : prevTouch.x) !== null && _prevTouch$x !== void 0 ? _prevTouch$x : touch.x);
|
|
21
|
-
const distY = touch.y - ((_prevTouch$y = prevTouch === null || prevTouch === void 0 ? void 0 : prevTouch.y) !== null && _prevTouch$y !== void 0 ? _prevTouch$y : touch.y);
|
|
22
|
-
if (touch.type !== TouchType.Start && touch.type !== TouchType.End && touch.type !== TouchType.Cancelled && timeDiffseconds > 0) {
|
|
23
|
-
prevVelocityRef.current[touch.id] = {
|
|
24
|
-
x: distX / timeDiffseconds / Platform.PixelRatio,
|
|
25
|
-
y: distY / timeDiffseconds / Platform.PixelRatio
|
|
26
|
-
};
|
|
27
|
-
}
|
|
28
|
-
const extendedTouchInfo = {
|
|
29
|
-
...touch,
|
|
30
|
-
velocityX: (_prevVelocityRef$curr = (_prevVelocityRef$curr2 = prevVelocityRef.current[touch.id]) === null || _prevVelocityRef$curr2 === void 0 ? void 0 : _prevVelocityRef$curr2.x) !== null && _prevVelocityRef$curr !== void 0 ? _prevVelocityRef$curr : 0,
|
|
31
|
-
velocityY: (_prevVelocityRef$curr3 = (_prevVelocityRef$curr4 = prevVelocityRef.current[touch.id]) === null || _prevVelocityRef$curr4 === void 0 ? void 0 : _prevVelocityRef$curr4.y) !== null && _prevVelocityRef$curr3 !== void 0 ? _prevVelocityRef$curr3 : 0
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
// Save previous touch
|
|
35
|
-
prevTouchInfoRef.current[touch.id] = touch;
|
|
36
|
-
if (touch.type === TouchType.Start) {
|
|
37
|
-
delete prevVelocityRef.current[touch.id];
|
|
38
|
-
handlers.onStart && handlers.onStart(touch);
|
|
39
|
-
} else if (touch.type === TouchType.Active) {
|
|
40
|
-
handlers.onActive && handlers.onActive(extendedTouchInfo);
|
|
41
|
-
} else {
|
|
42
|
-
handlers.onEnd && handlers.onEnd(extendedTouchInfo);
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
});
|
|
46
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
47
|
-
}, deps);
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
/**
|
|
51
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
52
|
-
* This touch handler only handles single touches.
|
|
53
|
-
* @param handlers Callbacks for the different touch states
|
|
54
|
-
* @param deps optional Dependency array to update the handlers
|
|
55
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
56
|
-
* update and handle touch events. Call it with the touches property from
|
|
57
|
-
* the info object.
|
|
58
|
-
*/
|
|
59
|
-
export const useTouchHandler = (handlers, deps = []) => {
|
|
60
|
-
return useInternalTouchHandler(handlers, deps, false);
|
|
61
|
-
};
|
|
62
|
-
|
|
63
|
-
/**
|
|
64
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
65
|
-
* This touch handler handles multiple touches.
|
|
66
|
-
* @param handlers Callbacks for the different touch states
|
|
67
|
-
* @param deps optional Dependency array to update the handlers
|
|
68
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
69
|
-
* update and handle touch events. Call it with the touches property from
|
|
70
|
-
* the info object.
|
|
71
|
-
*/
|
|
72
|
-
export const useMultiTouchHandler = (handlers, deps = []) => {
|
|
73
|
-
return useInternalTouchHandler(handlers, deps, true);
|
|
74
|
-
};
|
|
75
|
-
//# sourceMappingURL=useTouchHandler.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useCallback","useRef","Platform","TouchType","useInternalTouchHandler","handlers","deps","multiTouch","prevTouchInfoRef","prevVelocityRef","history","forEach","touches","i","length","_prevTouchInfoRef$cur","_prevTouchInfoRef$cur2","_prevTouch$x","_prevTouch$y","_prevVelocityRef$curr","_prevVelocityRef$curr2","_prevVelocityRef$curr3","_prevVelocityRef$curr4","touch","prevTouch","current","id","timeDiffseconds","timestamp","distX","x","distY","y","type","Start","End","Cancelled","PixelRatio","extendedTouchInfo","velocityX","velocityY","onStart","Active","onActive","onEnd","useTouchHandler","useMultiTouchHandler"],"sources":["useTouchHandler.ts"],"sourcesContent":["import type { DependencyList } from \"react\";\nimport { useCallback, useRef } from \"react\";\n\nimport type { Vector } from \"../skia/types\";\nimport { Platform } from \"../Platform\";\n\nimport type {\n ExtendedTouchInfo,\n TouchHandlers,\n TouchHandler,\n TouchInfo,\n} from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst useInternalTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = [],\n multiTouch = false\n): TouchHandler => {\n const prevTouchInfoRef = useRef<{ [key: number]: TouchInfo | undefined }>({});\n const prevVelocityRef = useRef<{ [key: number]: Vector | undefined }>({});\n\n return useCallback((history: Array<Array<TouchInfo>>) => {\n // Process all items in the current touch history\n history.forEach((touches) => {\n // Enumerate touches\n for (let i = 0; i < touches.length; i++) {\n if (!multiTouch && i > 0) {\n break;\n }\n\n const touch = touches[i];\n const prevTouch = prevTouchInfoRef.current[touch.id];\n // Calculate the velocity from the previous touch.\n const timeDiffseconds =\n touch.timestamp -\n (prevTouchInfoRef.current[touch.id]?.timestamp ?? touch.timestamp);\n\n const distX = touch.x - (prevTouch?.x ?? touch.x);\n const distY = touch.y - (prevTouch?.y ?? touch.y);\n\n if (\n touch.type !== TouchType.Start &&\n touch.type !== TouchType.End &&\n touch.type !== TouchType.Cancelled &&\n timeDiffseconds > 0\n ) {\n prevVelocityRef.current[touch.id] = {\n x: distX / timeDiffseconds / Platform.PixelRatio,\n y: distY / timeDiffseconds / Platform.PixelRatio,\n };\n }\n\n const extendedTouchInfo: ExtendedTouchInfo = {\n ...touch,\n velocityX: prevVelocityRef.current[touch.id]?.x ?? 0,\n velocityY: prevVelocityRef.current[touch.id]?.y ?? 0,\n };\n\n // Save previous touch\n prevTouchInfoRef.current[touch.id] = touch;\n\n if (touch.type === TouchType.Start) {\n delete prevVelocityRef.current[touch.id];\n handlers.onStart && handlers.onStart(touch);\n } else if (touch.type === TouchType.Active) {\n handlers.onActive && handlers.onActive(extendedTouchInfo);\n } else {\n handlers.onEnd && handlers.onEnd(extendedTouchInfo);\n }\n }\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, deps);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler only handles single touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = []\n): TouchHandler => {\n return useInternalTouchHandler(handlers, deps, false);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler handles multiple touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useMultiTouchHandler = (\n handlers: TouchHandlers,\n deps: DependencyList = []\n): TouchHandler => {\n return useInternalTouchHandler(handlers, deps, true);\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
export const __esModule: boolean;
|
|
2
|
-
/**
|
|
3
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
4
|
-
* This touch handler only handles single touches.
|
|
5
|
-
* @param handlers Callbacks for the different touch states
|
|
6
|
-
* @param deps optional Dependency array to update the handlers
|
|
7
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
8
|
-
* update and handle touch events. Call it with the touches property from
|
|
9
|
-
* the info object.
|
|
10
|
-
*/
|
|
11
|
-
export function useTouchHandler(handlers: any, deps?: any[]): (history: any) => void;
|
|
12
|
-
export function useMultiTouchHandler(handlers: any, deps?: any[]): (history: any) => void;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import type { DependencyList } from "react";
|
|
2
|
-
import type { TouchHandlers, TouchHandler } from "./types";
|
|
3
|
-
/**
|
|
4
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
5
|
-
* This touch handler only handles single touches.
|
|
6
|
-
* @param handlers Callbacks for the different touch states
|
|
7
|
-
* @param deps optional Dependency array to update the handlers
|
|
8
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
9
|
-
* update and handle touch events. Call it with the touches property from
|
|
10
|
-
* the info object.
|
|
11
|
-
*/
|
|
12
|
-
export declare const useTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
|
|
13
|
-
/**
|
|
14
|
-
* Provides a callback for handling touch events in the Skia View.
|
|
15
|
-
* This touch handler handles multiple touches.
|
|
16
|
-
* @param handlers Callbacks for the different touch states
|
|
17
|
-
* @param deps optional Dependency array to update the handlers
|
|
18
|
-
* @returns A function that can be used from within the onDraw callback to
|
|
19
|
-
* update and handle touch events. Call it with the touches property from
|
|
20
|
-
* the info object.
|
|
21
|
-
*/
|
|
22
|
-
export declare const useMultiTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
|