Flutter 🤔 ?
Jadi flutter adalah framework mobile application yang dibuat oleh google dengan menggunakan bahasa dart 🎯. Banyak hal keren dari flutter, yaitu salah satunya memiliki banyak widget - widget yang cantik.
Â
Beberapa Contoh Widget Flutter
- StatefulWidget
class SampleStatefulWidget extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _SampleStatefulWidgetState extends State<SampleStatefulWidget> {
@override
Widget build(BuildContext context) {
}
}
Pada flutter pasti banyak variable dengan value yang berubah ubah saat membuat aplikasi dan tentunya mempengaruhi tampilan, disitu kita akan membutuhkan stateful dengan widget satu ini kita bisa mengubah tampilan sejalan dengan variable dengan mudah. Untuk mengubah tampilan kita harus menjalankan setState(), cara kerja setState yaitu dimulai saat pemanggilan disitu setState memberi tahu kalau ada perubahan pada variable kemudian framework merespon dengan membuild ulang widget tersebut.
- StatelessWidget
class SampleStatelessWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
}
}
Berbeda dengan stateful, widget stateless tidak bisa
melakukan perubahan pada tampilannya, code penulisannya juga lebih sedikit. Jadi saat suatu variable yang melakukan perubahan pada value widget ini tidak akan ikut berubah.
- Container
Container()
Container, widget yang paling sering dipakai dalam flutter 😮
Widget ini sering diakai untuk pembungkus widget lain, dengan container bisa melakukan banyak hal dari memberi jarak, mengatur ukuran, memberi warna pada background.
- Text
Text()
Text, sesuai namanya widget ini digunakan untuk membuat text pada flutter, text yang dibuat juga bisa diubah ubah dengan mengganti warna ataupun ukuran, penggunaan widget juga bisa digabung dengan container.
Container(
child: Text(
'Hello World',
style: TextStyle(
color: Color(0xffF8C92C)
)
)
)
- Image
Image()
Dalam membuat aplikasi mobile pasti memiliki banyak object, salah satunya mengandung image, dalam membuat aplikasi flutter kita bisa menggunakan widget ini untuk menampilkan image, sumber image bisa dari url maupun dari local.
Â
Dibawah source code untuk menampilkan image dari local
Image(
image: AssetImage('assets/image.png')
)
Top comments (0)