@nativescript/canvas NPM | npm.io

1.1.0 • Published 8 months ago

Install

Weekly downloads

31

License

Apache-2.0

Repository

Last release

8 months ago

NativeScript Canvas

Powered by

CanvasNative - Rust
CanvasNative - IOS
CanvasNative - Android

Installation

ns plugin add @nativescript/canvas

Note min ios support 10 | min android support 17

IMPORTANT: ensure you include xmlns:canvas="@nativescript/canvas" on the Page element for core {N}

Usage

<canvas:Canvas id="canvas" width="100%" height="100%" ready="canvasReady"/>

2D

let ctx;
let canvas;
export function canvasReady(args) {
  console.log('canvas ready');
  canvas = args.object;
  console.log(canvas);
  ctx = canvas.getContext('2d');
  ctx.fillStyle = 'green';
  ctx.fillRect(10, 10, 150, 100);
}

WEBGL

let gl;
let canvas;
export function canvasReady(args) {
  console.log('canvas ready');
  canvas = args.object;
  gl = canvas.getContext('webgl'); // 'webgl' || 'webgl2'
  gl.viewport(0, 0,
  gl.drawingBufferWidth, gl.drawingBufferHeight);
  // Set the clear color to darkish green.
  gl.clearColor(0.0, 0.5, 0.0, 1.0);
  // Clear the context with the newly set color. This is
  // the function call that actually does the drawing.
  gl.clear(gl.COLOR_BUFFER_BIT);
  canvas.flush(); // must be called to draw on screen
}

API

2D Similar to -> the Web Spec
WebGL Similar to -> the Web Spec
WebGL2 Similar to -> the Web Spec

NativeScript JavaScript TypeScript iOS Android

@infinitebrahmanuniverse/nolb-_nati @everything-registry/sub-chunk-635 @nativescript/canvas-polyfill

2.0.0-webgpu.39

8 months ago

2.0.0-webgpu.38

8 months ago

2.0.0-webgpu.37

8 months ago

2.0.0-webgpu.36

8 months ago

2.0.0-webgpu.35

8 months ago

2.0.0-webgpu.34

8 months ago

2.0.0-webgpu.33

8 months ago

2.0.0-webgpu.31

10 months ago

2.0.0-webgpu.30

10 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

2.0.0-webgpu.11

10 months ago

2.0.0-webgpu.10

10 months ago

10 months ago

10 months ago

10 months ago

2.0.0-webgpu.22

10 months ago

2.0.0-webgpu.21

10 months ago

2.0.0-webgpu.20

10 months ago

2.0.0-webgpu.19

10 months ago

2.0.0-webgpu.18

10 months ago

2.0.0-webgpu.17

10 months ago

2.0.0-webgpu.16

10 months ago

2.0.0-webgpu.15

10 months ago

2.0.0-webgpu.14

10 months ago

2.0.0-webgpu.13

10 months ago

2.0.0-webgpu.12

10 months ago

2.0.0-webgpu.29

10 months ago

2.0.0-webgpu.28

10 months ago

2.0.0-webgpu.27

10 months ago

2.0.0-webgpu.26

10 months ago

2.0.0-webgpu.25

10 months ago

2.0.0-webgpu.24

10 months ago

2.0.0-webgpu.23

10 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago