Mengenal Widget Penting Pada Flutter Untuk Pemula | Flutter menyediakan beragam widget yang dapat digunakan oleh developer. Widget digunakan untuk mengembangkan aplikasi yang dapat digunakan sebagai multi-platform, dan tentunya flutter sangat mudah digunakan bagi para developer yang baru memulai belajar pemrogramming. Pada artikel ini akan membahas Mengenal Widget Penting Pada Flutter Untuk Pemula mempelajari Framework Flutter.
Widget adalah Semua komponen seperti button, text, icon dan sebagainya yang membentuk sebuah tampilan atau kerangka aplikasi. Keseluruhan dari aplikasi yang terlihat pada layar merupakan kumpulan widget. Widget pada Flutter sendiri terinspirasi dari React.
Baca juga: Tutorial Paling Mudah Install Vue.js Untuk Pemula
Perthatikan widget MyHomePage aplikasi Hello World di bawah ini.
class MyHomePage extends StatelessWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(this.title), ),
body: Center(child: Text( 'Hello World',)),
);
}
}Di sini, kami telah membuat widget baru dengan memperluas StatelessWidget.
Perhatikan bahwa StatelessWidget hanya memerlukan satu metode yang khusus untuk diimplementasikan di kelas turunannya. Metode build mendapatkan lingkungan konteks yang penting untuk membuat widget melalui parameter BuildContext dan mengembalikan widget yang ada.
Dalam kodenya, kami telah menggunakan title sebagai salah satu argumen konstruktor dan juga menggunakan Key sebagai argumen lainnya. Judul digunakan untuk menampilkan judul dan Kunci digunakan untuk mengidentifikasi widget di lingkungan build.
Di sini, metode build memanggil metode build Scaffold , yang selanjutnya memanggil metode build AppBar dan Center untuk membangun antarmuka penggunanya.
Terakhir, metode pembuatan pusat memanggil metode pembuatan teks. Untuk pemahaman yang lebih baik, representasi visualnya diberikan di bawah ini.
Mengenal Widget Penting Pada Flutter Untuk Pemula
Pada saat mengembangkan aplikasi menggunakan Flutter, kita akan selalu membutuhkan widget-widget untuk membangun aplikasi Flutter kita. Semua tampilan aplikasi kita adalah Widget. Kali ini kita akan membahas widget-widget penting pada Flutter.
Untuk Flutter, memiliki beberapa widget dalam kategori berdasarkan fiturnya, seperti tercantum berikut.
Platform specific widgets
Flutter memiliki widget khusus untuk platform tertentu – Android atau iOS. Widget khusus Android terancang sesuai dengan pedoman desain Material oleh OS Android. Widget khusus Android disebut sebagai widget Material. Sedangkan khusus iOS terancang sesuai dengan Pedoman Antarmuka Manusia oleh Apple dan disebut sebagai widget Cupertino.
Berikut contoh beberapa widget Material yang ada di flutter:
- Scaffold
- AppBar
- BottomNavigationBar
- TabBar
- TabBarView
- ListTile
- RaisedButton
- FloatingActionButton
- FlatButton
- IconButton
- DropdownButton
- PopupMenuButton
- ButtonBar
- TextField
- Checkbox
- Radio
- Switch
- Slider
- Date & Time Pickers
- SimpleDialog
- AlertDialog
Sedangkan berikut ini contoh beberapa widget Cupertino yang ada di flutter:
- CupertinoButton
- CupertinoPicker
- CupertinoDatePicker
- CupertinoTimerPicker
- CupertinoNavigationBar
- CupertinoTabBar
- CupertinoTabScaffold
- CupertinoTabView
- CupertinoTextField
- CupertinoDialog
- CupertinoDialogAction
- CupertinoFullscreenDialogTransition
- CupertinoPageScaffold
- CupertinoPageTransition
- CupertinoActionSheet
- CupertinoActivityIndicator
- CupertinoAlertDialog
- CupertinoPopupSurface
- CupertinoSlider
Layout widgets
Widget flutter dapat terdiri dengan membuat satu atau beberapa widget. Untuk menyusun beberapa widget menjadi satu widget, Flutter menyediakan banyak widget dengan fitur tata letak. Misalnya, child widget dapat berubah ke pusat menggunakan center widget.
Beberapa widget tata letak yang populer adalah sebagai berikut –
- Container – Kotak persegi panjang yang ada hiasan menggunakan widget BoxDecoration dengan latar belakang, tepian, dan bayangan.
- Center – Pusatkan widget turunannya.
- Row- Susun anak-anaknya dalam arah horizontal.
- Column – Susun anak-anaknya dalam arah vertikal.
- Stack – Susun satu di atas yang lain.
State maintenance widgets
Widget flutter berasal dari StatelessWidget atau StatefulWidget. Widget yang berasal dari StatelessWidget tidak memiliki informasi status apa pun tetapi mungkin berisi widget yang berasal dari StatefulWidget . Sifat dinamis dari aplikasi ini adalah melalui perilaku interaktif widget dan perubahan status selama interaksi. Misalnya, mengetuk tombol penghitung akan menambah/mengurangi status internal penghitung sebanyak satu dan sifat reaktif widget Flutter akan merender ulang widget secara otomatis menggunakan informasi status baru.
Pelatihan Mobile Application Development with Flutter Jogja
Demikian informasi penting Mengenal Widget Penting Pada Flutter Untuk Pemula. Segera ikuti pelatihan Mobile Application Development with Flutter di PITMA. Untuk informasi pelatihan dan jadwal terbaru silahkan hubungi kami di nomor whatsapp kami disini.
