Files
react-native-app/app/index.tsx
2025-03-30 18:34:12 +02:00

96 lines
2.3 KiB
TypeScript

import React, { useState } from 'react';
import { View, Text, TextInput, Button, StyleSheet } from 'react-native';
const BMICalculator = () => {
const [weight, setWeight] = useState<string>('');
const [height, setHeight] = useState<string>('');
const [bmi, setBmi] = useState<string | null>(null);
const [status, setStatus] = useState<string>('');
const calculateBMI = () => {
const w = parseFloat(weight);
const h = parseFloat(height) / 100;
if (w > 0 && h > 0) {
const bmiValue = (w / (h * h)).toFixed(2);
setBmi(bmiValue);
setStatus(getBMIStatus(bmiValue));
} else {
setBmi(null);
setStatus('');
}
};
const getBMIStatus = (bmi: string): string => {
const bmiValue = parseFloat(bmi);
if (bmiValue < 18.5) return 'Alulsúlyos';
if (bmiValue < 24.9) return 'Normál súlyú';
if (bmiValue < 29.9) return 'Túlsúlyos';
return 'Elhízott';
};
return (
<View style={styles.container}>
<Text style={styles.title}>BMI Kalkulátor</Text>
<TextInput
style={styles.input}
placeholder="Súly (kg)"
keyboardType="numeric"
value={weight}
onChangeText={setWeight}
/>
<TextInput
style={styles.input}
placeholder="Magasság (cm)"
keyboardType="numeric"
value={height}
onChangeText={setHeight}
/>
<Button title="BMI számítása" onPress={calculateBMI} />
{bmi && (
<View style={styles.resultContainer}>
<Text style={styles.result}>BMI: {bmi}</Text>
<Text style={styles.status}>{status}</Text>
</View>
)}
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
padding: 20,
backgroundColor: '#f5f5f5',
},
title: {
fontSize: 24,
fontWeight: 'bold',
marginBottom: 20,
},
input: {
width: '80%',
padding: 10,
borderWidth: 1,
borderColor: '#ccc',
borderRadius: 5,
marginBottom: 10,
backgroundColor: '#fff',
},
resultContainer: {
marginTop: 20,
alignItems: 'center',
},
result: {
fontSize: 20,
fontWeight: 'bold',
},
status: {
fontSize: 18,
color: 'blue',
},
});
export default BMICalculator;