Scribd
Upload
6 views2 pages

Bmi Calculator

The document describes a BMI Calculator program built using React Native. It allows users to input their height and weight, calculates the BMI when a button is pressed, and displays the result. The program includes basic styling for input fields and result display.

Uploaded by

siva61082120500
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
6 views2 pages

Bmi Calculator

The document describes a BMI Calculator program built using React Native. It allows users to input their height and weight, calculates the BMI when a button is pressed, and displays the result. The program includes basic styling for input fields and result display.

Uploaded by

siva61082120500
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

BMI CALCULATOR PROGRAM

import React, { useState } from 'react';


import { View, TextInput, Text, Button, StyleSheet } from 'react-native';
const BMICalculator = () => {
const [height, setHeight] = useState('');
const [weight, setWeight] = useState('');
const [bmi, setBMI] = useState(null);

const calculateBMI = () => {


const heightInMeters = height / 100;
const bmiValue = weight / (heightInMeters * heightInMeters);
setBMI(bmiValue.toFixed(2));
};

return (
<View style={styles.container}>
<Text > Height:</Text><TextInput
style={styles.input}
onChangeText={text => setHeight(text)}
value={height}
placeholder="Height (cm)"
keyboardType="numeric"
/>
<Text >Weight:</Text><TextInput
style={styles.input}
onChangeText={text => setWeight(text)}
value={weight}
placeholder="Weight (kg)"
keyboardType="numeric"
/>
<Button
title="Calculate BMI"
onPress={calculateBMI}
/>
{bmi !== null && (
<Text style={styles.resultText}>
Your BMI: {bmi}
</Text>
)}
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 20,
},
input: {
width: '100%',
height: 40,
borderColor: 'gray',
borderWidth: 1,
marginBottom: 20,
paddingHorizontal: 10,
},
resultText: {
marginTop: 20,
fontSize: 20,
fontWeight: 'bold',
},
});

export default BMICalculator;

You might also like