No Description

PincodeScreen.js 1.6KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import React from "react";
  2. import { StyleSheet, View, Text, Button } from 'react-native';
  3. import { globalStyles } from "../styles/global";
  4. import SmoothPinCodeInput from 'react-native-smooth-pincode-input';
  5. const pin = 123456;
  6. //comentario
  7. export default class App extends React.Component {
  8. pressHandler = () => {
  9. {/*Dentro del parentesis va el path al screen para redirigir*/}
  10. this.props.navigation.navigate('test')
  11. }
  12. state = {
  13. code: '',
  14. pincode: false,
  15. };
  16. pinInput = React.createRef();
  17. _checkCode = (code) => {
  18. if (code != pin) {
  19. this.pinInput.current.shake()
  20. .then(() => this.setState({ code: '' }));
  21. } else {
  22. this.setState({ pincode: true});
  23. }
  24. }
  25. render() {
  26. const { code } = this.state;
  27. const { pincode } = this.state;
  28. return (
  29. <View style={globalStyles.container}>
  30. {/* Pin container */}
  31. <View style={globalStyles.section}>
  32. <Text style={globalStyles.titleText}>Entra el Pin de la mocion</Text>
  33. <SmoothPinCodeInput
  34. ref={this.pinInput}
  35. value={code}
  36. codeLength={6}
  37. onTextChange={code => this.setState({ code })}
  38. onFulfill={this._checkCode}
  39. onBackspace={() => console.log('No more back.')}
  40. />
  41. </View>
  42. <View style={globalStyles.container}>
  43. { pincode && <Button title='Ir a mocion' onPress={this.pressHandler} />}
  44. </View>
  45. </View>
  46. );
  47. }
  48. }