1. Tujuan
Tujuan praktikum ini adalah agar mahasiswa mampu:
- Menyiapkan lingkungan development Flutter (install SDK, Git, Android SDK, IDE, dll).
- Membuat Stateless Widget dan Stateful Widget.
- Membuat contoh penggunaan basic widget Flutter.
2. Alat
Perangkat yang digunakan adalah komputer/laptop yang telah diinstal Flutter SDK, Android Studio, Visual Studio Code, dan Git.
3. Teori
Flutter adalah framework open source untuk membangun aplikasi multiplatform dengan bahasa
Dart.
Flutter menyediakan widget statis (Stateless) dan dinamis (Stateful) serta
beragam basic widget
seperti Text, Container, ElevatedButton,
Icon, Image, dan CircleAvatar.
4. Langkah-langkah
a. Setup Lingkungan
- Install Git, Visual Studio (dengan Desktop development C++), Android Studio, dan Visual
Studio Code.
- Download dan extract Flutter SDK, kemudian tambahkan ke PATH.
- Jalankan perintah flutter doctor untuk memastikan setup berhasil.
b. Membuat Project Pertama
Project pertama dibuat dengan perintah terminal:
flutter create hai
cd hai
flutter run
Bisa juga melalui Visual Studio Code dengan Command Palette → Flutter: New Project.
Struktur project Flutter terdiri dari folder lib/, android/,
ios/, assets/, test/, serta file
pubspec.yaml.
c. Stateless Widget
Stateless Widget adalah widget statis yang tidak berubah. Contoh kode:
Output berupa tampilan teks statis di layar.
d. Stateful Widget
Stateful Widget adalah widget dinamis yang bisa berubah saat ada event atau state berubah.
Contoh kode:
Output menampilkan angka kelipatan 2 yang bertambah saat tombol ditekan.
e. Basic Widgets
Berikut beberapa basic widget yang dicoba:
- Text → menampilkan teks dengan style.
- Container → kotak dengan ukuran, warna, padding, margin.
- ElevatedButton → tombol dengan style dan aksi.
- Icon → menampilkan ikon material atau cupertino.
- Image → menampilkan gambar dari network atau asset.
- CircleAvatar → avatar bulat untuk foto profil atau inisial.
5. Latihan / Tugas
a. Membuat tampilan widget secara vertical dan horizontal dengan minimal 3 widget.

.png)
b. Membuat tampilan profil mahasiswa berisi foto, nama, NIM, alamat, nomor HP, dan jurusan
dengan basic widget.

.png)
6. Kesimpulan
Pada praktikum ini mahasiswa berhasil melakukan instalasi lingkungan Flutter, membuat project pertama, memahami perbedaan Stateless dan Stateful widget, serta mengimplementasikan berbagai basic widget Flutter dalam bentuk tampilan sederhana dan latihan aplikasi profil.