import { useState } from 'react';
import { Button, StyleSheet, Text, TextInput, View } from 'react-native';
export default function App() {
const [valor1, setValor1] = useState(0);
const [valor2, setValor2] = useState(0);
const [resultado, setResultado] = useState<null|number>(null);
return (
<View style={styles.container}>
<View style={styles.linha}>
<Text style={styles.texto}>Valor 1: </Text>
<Text style={styles.texto}>Valor 2: </Text>
</View>
<View style={styles.linha}>
<TextInput placeholder="Digite o valor 1" keyboardType='decimal-pad' onChangeText={valor => setValor1(+valor)}/>
<TextInput placeholder="Digite o valor 2" keyboardType='decimal-pad' onChangeText={valor => setValor2(+valor)}/>
</View>
<Button title="Calcular" onPress={() => setResultado(valor1+valor2)} />
{ resultado && <View style={[styles.linha, {marginTop: 30}]}>
<Text style={styles.texto}>Resultado: </Text>
<Text style={styles.texto}>{resultado}</Text>
</View>}
</View>
);
}
const styles = StyleSheet.create({
container: {
padding: 50
},
texto: { fontSize: 16},
linha: {
flexDirection: 'row',
justifyContent: 'space-between'
}
});
Comments
0 B
|👍
/👎
0 B
|👍
/👎
0 B
|👍
/👎