Dekorasi Container

 Decoration merupakan bagian dari Container untuk styling. Pada decoration kita dapat menentukan warna background (solid/gradient color), shadow, border, border radius (membulatkan sudut), mengatur shape (bentuk), dan lain-lain.


Color

Contoh menentukan warna background dari container dengan decoration seperti berikut:

  1. Container(
  2.   decoration: BoxDecoration(
  3.     color: Colors.red,
  4.   ),
  5. child: const Text(
  6. 'Hi',
  7. style: TextStyle(fontSize: 40),
  8.   ),
  9. ),

Ketika dijalankan maka tampilan aplikasi akan seperti berikut:
20200615192933b608ccce9f54b3ac0e012b53b590c409.jpeg

Untuk menggunakan decoration cukup menambahkan parameter decoration pada Container lalu beri nilai BoxDecoration. Pada contoh di atas kita merubah warna Container menjadi merah dengan memberi parameter color pada BoxDecoration. Ada catatan penting ketika menggunakan color pada BoxDecoration, yaitu pastikan tidak memberi parameter color pada Container.


Shape

Contoh selanjutnya pada decoration adalah kita akan mengatur shape (bentuk) dari Container, contohnya sebagai berikut:

  1. Container(
  2.   decoration: BoxDecoration(
  3.     color: Colors.red,
  4.     shape: BoxShape.circle,
  5.   ),
  6. child: const Text(
  7. 'Hi',
  8. style: TextStyle(fontSize: 40),
  9.   ),
  10. ),

Pada kode di atas kita menambahkan parameter shape dengan nilai BoxShape.circle. Artinya, bentuk dari Container tersebut akan berbentuk lingkaran. BoxShape memiliki opsi circle atau rectangle.
202006151929504f732b0253654199eee3af0867529282.jpeg

Popular posts from this blog

Build APK

Generic

Build IPA