Membuat BMI kalkulator

💚 Aplikasi BMI Flutter dengan UI Modern & Gen-Z Friendly

Di era sekarang, aplikasi kesehatan nggak cuma soal fungsi, tapi juga soal tampilan. Nah di artikel ini, kita bakal ngebahas aplikasi BMI Calculator berbasis Flutter dengan desain glassmorphism, gradasi warna soft, dan UX yang ramah semua umur—terutama Gen-Z 😎

---

📌 Apa itu BMI?

BMI (Body Mass Index) adalah metode sederhana untuk mengetahui apakah berat badan kita tergolong ideal atau tidak berdasarkan tinggi dan berat badan.

Rumus BMI:
Berat Badan (kg) ÷ (Tinggi Badan (m) × Tinggi Badan (m))

---

✨ Fitur Utama Aplikasi

• 🎨 UI modern dengan efek glass & gradient
• 📏 Input tinggi & berat badan
• 🧑‍🤝‍🧑 Pilihan gender
• 📊 Hasil BMI real-time
• 💡 Saran kesehatan otomatis
• 📱 Responsive & clean design

---

🧠 Cara Kerja Aplikasi

1. User memasukkan tinggi badan
2. User memasukkan berat badan
3. User memilih gender
4. Tombol Calculate ditekan
5. BMI + kategori + saran langsung muncul

---

🧩 Source Code Flutter BMI Calculator

Berikut adalah source code lengkap aplikasi BMI Calculator Flutter dengan UI modern (glassmorphism & gradient). Silakan copy–paste ke file main.dart.

// main.dart
import 'dart:ui';
import 'package:flutter/material.dart';

void main() {
  runApp(const BMICalculatorApp());
}

class BMICalculatorApp extends StatelessWidget {
  const BMICalculatorApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'BMI Tracker',
      theme: ThemeData(
        fontFamily: 'Poppins',
        useMaterial3: true,
        colorSchemeSeed: const Color(0xFF5E8B7E),
      ),
      home: const BMICalculatorPage(),
    );
  }
}

class BMICalculatorPage extends StatefulWidget {
  const BMICalculatorPage({super.key});

  @override
  State createState() => _BMICalculatorPageState();
}

class _BMICalculatorPageState extends State {
  final heightController = TextEditingController();
  final weightController = TextEditingController();

  double bmi = 0;
  String category = "";
  String advice = "";
  String selectedGender = "male";

  void calculateBMI() {
    final h = double.tryParse(heightController.text) ?? 0;
    final w = double.tryParse(weightController.text) ?? 0;

    if (h <= 0 || w <= 0) return;

    final result = w / ((h / 100) * (h / 100));

    setState(() {
      bmi = result;

      if (bmi < 18.5) {
        category = "Underweight";
        advice = selectedGender == "male"
            ? "Tingkatkan asupan protein dan latihan kekuatan 💪"
            : "Perbanyak nutrisi seimbang dan pola makan teratur 🍽️";
      } else if (bmi < 25) {
        category = "Healthy";
        advice = "Kondisi tubuh ideal, pertahankan gaya hidup sehat ✨";
      } else if (bmi < 30) {
        category = "Overweight";
        advice = selectedGender == "male"
            ? "Kurangi junk food dan rutin olahraga 🏃"
            : "Tetap aktif dan jaga porsi makan 💃";
      } else {
        category = "Obese";
        advice = "Mulai perubahan kecil demi kesehatan ❤️";
      }
    });
  }

  Color getResultColor() {
    if (category == "Healthy") return Colors.greenAccent;
    if (category == "Underweight") return Colors.orangeAccent;
    if (category == "Overweight") return Colors.deepOrangeAccent;
    if (category == "Obese") return Colors.redAccent;
    return Colors.white;
  }
}

💡 Tips: Jangan lupa tambahkan font Poppins di pubspec.yaml agar tampilan sesuai.

---

🔥 Penutup

Dengan Flutter, bikin aplikasi kesehatan yang modern dan menarik itu nggak ribet. Kombinasikan logika sederhana dan desain yang niat, hasilnya bisa jauh lebih engaging.

Jangan cuma ngoding, bikin juga aplikasimu enak dilihat 😉