i am having this error when using react-native-digital-ink in my react native expo project i have come already a longway in my expo project now i have to add a feature draw to text in my app and i am struggling with it and i could only found a single package for this "react-native-digital-ink" this error is consistent on android and ios both platforms.
ERROR Invariant Violation: requireNativeComponent: "RCTDigitalInkView" was not
found in the UIManager.
import * as React from 'react';
import { useRef } from 'react';
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import DigitalInk, { DigitalInkView } from 'react-native-digital-ink';
const Canvas = () => {
const [result, setResult] = React.useState<void>();
const [status, setStatus] = React.useState(true);
const digitalInkView1: any = useRef();
const onClick = (e: any) => {
setStatus(!status);
console.log('onClick', e.nativeEvent);
};
const onDrawStart = (e: any) => {
console.log('onDrawStart', e.nativeEvent);
};
const onDrawEnd = (e: any) => {
console.log('onDrawEnd', e.nativeEvent);
};
React.useEffect(() => {
DigitalInk.show('Hello', DigitalInk.SHORT);
}, []);
const clearDigitalInkViewHandler = async () => {
const languageTag = 'af';
const result = await DigitalInk.downloadModel(languageTag);
setResult(result);
};
return (
<View style={styles.container}>
<Text style={styles.resultText}>Result: {result}</Text>
<DigitalInkView
ref={digitalInkView1}
status={status}
onClick={onClick}
onDrawStart={onDrawStart}
onDrawEnd={onDrawEnd}
style={{
width: '90%',
height: 400,
backgroundColor: '#dcdcdc',
}}
/>
<TouchableOpacity
style={styles.button}
onPress={clearDigitalInkViewHandler}
>
<Text style={styles.buttonText}>Recognize2</Text>
</TouchableOpacity>
</View>
);
}
export default Canvas;
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
button: {
width: '80%',
height: 45,
marginTop: 20,
backgroundColor: '#0387AC',
borderRadius: 15,
justifyContent: 'center',
alignItems: 'center',
},
buttonText: {
fontSize: 20,
color: 'white',
},
resultText: {
fontSize: 30,
marginBottom: 15,
},
});
i have tried the package with both the platforms.