//Exer04

  constructor(props) {
    super(props);
    this.state = { Nome: "", Sobrenome: "", Idade: "" };

  }
  render() {
    return (
      <View style={{ margin: 50, borderWidth: 8, padding: 10, borderColor: "#8cedc8", backgroundColor: "#f2e1c4" }}>

        <View>
          <Text style={{ textAlign: "center", marginTop: 10, fontSize: 25, }}>Cadastro do cliente</Text>

          <Text style={{ fontSize: 20, marginTop: 10, }}> Nome:</Text><TextInput style={{ borderBottomWidth: 1, fontSize: 30 }}
            onChangeText={(txt) => this.setState({ Nome: txt })}
            value={this.state.Nome}>

          </TextInput>
          <Text style={{ fontSize: 20, }}> Sobrenome:</Text><TextInput style={{ borderBottomWidth: 1, fontSize: 30 }}
            onChangeText={(txt) => this.setState({ Sobrenome: txt })}
            value={this.state.Sobrenome}>

          </TextInput>
          <Text style={{ fontSize: 20, }}>Idade:</Text><TextInput style={{ borderBottomWidth: 1, fontSize: 30 }}
            onChangeText={(txt) => this.setState({ Idade: txt })}
            value={this.state.Idade}>

          </TextInput>
        </View>

        <View style={{ marginLeft: 20, marginRight: 20, borderColor: "black", borderWidth: 2, marginTop: 20, }}>

          <Button
            title="Enviar!"
            onPress={() => alert("Nome: " + this.state.Nome + "\n" + "Sobrenome: " + this.state.Sobrenome + "\n" + "Idade: " + this.state.Idade)}
            color="#8cedc8">

          </Button>
        </View>
        <View style={{ marginLeft: 20, marginRight: 20, marginTop: 10, borderColor: "black", borderWidth: 2, }}>
          <Button
            title="Apagar"
            onPress={() => this.setState({ Nome: "", Sobrenome: "", Idade: "" })}
            color="#8cedc8">
          </Button>
        </View>


      </View>

    );
  };
}