0

In order to build a drawing app, one needs mouse position, preferably in real time (only seems slightly necessary) and a canvas. For the canvas I am using react-native-canvas, and a touchable to detect mouse movement like so:

export default class App extends Component {
    render() {
        return (
            <View style={style.width100}>
                <Touchable style={style.width100} onPressIn={() => Alert.alert("TouchStart")} onPressOut={() => Alert.alert("TouchEnd")}>
                    <Canvas ref={handler}/>
                </Touchable>
            </View>
        )
    }
}

const style = Stylesheet.create({
    width100: {
        width: Dimensions.get('window').width, 
        height: Dimensions.get('window').height
    }
})

This is only a snippet, I've actually got a whole lot more stuff here like imports etc, but this is the important stuff...

The handler method makes the canvas' background black, which takes up the full screen, however, when I touch the screen, nothing happens.

I've tried using the onPress handler instead, but same result.

If this is a really basic question, I apologise, I'm quite new. Thanks for understanding.

J-Cake
  • 1,526
  • 1
  • 15
  • 35
  • Maybe a stupid question... but who uses a mouse on a mobile device? If you are talking about tracking touches... maybe have a look at this: https://facebook.github.io/react-native/docs/gesture-responder-system – bo-oz Jan 09 '19 at 14:24
  • I found this topic as well, might be worth reading: https://stackoverflow.com/questions/36862765/react-native-get-the-coordinates-of-my-touch-event – bo-oz Jan 09 '19 at 14:26
  • Hi @bo-oz in response to your first question, I'm not using a mouse, I'm referring to the touch coordinates, and if there is a way to implement Multitouch that would be fantastic – J-Cake Jan 09 '19 at 14:34
  • I think you could register to any of the touch events and get the stream of data. Please take a look at both links I shared. Pretty easy to achieve it seems. – bo-oz Jan 09 '19 at 14:37
  • Thanks, I'm reading this at the moment and it seems the touchResponder is my solution – J-Cake Jan 09 '19 at 14:39

0 Answers0