Gesture Protector on Flutter

Nadilla C. Putri
2 min readAug 17, 2021

Bismillah,
Halo teman-teman kali ini kita akan membahas tentang Gesture Detector. Sesuai dengan namanya Gesture Detector bergungsi sebagai pendeteksi gerakan pada widget yang ada pada Flutter, seperti menekan atau mengetuk widget tertentu. Biasanya, pada Flutter hanya widget tertentu saja yang bisa di klik karena memang memiliki listener klik seperti button. Jadi dengan Gesture Detector ini dapat menekan atau meng-klik text, gambar atau icon. Berikut contoh implementasi dari Gesture Protector:

Pada program diatas jika di klik button dengan sesuai dengan perintahnya maka akan tampil pada App Bar properti apa yang di klik. Seperti onTap jika tombol di klik satu kali maka title pada AppBar akan berubah menjadi “onTap Clicked”. berikut kodingan dari aplikasi diatas:

Pada List View terdapat beberapa Gesture Detector yang memiliki propertinya masing-masing, dan mengimplementasikan method _buildItem yang mana mengatur lebar, tinggi dan title dari komponen yang digunakan untuk menempatkan Gesture Protector. berikut method _buildItem:

Lalu, ketika widget di klik maka pada AppBar akan tampil title dari widget yang di klik, karena pada App Bar kita sudah mengimplemantasikan widget parameter title yang kita deklarasikan pada _buildItem.

Dari kodingan diatas dapat kita lihat bahwa Gesture Protector memiliki berbagai macam listener yang dapat digunakan seperti:

  1. onTap : listener ketika user menekan widget satu kali
  2. onDoubleTap: listener ketika user menekan widget dua kali
  3. onLongPress: listener ketika user menekan dan menahan widget beberapa detik.

Sekian penjelasan singkat mengenai Gesture Detector, semoga bermanfaat.. Semangat Belajar ^.^

source code:

https://github.com/nadillachantika/gestureprotector.git

--

--