Postingan

BMI CALCULATOR

Gambar
  import 'package:flutter/material.dart'; void main() {   runApp(const MyApp()); } class MyApp extends StatelessWidget {   const MyApp({super.key});   @override   Widget build(BuildContext context) {     return MaterialApp(       debugShowCheckedModeBanner: false,       home: const BmiApp(),     );   } } class BmiApp extends StatefulWidget {   const BmiApp({super.key});   @override   State<BmiApp> createState() => _BmiAppState(); } class _BmiAppState extends State<BmiApp> {   final nameController = TextEditingController();   final ageController = TextEditingController();   String gender = "Laki-laki";   double weight = 60;   double height = 170;   double bmi = 0;   String category = "-";   String advice = "Masukkan data lalu hitung BMI";   Color color = Colors.white;   void calculateBMI() {     double h = height / 100; ...

Membuat AppBar Sederhana & Tata Letak Horizontal di Flutter

Gambar
Tujuan pembelajaran * Memahami struktur dasar aplikasi Flutter (`MaterialApp`, `Scaffold`, `AppBar`). * Membuat AppBar sederhana dengan judul. * Menata widget secara horizontal menggunakan `Row` atau `Wrap`. * Menggunakan `Container`, `Padding`, dan `SizedBox` untuk styling dan spasi. * Menangani tampilan agar tidak overflow di layar kecil (tips responsif). Penjelasan bagian penting kode * `MaterialApp`: pembungkus utama untuk aplikasi yang memakai Material Design. * `Scaffold`: menyediakan struktur dasar halaman (AppBar, body, floatingActionButton, dll). * `AppBar`: bilah atas yang menampilkan judul aplikasi. Kamu bisa tambahkan ikon atau actions bila perlu. * `Padding`: memberi jarak dari tepi layar supaya tampilan tidak menempel. * `Wrap` vs `Row`:   * `Row` menata anak secara horizontal dalam satu baris. Jika konten lebih lebar dari layar, akan overflow.   * `Wrap` juga menata horizontal tetapi otomatis membungkus ke baris berikutnya jika tidak muat — lebih responsif. * `C...

Semangat Sportivitas di Lapangan Basket Sekolah

Gambar
Sinar matahari sore menyinari lapangan basket sekolah yang menjadi saksi semangat dan kerja sama para siswi dalam sebuah pertandingan basket. Dengan mengenakan seragam tim berwarna biru dan merah marun, para pemain tampak fokus dan penuh determinasi dalam setiap gerakan, mulai dari menjaga lawan, merebut bola, hingga mencoba mencetak poin. Pertandingan ini bukan sekadar ajang adu kemampuan fisik, tetapi juga sarana melatih kedisiplinan, sportivitas, dan kekompakan tim. Terlihat para pemain saling berkomunikasi dan mendukung satu sama lain, menunjukkan bahwa kerja sama adalah kunci utama dalam olahraga beregu seperti bola basket. Lapangan beratap terbuka ini memberikan suasana yang nyaman, memungkinkan kegiatan olahraga tetap berlangsung dengan aman dan kondusif. Sorak semangat dari teman-teman dan penonton di sekitar lapangan menambah motivasi para pemain untuk memberikan performa terbaik mereka. Melalui kegiatan olahraga seperti ini, siswa tidak hanya menjaga kebugaran jasmani, tetapi...

Pengembangan Gim: Proses Kreatif dari Ide hingga Rilis

Gambar
Pengembangan gim adalah proses terstruktur yang menggabungkan kreativitas, teknologi, dan kerja tim untuk menghasilkan sebuah permainan yang menarik dan berkualitas. Dalam proses ini, sebuah gim tidak langsung jadi, melainkan melalui beberapa tahapan penting yang saling berkaitan. 1. Konsep dan Desain Tahap awal pengembangan gim dimulai dari konsep dan desain. Pada tahap ini, tim pengembang menentukan ide dasar gim, seperti genre, target pemain, alur cerita, karakter, serta mekanisme permainan. Ide-ide tersebut kemudian dituangkan dalam bentuk perencanaan atau desain visual agar seluruh tim memiliki pemahaman yang sama sebelum masuk ke tahap berikutnya. 2. Pengembangan Setelah konsep matang, gim masuk ke tahap pengembangan. Di tahap ini, programmer mulai menulis kode, desainer membuat aset visual, dan audio engineer menyiapkan musik serta efek suara. Semua elemen digabungkan menggunakan game engine sehingga gim mulai bisa dimainkan meskipun masih dalam versi awal. 3. Pengujian Tahap pe...

40 soal dan jawaban mengenai kode UI flutter

Gambar
SOAL JAWABAN : 1.c 2.b 3.c 4.d 5.c 6.b 7.c 8.b 9.c 10.c 11.c 12.b 13.c 14.c 15.c 16.a 17.c 18.b 19.b 20.b 21.c 22.d 23.c 24.c 25.b 26.c 27.b 28.c 29.b 30.c 31.b 32.d 33.c 34.b 35.b 36.b 37.b 38.c 39.a 40.a

Bloggspot Nasya dwi arini

🌿 Membuat Layout Responsif Sederhana di Flutter Menggunakan Column, Row, Flexible, dan LayoutBuilder  ✨ Pendahuluan Dalam pengembangan aplikasi Flutter, **layout responsif** sangat penting agar aplikasi dapat menyesuaikan diri dengan berbagai ukuran layar, mulai dari smartphone hingga tablet atau desktop. Salah satu cara terbaik untuk membuat tampilan yang fleksibel adalah dengan menggunakan widget seperti `Column`, `Row`, `Flexible`, dan `LayoutBuilder`. Pada artikel ini, kita akan mempraktikkan cara membuat layout responsif sederhana yang cocok untuk pembelajaran siswa. Kita akan membuat tampilan dengan nuansa **hijau soft**, dilengkapi dengan **emoji dan elemen visual menarik** untuk meningkatkan estetika dan kenyamanan pengguna. ---  ðŸ“¦ Struktur Proyek Berikut adalah struktur utama dalam aplikasi ini: * **`MaterialApp`**: Root aplikasi. * **`Scaffold`**: Struktur dasar layout (AppBar + Body). * **`LayoutBuilder`**: Untuk menentukan layout berdasarkan lebar layar. * **`Col...

🎨 Panduan Lengkap Membuat Desain di Figma untuk Pemula

Gambar
Figma adalah salah satu tools desain paling populer saat ini, terutama di kalangan UI/UX designer. Karena berbasis web, kamu bisa mengaksesnya dari mana saja tanpa perlu install aplikasi berat. Selain itu, fitur kolaborasinya juga memudahkan tim untuk bekerja bersama secara real-time. Kalau kamu baru mulai belajar Figma, blog ini cocok banget buat kamu. Kita akan bahas langkah-langkah dasar membuat desain di Figma, mulai dari bikin akun sampai export hasil desain kamu. ✍️ 1. Membuat Akun Figma Langkah pertama tentu saja membuat akun di figma.com . Buka website Figma. Klik "Sign Up" . Isi email, nama, dan password kamu. Kamu bisa langsung mulai dengan versi gratisnya, yang sudah cukup untuk kebutuhan dasar desain. 🧱 2. Mengenal Antarmuka Figma Setelah login, kamu akan melihat dashboard utama. Di sini kamu bisa: Membuat file baru (design file). Mengatur proyek dalam team . Mengakses template atau file dari komunitas Figma. Saat kamu membuka f...