title: Using react-native-draw-on-screen package, missing Controls module?
body: <p>I'm trying to build a react native app with a drawing feature and I came across this package: <a href="https://www.npmjs.com/package/react-native-draw-on-screen" rel="nofollow noreferrer">https://www.npmjs.com/package/react-native-draw-on-screen</a></p>
  <p>This package was also mentioned in this post:
  <a href="https://stackoverflow.com/questions/42759560/how-to-draw-on-the-screen-with-react-native/48250747">How to draw on the screen with React Native?</a></p>
  <p>It seems that we have to import a module called 'Controls' based on the example, but I'm not sure if that code is provided in the package.
  I also tried looking up if react has anything related to <code>handleColorChange</code> or <code>handleBrushSizeChange</code>, but that seems to be specific to the Controls module.</p>
  <p>Is there something I could write in place of this module?
  I'd really appreciate any help on this!</p>
  <p>Below is the example code that the package provides:</p>
  <pre><code>import React from 'react';
  import { StyleSheet, View, SafeAreaView } from 'react-native';
  import RNDrawOnScreen from 'react-native-draw-on-screen';
  import Controls from './Controls';
   
  export default class App extends React.Component {
    state = {
      color: 'black',
      strokeWidth: 10,
    };
   
    changeColor = (color) =&gt; {
      this.setState({ color });
    };
   
    changeBrushSize = (strokeWidth) =&gt; {
      this.setState({ strokeWidth });
    };
   
    undo = () =&gt; {
      this.RNDraw.undo();
    };
   
    clear = () =&gt; {
      this.RNDraw.clear();
    };
   
    render() {
      return (
        &lt;SafeAreaView style={{ flex: 1 }}&gt;
          &lt;Controls
            handleColorChange={this.changeColor}
            handleBrushSizeChange={this.changeBrushSize}
            selectedColor={this.state.color}
            selectedStrokeWidth={this.state.strokeWidth}
            handleUndo={this.undo}
            handleClear={this.clear}
          /&gt;
          &lt;View
            style={{
              flex: 1,
              flexGrow: 1,
              border: 'solid',
              borderWidth: 2,
              borderColor: '#ccc',
            }}
          &gt;
            &lt;RNDrawOnScreen
              penColor={this.state.color}
              strokeWidth={this.state.strokeWidth}
              ref={(r) =&gt; (this.RNDraw = r)}
            /&gt;
          &lt;/View&gt;
        &lt;/SafeAreaView&gt;
      );
    }
  }
  </code></pre>
  <p>P.S. this is my first post on stackoverflow, would appreciate any feedback on asking good questions as well!</p>