Scribd
Unggah
9 tayangan

Modul 5 - Statefull Widget Dialog

modul 5

Diunggah oleh

Ilham Yudanto 9k
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
9 tayangan

Modul 5 - Statefull Widget Dialog

modul 5

Diunggah oleh

Ilham Yudanto 9k
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 9

LAPORAN MODUL PRAKTIKUM

PEMROGRAMAN MOBILE
MODUL 5

DISUSUN OLEH
[ NAMA]
[NPM]

PROGRAM STUDI INFORMATIKA


FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS BHINNEKA PGRI
2023

Program Studi Informatika - UBHI


PROGRAM STUDI INFORMATIKA
FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS BHINNEKA PGRI
Praktikum Matakuliah Pemrograman Mobile
Modul Praktikum Stateless & Statefull Widget
Dosen Pengampu Taufiq Agung Cahyono, M.Kom

Tugas Modul 5
1. Stateless Widget
Stateless widget menurut saya adalah widget yang dikembangkan flutter untuk
membuat komponen antarmuka tetapi tidak dapat melakukan perubahan pada
tampilannya. karena widget ini sifatnya statis. Namun pada praktikum ini terdapat
variabel ‘nilai’ yang akan menyimpan nilai untuk ditampilkan pada sistem.
Stateless ini cocok digunakan ke elemen – elemen yang tidak perlu pembaruan secara
terus menerus seperti, teks, ikon, gambar, dsb.

Pada code diatas terdapat widget Row yang memiliki 2 ‘ElevatedButton’ dan masing
masing diberikan ikon “remove” dan “add” dengan fungsi mengurangi atau
menambahkan nilai pada variabel ‘nilai’ Ketika tombol tersebut ditekan.

Program Studi Informatika - UBHI


2. Stateful Widget
Stateful Widget menurut saya adalah widget yang memiliki tampilan internal
sehingga dapat berubah seiring waktu. Stateful widget akan mengubah tampilannya
saat statenya dimodifikasi, widget ini akan sangat berguna apabila pengguna membuat
widget yang memiliki interaktif dan tampilannya perlu berubah saat terjadi perubahan
state.
Untuk dapat merubah tampilan stateful widget , dibutuhkan fungsi setState(){}

Pada code diatas _MyAppState akan mendefinisikan variabel “nilai” yang digunakan
untuk menyimpan nilai yang akan ditampilkan, lalu ‘State<MyApp> akan menjadi
tempat menyimpan state dari nilai yang dapat berubah ubah siklusnya. Fungsi
setState(){} akan diletakkan di masing masing “ElevatedButton” yang nantinya akan
merubah nilai menjadi bertambah ataupun berkurang.

Program Studi Informatika - UBHI


3. Dialog Widget
Dialog adalah widget yang akan menampilkan dialog atau popup diatas tampilan
utama aplikasi. Dialog digunakan untuk meminta konfirmasi, meminta input, dan
menampilkan pesan informasi tambahan.
Pada kasus tertentu Dialog widget diharuskan memisahkan kerangka MaterialApp
dan Scaffold. Karena, Scaffold dapat dianggap sebagai anak dari kelas Orangtua (
Dialog ) dan pemisahan keduanya akan mempermudah dalam mengelola tema dan
routing pada aplikasi.

Algoritma Dialog widget :


Buatlah 2 class StatelessWidget yang masing-masing mengembalikan nilai
MaterialApp dan Scaffold. Pada praktikum ini class yang mengembalikan nilai
MaterialApp akan memanggil nama class dari yang me return Scaffold. Dalam kasus ini
nama classnya adalah Home. Jika script diatas dijalankan, maka hasil yang keluar akan
seperti Tampilan Home kosong.

Program Studi Informatika - UBHI


3.1 Allert Dialog
AlertDialog merupakan widget yang akan menampilkan pesan peringatan kepada
pengguna untuk segera ambil keputusan atau memberikan kemampuan untuk memilih
Tindakan, contohnya : konfirmasi notifikasi peringatan Miss call dari oranglain
,pengguna akan diberikan pilihan untuk menolaknya atau menerima telepon.

Properti yang dimiliki Alert Dialog :


Title : Judul Peringatan pada bagian atas pop up dialog
Action : tampilan yang letaknya dibawah konten , contoh tombol “keluar” dan
“Kembali”.
Content : isi widget AlertDialog, isi dapat berupa jenis teks dan dapat menampung
segala jenis widget layout.
Bentuk : memberikan bentuk pada tempat Alert Dialog , seperti kurva, lingkaran
dsb.

Program Studi Informatika - UBHI


3.2 Simple Dialog
SimpleDialog adalah sebuah kotak dialog sederhana yang dapat membantu pengguna
dengan diberikan pilihan . Kotak dialog ini dapat menampilkan judul yang opsional,
dan akan muncul di atas daftar pilihan.

Program Studi Informatika - UBHI


3.3 Time Picker Dialog
TimePicker merupakan Flutter widget yang fleksibel untuk menentukan waktu.
Widget akan membuat dialog interaktif , dapat memodifikasi ataupun melihat
waktu secara nyata dalam format 24 jam.

Program Studi Informatika - UBHI


3.4 Date Picker Dialog
DatePicker adalah widget Flutter yang memungkinkan pengguna untuk
menampilkan dialog dalam memilih tanggal. Ketika widget ini dijalankan,
maka dialog akan muncul dan pengguna dapat melakukan perubahan
pada tanggal dari kalender digital tersebut.

Program Studi Informatika - UBHI


Modif Dialog Widget

Program Studi Informatika - UBHI

Anda mungkin juga menyukai