Nimble Pirate Monitor

    @cobinhood/react-native-canvas

    0.1.24 • Public • Published

    react-native-canvas

    A Canvas component for React Native

    npm 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.getContext('2d');

    Image

    WebView Image constructor. Unlike in the browsers accepts canvas as first argument. MDN

    const image = new Image(canvas, height, width);

    Keywords

    none

    Install

    npm i @cobinhood/react-native-canvas

    DownloadsWeekly Downloads

    2

    Version

    0.1.24

    License

    none

    Unpacked Size

    139 kB

    Total Files

    16

    Last publish

    Collaborators

    • boczeratul
    • catsass19
    • cobinhood-dev