[Flutter] Cara Menggunakan SingleChildScrollView



Anda bingung bagaimana cara menggunakan SingleChildScrollView? Atau mungkin Anda bingung bagaimana cara menambahkan scroll pada aplikasi flutter Anda? Pada Artikel ini akan membahas tentang bagaimana cara menambahkan scroll pada aplikasi flutter Anda menggunakan SingleChildScrollView. Sebelumnya, flutter adalah sebuah framework aplikasi mobile sumber terbuka yang diciptakan oleh Google. Flutter digunakan dalam pengembangan aplikasi untuk sistem operasi Android, iOS, Windows, Linux, MacOS, serta menjadi metode utama untuk membuat aplikasi Google Fuchsia. Pada saat Anda membuat aplikasi flutter, disaat widget sudah melebihi batas layar, akan muncul error dengan background berwarna merah. Biasanya terdapat tulisan “Widget Overflow”. Nah, salah satu solusinya yaitu dengan menambahkan scroll pada widget tersebut

Penggunaan  SingleChildScrollView

1
2
3
SingleChildScrollView(
     child: ...
)

Pada dasarnya penggunaan SingleChildScrollView hanya membutuhkan widget SingleChildScrollView() yang didalamnya berisi parameter child. Child di sini bisa berupa Column, Row, Container, atau widget lainnya. Selain memiliki child, SingleChildScrollView  juga memiliki beberapa parameter tambahan (gunakan sesuai kebutuhan)

  • Controller

Parameter controller digunakan untuk mengontrol widget SingleChildScrollView. Misalnya saat Anda ingin memberikan perintah saat aplikasi di scroll ke atas ataupun ke bawah, atau mungkin Anda ingin memberikan perintah pada saat scroll pada posisi tertentu (Misalnya jika scroll sudah sampai bawah, akan muncul popup). Parameter ini berisi ScrollController().

1
controller: ScrollController()

  • Physics

Parameter physics digunakan untuk menentukan bagaimana tingkah laku scroll tersebut. Misalnya Anda ingin membnuat tampilan scroll yang jika sampai atas atau bawah akan ada efek seperti memantul. Atau mungkin, Anda ingin membuat tampilan scroll yang jika sampai atas atau bawah akan ada efek warna biru.

1
physics: AlwaysScrollableScrollPhysics()
1
physics: BouncingScrollPhysics()
1
physics: ClampingScrollPhysics()
1
physics: NeverScrollableScrollPhysics()

  • Reverse

Parameter reverse digunakan untuk membalikkan arah scroll pada aplikasi flutter.

1
reverse: true

  • Scroll Direction

Parameter scrollDirection digunakan untuk menentukan arah scroll pada aplikasi flutter.

1
scrollDirection: Axis.horizontal
1
scrollDirection: Axis.vertical

Contoh Program


Contoh program flutter menggunakan SingleChildScrollView
Contoh program flutter menggunakan SingleSchildScrollView

Penutup

Jadi, Kita dapat membuat scroll pada aplikasi flutter dengan menggunakan SingleChildScrollView. Widget ini memiliki beberapa parameter beserta fungsi fungsi nya. Jika ada yang ingin ditanyakan, silahkan berkomentar di postingan ini.

Komentar

Posting Komentar

Postingan populer dari blog ini

Abis Baca Buku "Sirah Nabawiyah"

Sudah lama aku nggak menyelesaikan buku. Terakhir kali aku lihat post di blog ini yaitu Desember 2020. Wow. Sungguh malas nya diriku. OK, kali ini akhirnya aku menyelesaikan buku "SIrah Nabawiyah". Dan buku ini adalah buku tertebal yang pernah aku baca. Tebalnya 600 halaman. Sebenarnya aku juga punya buku Tebal lainnya sih. yaitu buku Novel Sherlock Holmes, yang tebalnya 800 halaman dan ada 2 buku. Tapi belum selesaia aku baca. Atau bisa dibilang, stuck wkwkwk Mengenai buku ini, buku ini menceritakan tentang kehidupan Nabi Muhammad SAW dari kelahiran hingga kematian. Mengapa aku ingin membaca buku ini? Simpel sih, karena aku orang Islam, sepertinya perlu mengetahui jejak kehidupan nabi ku. Yaitu Nabi Muhammad SAW Ok, Mungkin segitu dulu untuk update nya. Untuk selanjutnya, bingung sih mau baca apa. Sebenernya masih ada buku yang masih belum aku sentuh di rak wkwkwk.
Read more »

