我写这段代码是为了得到一个人的签名:
Add
运行此受library example启发的简单代码,我注意到Role assignments
被忽略了(import * as ExpoPixi from 'expo-pixi';
import React, { Component } from 'react';
import { Platform, AppState, StyleSheet, Text, View } from 'react-native';
const isAndroid = Platform.OS === 'android';
function uuidv4() {
// https://stackoverflow.com/a/2117523/4047926
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var r = (Math.random() * 16) | 0,
v = c == 'x' ? r : (r & 0x3) | 0x8;
return v.toString(16);
});
}
export default class App extends Component {
state = {
signature: null,
appState: AppState.currentState,
};
handleAppStateChangeAsync = nextAppState => {
if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') {
if (isAndroid && this.sketch) {
this.setState({ appState: nextAppState, id: uuidv4(), lines: this.sketch.lines });
return;
}
}
this.setState({ appState: nextAppState });
};
componentDidMount() {
AppState.addEventListener('change', this.handleAppStateChangeAsync);
}
componentWillUnmount() {
AppState.removeEventListener('change', this.handleAppStateChangeAsync);
}
onChange = async () => {
const { uri } = await this.sketch.takeSnapshotAsync();
this.setState({
signature: { uri },
}, () => console.log(this.state.signature));
}
render() {
return (
<View style={{flex: 1, backgroundColor: 'white'}}>
<View style={{flex: 1, left: '5%'}}>
<ExpoPixi.Signature
ref={signature => (this.sketch = signature)}
style={styles.pad}
strokeColor={'black'}
strokeAlpha={0.5}
onChange={this.onChange}
/>
</View>
</View>
);
}
}
const styles = StyleSheet.create({
pad: {
flex: 1,
width: '90%',
borderWidth: 0.6,
borderColor: '#b3b3b5',
borderRadius: 10,
backgroundColor: 'white'
},
});
的一角不见了),当我尝试编写签名时应用程序崩溃。
旁注:是否可以获取pad内容的base64编码版本而不是uri?