melby.membuat/apk/CALCULATORBMI



## 💖 BMI Calculator Flutter – Pink Aesthetic with Healthy Advice


Halo semuanya! ✨

Pada postingan kali ini aku mau berbagi sebuah project Flutter sederhana tapi cantik, yaitu **BMI Calculator App** dengan **tema pink aesthetic** 🌸 yang juga memberikan **saran kesehatan yang lembut dan positif** berdasarkan hasil BMI.


🔗 **Link Demo Aplikasi (Zapp.run):**

👉 [https://zapp.run/edit/flutter-zok06dhol06?entry=lib/main.dart&file=lib/main.dart](https://zapp.run/edit/flutter-zok06dhol06?entry=lib/main.dart&file=lib/main.dart)


Kamu bisa langsung mencoba aplikasinya secara online tanpa install apa pun 💕


---


## 📱 Apa itu BMI?


BMI (Body Mass Index) adalah metode untuk mengetahui apakah berat badan seseorang termasuk **kurus, normal, berlebih, atau obesitas** berdasarkan perbandingan tinggi dan berat badan.


Aplikasi ini dibuat untuk membantu pengguna menghitung BMI dengan cara yang **mudah, ramah, dan aesthetic** 💖


---


## 🎀 Fitur Aplikasi


Aplikasi BMI Calculator ini memiliki beberapa fitur utama, antara lain:


✅ Input tinggi badan (cm)

✅ Input berat badan (kg)

✅ Tombol hitung BMI

✅ Menampilkan hasil angka BMI

✅ Menampilkan kategori BMI

✅ Memberikan **saran kesehatan yang halus & suportif** 🌷

✅ Tampilan UI pink pastel yang aesthetic


---


## 🧠 Logika Perhitungan BMI


Perhitungan BMI pada aplikasi ini menggunakan rumus:


```

BMI = berat badan / (tinggi badan × tinggi badan)

```


Hasil BMI kemudian dikelompokkan menjadi:


* **< 18.5** → Kurus 🥺

* **18.5 – 24.9** → Normal 💕

* **25 – 29.9** → Berat Berlebih 😮

* **≥ 30** → Obesitas ⚠️


Setiap kategori akan menampilkan **pesan saran berbeda** yang ditulis dengan bahasa lembut agar tidak terkesan menghakimi 🤍


---


## 🌸 Tampilan Pink Aesthetic


Aplikasi ini dirancang dengan konsep **soft & calming**, menggunakan:


🎨 Background gradient pink pastel

💳 Card UI rounded dengan shadow

💖 Emoji dan teks ramah

✨ Layout sederhana dan bersih


Tujuannya supaya aplikasi terasa **nyaman digunakan dan enak dipandang**.


---


## 💡 Kenapa Ditambahkan Saran?


Selain menampilkan angka BMI, aplikasi ini juga memberikan **saran kesehatan** agar pengguna:


* Lebih peduli pada tubuhnya

* Tidak merasa insecure

* Termotivasi untuk hidup lebih sehat 🌿


Contohnya:


* BMI kurus → saran makan teratur & istirahat

* BMI normal → motivasi untuk mempertahankan pola hidup sehat

* BMI berlebih → ajakan pelan-pelan hidup sehat


---


## 🧩 Konsep Flutter yang Digunakan


Beberapa konsep Flutter yang digunakan dalam aplikasi ini:


* **StatefulWidget** untuk perubahan data

* **setState()** untuk update UI

* **TextEditingController** untuk input user

* UI dengan **Container, Column, Card, dan Button**


Project ini cocok banget untuk **pemula Flutter** yang ingin belajar UI + logic + state management dasar ✨


---


## 📌 Penutup


Aplikasi BMI Calculator ini adalah contoh project Flutter sederhana dengan tampilan menarik dan fungsi yang bermanfaat.

Kalau kamu tertarik, langsung saja coba aplikasinya di link berikut:


🔗 **Demo Aplikasi:**

👉 [https://zapp.run/edit/flutter-zok06dhol06?entry=lib/main.dart&file=lib/main.dart](https://zapp.run/edit/flutter-zok06dhol06?entry=lib/main.dart&file=lib/main.dart)

Komentar

Posting Komentar

Postingan populer dari blog ini

ARTIKEL PENGEMBANGAN GIM

Gambar
 Artikel 1: “Mengenal Proses Pengembangan Gim: Dari Ide Hingga Rilis” Pengembangan gim sering dianggap sebagai dunia yang rumit dan hanya untuk para profesional. Padahal, siapa pun bisa mulai membuat gim asalkan memahami alur kerjanya 🌿. Berikut adalah proses penting dalam menciptakan sebuah gim dari awal hingga siap dirilis. 1. Memulai dengan Ide 💡✨ Semua gim bermula dari sebuah ide sederhana: genre, gaya bermain, hingga tujuan pemain. Tidak perlu langsung sempurna—yang penting adalah memiliki gambaran dasar yang jelas. 2. Membuat Game Design Document (GDD) 📘🌙 GDD adalah panduan utama dalam produksi gim. Di dalamnya tercantum: Mekanik permainan Karakter Alur cerita UI/UX Platform rilis Dokumen ini membantu menjaga arah proyek tetap stabil. 3. Konsep Visual dan Audio 🎨🎧 Pada tahap ini, ditentukan gaya visual yang ingin digunakan, seperti pixel art, gaya kartun, atau 3D realistis. Audio seperti musik latar dan efek suara juga mulai dipilah agar suasana permainan terasa hidup. ...
Baca selengkapnya

widgetflutter

Gambar
 Perfect! 🌸 Kamu mau belajar Flutter secara jelas dan lengkap — mulai dari apa itu widget, jenisnya, contoh penting, struktur dasar aplikasi, sampai contoh kodenya 💖 Aku jelaskan dari dasar dengan gaya santai tapi lengkap, cocok buat kamu yang baru belajar Flutter 🎀 🧩 1. Apa Itu Widget di Flutter Dalam Flutter, semua tampilan aplikasi dibangun dari widget . Widget = “Komponen penyusun UI (User Interface)” di Flutter. Contoh: Text di layar → pakai Text() Gambar → pakai Image() Tombol → pakai ElevatedButton() Tata letak → pakai Column() atau Row() 🩷 Jadi, setiap elemen tampilan di Flutter adalah widget ! 💡 2. Jenis-Jenis Widget di Flutter Jenis Widget Penjelasan Contoh Stateless Widget Tampilan tidak berubah walaupun pengguna berinteraksi. Text, Icon, Image Stateful Widget Tampilan bisa berubah karena interaksi pengguna atau data. TextField, Switch, Counter 🌷 3. Stateless Widget ➡️ Widget yang tidak punya “state” (tidak b...
Baca selengkapnya

memahami.widgetflutter

✨ 1. Project Flutter – UI Dasar & Struktur App Pada project pertama, kamu membuat sebuah aplikasi Flutter sederhana yang fokus pada: 🌿 Hal-hal penting dalam project ini: Struktur dasar Flutter menggunakan main.dart Menggunakan Widget MaterialApp , Scaffold , dan komponen UI dasar Membangun halaman utama (home page) sebagai tampilan awal aplikasi Menampilkan teks sederhana atau widget dasar lain untuk memahami flow UI Melatih pemahaman tentang: Hierarki widget Cara kerja runApp() Perbedaan StatelessWidget & StatefulWidget 🌼 Insight pembelajaran: Project ini membantu memahami fondasi Flutter yang paling penting, yaitu bagaimana UI dibangun dari widget, dan bagaimana aplikasi mulai bekerja dari main() hingga ke tampilan. Projek saya ada disini : https://zapp.run/edit/flutter-zoa806d4oa90?entry=lib/main.dart&file=lib/main.dart ✨ 2. Project Flutter – Navigasi & Interaksi Lebih Lanjut Project kedua menunjukkan level yang lebih maju, dimana kamu mulai eksplor: 🌿 Hal-hal...
Baca selengkapnya