[Flutter] Cara Menggunakan Alert Dialog

Anda bingung bagaimana caranya menggunakan Alert Dialog pada bahasa pemograman Flutter? Atau anda bingung bagaimana cara memunculkan pop up dialog? Atau mungkin anda lupa bagaimana caranya memunculkan alert dialog? Artikel ini akan membahas tentang bagaimana caranya menggunakan Alert Dialog pada bahasa pemograman Flutter. Sebelumnya, bahasa pemograman Flutter adalah sebuah framework aplikasi mobil sumber terbuka yang diciptakan oleh Google. Flutter digunakan dalam pengembangan aplikasi untuk sistem operasi Android, iOS, Windows, Linux, MacOS, serta menjadi metode utama untuk membuat aplikasi Google Fuchsia. Flutter juga mendukung untuk pengembangan aplikasi berbasis web.   Penggunaan AlertDialog 1 2 3 4 5 6 showDialog< void >( context: context, builder: (BuildContext context) { return AlertDialog(...) } ) ...
Read more »

[C++] Contoh Program Membuat Password Generator Simpel

Anda bingung bagaimana membuat Program Membuat Password Generator Simpel pada bahasa pemograman C++? Atau anda bingung bagaimana cara Mengacak password? Atau mungkin anda lupa bagaimana caranya menggunakan random? Artikel ini akan membahas tentang bagaimana membuat Program Membuat Password Generator Simpel pada bahasa pemograman C++. Sebelumnya, bahasa pemograman C++ adalah bahasa pemrograman komputer yang dibuat oleh Bjarne Stroustrup , yang merupakan perkembangan dari bahasa C dikembangkan di Bell Labs ( Dennis Ritchie ). Saran Untuk Dosen / Asisten Lab / Guru Jika topik ini akan dijadikan sebagai tugas, cobalah membuat variasi dari tugas ini. misalnya dengan panjang input yang dinamis, hanya boleh huruf saja, atau mungkin harus terdapat minimal 1 huruf besar dan angka. Ada banyak variasi dari topik ini. Anggap saja artikel ini digunakan sebgai materi dan contoh.  Solusi lain: [Java] Contoh Program Membuat Passwor...
Read more »

Abis Baca Buku “Sang Dirigen”, Biografi Jahja Setiaatmadja

OK, Sebenerntya ada 1 buku lagi yang udah baca. Ntar aku tulis juga deh. Ini buku aku beli pas cuci gudang Gramedia kemarin. Alasan membelinya sih karna penasaran aja. Ini siapa? kehidupannya gimana? Dan juga aku kebut bulan ini setelah selesai pendadaran ku untuk menyelesaikan buku ini. Ini aja aku baru selesai langsung tulis ini artikel XD Setelah saya baca buku ini, ada beberapa hal yang menarik. Yang pertama, ternyata pada waktu memilih kuliah, Pak Jahja (saya panggil “pak” biar sopan ya) jurusan nya tidak sesuai dengan keinginannya. Awalnya ingin jurusan Dokter gigi, kalau tidak boleh maka ingin ke jurusan Teknik dan akhirnya disuruh bapaknya memilih jurusan Ekonomi. Kata bapaknya karena jurusan yang lain harganya lebih mahal. Dari sini aku sadar bahwa passion itu bisa berubah. Ya, mungkin sebenernya nggak ada pembahasan tentang passionnya Pak Jahja. Tapi dilihat dari karirnya, beliau tidak merasa keberatan dengan jurusan yang beliau pilih sampai beliau menjabat sebagai direktur B...
Read more »

Abis Baca Buku "Bukan untuk Bahagia"

  Yak, kali ini saya dipinjam kan buku oleh seseorang. Kaget juga dipinjamkan buku, buku tentang percintaan dan pernikahan lagi. Sepertinya mengingat umur ku, sudah saat nya baca buku genre seperti ini hahaha. Overall, isinya tentang saran dan ekspetasi menuju pernikahan. Mulai membahas tentang masa masa pacaran, memilih jodoh, dan diakhiri dengan ekspetasi pernikahan. Jadi, cinta itu apa sih? Jujur aku sendiri juga sedang mencari cari dan memahami diri sendiri ini __〆(￣ー￣ ).
Read more »