Macam Macam Material Design Button pada Flutter. Sebelum memulai mendesign aplikasi mobile android ataupun IoS pada flutter. hendaknya mengetahui macam button yang ada di flutter. Dan di flutter sendiri itu ada dua jenis design framework yang saya ketahui saat ini yaitu Material Design dan Cupertino Design. dan kali ini saya ingin menjelaskan tentang Material Design terlebih dahulu.
Apa itu Material Design?
Material Design adalah sebuah guideline / panduan untuk mendesain yang dibuat oleh Google melalui riset yang dalam untuk menghasilkan UX yang lebih baik.
Material design sendiri adalah framework yang digunakan oleh Android, dan faktanya Android adalah sistem operasi untuk mobile yang paling banyak digunakan.
Jika kamu seorang UX desainer mengerti dan memahami prinsip material design dengan baik, maka akan memudahkan kamu dalam membuat sebuah produk — terutama untuk platform Android. Tipe-tipe button yang memiliki desain material pada flutter yaitu:
- RaisedButton
RaisedButton adalah tipe button yang sering digunakan karena bentuknya yang seperti button pada umumnya bisa di bilang standart. - FlatButton
FlatButton adalah button sama seperti RaisedButton tetapi tidak memiliki bayangan (Shadow) pada tiap sudutnya dan juga tidak memiliki warna Background jadi terlihat seperti tulisan biasa tetapi bisa di klik. namun dengan beberapa atribut tambahan akan membentuk button. - OutlineButton
OutlineButton sama seperti FlatButton tetapi memiliki garis atau bolder yang mengelilingi sehingga terlihat button yang transparant. - IconButton
IconButton adalah tombol yang disisipi icon sehingga menjadi Widget Icon yang bisa diklik. - FloatingActionButton
FloatingActionButton atau bisa disebut FAB adalah tombol yang memrepresentasikan tindakan dalam suatu aplikasi. tombol FAB yang sering kita lihat pada whatApps pada pojok kanan bawah pada tab chats.
jadi dari deskripsi tiap tipe button yang ada di Material Design flutter berbeda, jadi gunakan sesuai kebutuhan untuk design aplikasi yang akan anda buat. berikut contoh penulisan syntax sederhanya:
Hasil dari koding di atas sebagai berikut
