feat(): canvas updates

Author: triniwiz

CanvasNative.podspec

@@ -2,7 +2,7 @@ Pod::Spec.new do |s|
 
     s.name         = "CanvasNative"
 
-    s.version      = "0.9.3"
+    s.version      = "0.9.4"
 
     s.summary      = "A Canvas library"
 

packages/canvas/Canvas/common.ts

@@ -1,6 +1,6 @@
-import { CSSType, PercentLength, View, Screen, GestureStateTypes, Utils, Application } from '@nativescript/core';
-import { CanvasRenderingContext, TouchList } from '../common';
-import { Pointer } from '@nativescript/core/ui/gestures';
+import {CSSType, PercentLength, View, Screen, GestureStateTypes, Utils, Application} from '@nativescript/core';
+import {CanvasRenderingContext, TouchList} from '../common';
+import {Pointer} from '@nativescript/core/ui/gestures';
 
 export interface ICanvasBase {
 	on(eventName: 'ready', callback: (data: any) => void, thisArg?: any): void;
@@ -66,7 +66,7 @@ export abstract class CanvasBase extends View implements ICanvasBase {
 			if (contextOpts.alpha !== undefined && typeof contextOpts.alpha === 'boolean') {
 				return contextOpts;
 			} else {
-				return { alpha: true };
+				return {alpha: true};
 			}
 		}
 		const setIfDefined = (prop, value) => {
@@ -122,44 +122,68 @@ export abstract class CanvasBase extends View implements ICanvasBase {
 		}
 	}
 
+	_previousX = 0;
+	_previousY = 0;
+
 	_getTouchEvent(name, event, target) {
 		const pointers = new TouchList();
-		const scale = 1;
+		let scale = 1;
 		let activePointer: {};
+
 		if (name === 'touchmove') {
 			name = 'touchmove';
+			let x = 0;
+			let y = 0;
+			if (global.isIOS) {
+				x = event.deltaX + this.__touchStart?.getX() ?? 0;
+				y = event.deltaY + this.__touchStart?.getY() ?? 0;
+			} else {
+				const initial: android.view.MotionEvent = event.android.initial;
+				const current: android.view.MotionEvent = event.android.current;
+				scale = Screen.mainScreen.scale;
+				if(initial){
+					x = initial.getX() / scale;
+					y = initial.getY() / scale;
+				}else {
+					x = current.getX() / scale;
+					y = current.getY()/ scale;
+				}
+			}
+
 			/* mouse */
 			activePointer = {
-				clientX: event.deltaX * scale,
-				clientY: event.deltaY * scale,
+				clientX: x,
+				clientY: y,
 				force: 0.0,
 				identifier: 0,
-				pageX: event.deltaX * scale,
-				pageY: event.deltaY * scale,
+				pageX: x,
+				pageY: y,
 				radiusX: 0,
 				radiusY: 0,
 				rotationAngle: 0,
-				screenX: event.deltaX * scale,
-				screenY: event.deltaY * scale,
+				screenX: x,
+				screenY: y,
 				target,
 			};
 
 			/* mouse */
 			pointers.push({
 				// * SCALE ??
-				clientX: event.deltaX * scale,
-				clientY: event.deltaY * scale,
+				clientX: x,
+				clientY: y,
 				force: 0.0,
 				identifier: 0,
-				pageX: event.deltaX * scale,
-				pageY: event.deltaY * scale,
+				pageX: x,
+				pageY: y,
 				radiusX: 0,
 				radiusY: 0,
 				rotationAngle: 0,
-				screenX: event.deltaX * scale,
-				screenY: event.deltaY * scale,
+				screenX: x,
+				screenY: y,
 				target,
 			});
+			this._previousX = event.deltaX;
+			this._previousY = event.deltaY;
 		} else if (name === 'touchmove:pinch') {
 			name = 'touchmove';
 			const x = event.getFocusX();
@@ -259,8 +283,10 @@ export abstract class CanvasBase extends View implements ICanvasBase {
 			shiftKey: false,
 			targetTouches: pointers,
 			touches: pointers,
-			preventDefault: () => {},
-			stopPropagation: () => {},
+			preventDefault: () => {
+			},
+			stopPropagation: () => {
+			},
 			target,
 			...activePointer,
 		};
@@ -326,7 +352,7 @@ export abstract class CanvasBase extends View implements ICanvasBase {
 		}
 		if (typeof value === 'number') {
 			// treat as px
-			return value|| 0;
+			return value || 0;
 		} else if ((value !== null || true) && typeof value === 'object' && typeof value.value && typeof value.unit) {
 			if (value.unit === 'px') {
 				return value.value || 0;

packages/canvas/Canvas/index.android.ts

@@ -33,7 +33,7 @@ export class Canvas extends CanvasBase {
 		}
 		const activity =
 			Application.android.foregroundActivity || Application.android.startActivity;
-		this._canvas = new com.github.triniwiz.canvas.CanvasView(activity, useCpu);
+		this._canvas = new com.github.triniwiz.canvas.TNSCanvas(activity, useCpu);
 	}
 
 	get android() {
@@ -125,7 +125,7 @@ export class Canvas extends CanvasBase {
 			}
 		});
 		this._canvas.setListener(
-			new com.github.triniwiz.canvas.CanvasView.Listener({
+			new com.github.triniwiz.canvas.TNSCanvas.Listener({
 				contextReady() {
 					const owner = ref.get() as any;
 					if (owner && !owner._ready) {
@@ -202,15 +202,15 @@ export class Canvas extends CanvasBase {
 				}
 				rootParams.width = size.width;
 				rootParams.height = size.height;
-				let surfaceParams = this._canvas.getSurface().getLayoutParams();
+				let surfaceParams// = this._canvas.getSurface().getLayoutParams();
 				if (!surfaceParams) {
 					surfaceParams = new android.widget.FrameLayout.LayoutParams(0, 0);
 				}
-				surfaceParams.width = size.width;
-				surfaceParams.height = size.height;
+			//	surfaceParams.width = size.width;
+			//	surfaceParams.height = size.height;
 
 				this._canvas.setLayoutParams(rootParams);
-				this._canvas.getSurface().setLayoutParams(surfaceParams);
+				//this._canvas.getSurface().setLayoutParams(surfaceParams);
 
 				const w = android.view.View.MeasureSpec.makeMeasureSpec(
 					size.width,

packages/canvas/Canvas/index.ios.ts

@@ -159,6 +159,10 @@ export class Canvas extends CanvasBase {
 
 	disposeNativeView(): void {
 		this.off('touch, pan', this._touchEvents);
+		this._canvas.setListener(null);
+		this._readyListener = undefined;
+		this._canvas = undefined;
+		this.setNativeView(undefined);
 		super.disposeNativeView();
 	}