Scribd
Carregar
6 visualizações2 páginas

Calculadora de IMC em React Native

O documento apresenta um aplicativo React Native que calcula o Índice de Massa Corporal (IMC) com base no peso e altura fornecidos pelo usuário. Ele utiliza estados para armazenar os valores de peso, altura, resultado e legenda, e exibe a classificação do IMC após o cálculo. O aplicativo inclui campos de entrada para peso e altura, além de um botão para realizar o cálculo.

Enviado por

jonatas.aula1
Direitos autorais
© All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
6 visualizações2 páginas

Calculadora de IMC em React Native

O documento apresenta um aplicativo React Native que calcula o Índice de Massa Corporal (IMC) com base no peso e altura fornecidos pelo usuário. Ele utiliza estados para armazenar os valores de peso, altura, resultado e legenda, e exibe a classificação do IMC após o cálculo. O aplicativo inclui campos de entrada para peso e altura, além de um botão para realizar o cálculo.

Enviado por

jonatas.aula1
Direitos autorais
© All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd

import React from 'react';

import { View, Text, TextInput, StyleSheet, Button } from 'react-native';

export default function App() {


// Estado para armazenar peso, altura, resultado e legenda
const [peso, setPeso] = useState('');
const [altura, setAltura] = useState('');
const [result, setResult] = useState(null);
const [legenda, setLegenda] = useState('');

// Função para calcular o IMC


const calcularIMC = () => {
if (peso && altura) {
let imc = [Link](',' , '.') / ([Link](',' , '.') * [Link](',' , '.'));
// Atualiza o estado com o resultado do IMC
setResult([Link](2));
// Define a classificação do IMC
if (imc < 18.5) {
setLegenda('Abaixo do peso');
} else if (imc >= 18.5 && imc < 24.9) {
setLegenda('Peso normal');
} else if (imc >= 25 && imc < 29.9) {
setLegenda('Sobrepeso');
} else {
setLegenda('Obesidade');
}
} else {
alert('Por favor, insira o peso e a altura.');
}
};

return (
<View style={[Link]}>
<Text style={[Link]}>Seu IMC</Text>

<View>
<Text style={[Link]}>{imc}</Text>
<Text style={[Link]}>{legenda}</Text>
</View>

<View>
<TextInput
style={[Link]}
placeholder="Peso (kg)"
keyboardType="numeric"
value={peso}
onChangeText={setPeso}
/>
<TextInput
style={[Link]}
placeholder="Altura (m)"
keyboardType="numeric"
value={altura}
onChangeText={setAltura}
/>

<Button title="Calcular" onPress={calcularIMC} />


</View>
</View>
);
}

const styles = [Link]({


app: {
padding: 10,
},

legenda: {
textAlign: 'center',
fontWeight: 'bold',
},

resultado: {
textAlign: 'center',
fontSize: 22,
fontWeight: 'bold',
},

diagnostico: {
textAlign: 'center',
fontSize: 16,
},

peso: {
borderColor: '#000',
borderWidth: 1,
},

altura: {
borderColor: '#000',
borderWidth: 1,
},
});

Você também pode gostar