react-native-canvas-anonymous
Changed WebView property crossOrigin to "anonymous"
A Canvas component for React Native
npm install react-native-webviewreact-native link react-native-webviewnpm install react-native-canvas
Usage
import React, { Component } from 'react';import Canvas from 'react-native-canvas'; class App extends Component { handleCanvas = (canvas) => { const ctx = canvas.getContext('2d'); ctx.fillStyle = 'purple'; ctx.fillRect(0, 0, 100, 100); } render() { return ( <Canvas ref={this.handleCanvas}/> ) }}
API
Canvas
Canvas#height
Reflects the height of the canvas in pixels
Canvas#width
Reflects the width of the canvas in pixels
Canvas#getContext()
Returns a canvas rendering context. Currently only supports 2d context.
Canvas#toDataURL()
Returns a Promise
that resolves to DataURL.
CanvasRenderingContext2D
Standard CanvasRenderingContext2D. MDN. Only difference is await
should be used to retrieve values from methods.
const ctx = canvas;
Image
WebView Image constructor. Unlike in the browsers accepts canvas as first argument. MDN
const image = canvas height width;