Я не могу получить какой-либо результат или ошибки, когда я рисую подписи в приложении expo - PullRequest
0 голосов
/ 29 мая 2019

Я создаю небольшое собственное приложение реакции, используя expo, я пытаюсь запустить пример, приведенный в https://www.npmjs.com/package/react-native-signature-canvas для рисования подписей, я получаю интерфейс, но я не могу рисовать, и я не получая никакого результата.

Мой код:

import React from 'react';
import { StyleSheet, Text, View, Image } from 'react-native';
import Signature from 'react-native-signature-canvas';

class SignatureScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = { signature: null };
  }

  handleSignature = signature => {
    this.setState({ signature });
  };

  render() {
    const style = `.m-signature-pad--footer
    .button {
      background-color: blue;
      color: #FFF;
    }`;
    return (
      <View style={{ flex: 1 }}>
        <View style={styles.preview}>
          {this.state.signature ? (
            <Image
              resizeMode={"contain"}
              style={{ width: 335, height: 114 }}
              source={{ uri: this.state.signature }}
            />
          ) : null}
        </View>
        <Signature
          onOK={this.handleSignature}
          descriptionText="Sign"
          clearText="Clear"
          confirmText="Save"
          webStyle={style}
        />
      </View>
    );
  }
}

export default SignatureScreen;

const styles = StyleSheet.create({
  preview: {
    width: 335,
    height: 114,
    backgroundColor: "#F8F8F8",
    justifyContent: "center",
    alignItems: "center",
    marginTop: 15
  },
  previewText: {
    color: "#FFF",
    fontSize: 14,
    height: 40,
    lineHeight: 40,
    paddingLeft: 10,
    paddingRight: 10,
    backgroundColor: "#69B2FF",
    width: 120,
    textAlign: "center",
    marginTop: 10
  }
});

Я что-то упустил?

1 Ответ

0 голосов
/ 29 мая 2019

не могли бы вы попробовать этот код?

 handleSignature = signature => {
    console.log(signature);
    this.setState({ signature });
  };
...
  render() {
    return (
      <View style={{ flex: 1 }}>
        <View style={styles.preview}>
          {this.state.signature ? (
            <Image
              resizeMode={"contain"}
              style={{ width: 335, height: 114 }}
              source={{ uri: this.state.signature }}
            />
          ) : null}
        </View>
        <SignatureScreen onOK={this.handleSignature} />
      </View>
    );
  }
}
...