Open nesibeyyubov opened 4 years ago
there are utility me utility methods provided for undo, clean. You can use that.
How do we reference the canvas to be able to use these methods? I created my own undo, clear buttons outside of canvas frame. I do want to implement undo mechanism by clicking a touchable opacity onPress={() => something.undo()}
. How can I achieve this?
Try to use ref for it.
import { Button, StyleSheet, View } from 'react-native';
import { SketchCanvas } from '@terrylinla/react-native-sketch-canvas';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
});
const Sketch = () => {
const sketchRef = React.createRef<SketchCanvas>();
const handleClear = () => {
sketchRef.current.clear();
};
return (
<View style={styles.container}>
<Button title="clear" onPress={handleClear} />
<View style={{ flex: 1, flexDirection: 'row' }}>
<SketchCanvas ref={sketchRef} style={{ flex: 1 }} strokeColor={'red'} strokeWidth={7} />
</View>
</View>
);
};
export default Sketch;
I am using SketchCanvas (named export) But also i want to use methods like undo and clear, but i don't know the way we can access them