Gestures In Flutter

Updated 27 April 2023

Save

Before starting our Blog topic Gestures In Flutter, we will discuss in short what is Gestures and why we need them? Gestures are basically the touch event on mobile that intentionally active some event defined for that gesture.

Flutter provides an in-build invisible widget called GestureDetector, which supports all types of click events and other gestures used in mobile application development. GestureDetector captures the gesture and performs the events on the basis of the click.

You may also explore our Flutter app development page

The following are common gestures captured by the GestureDetector widget, their corresponding events are as follows:

1. Tap

When the user normally clicks on the screen. Following are the events inside this gesture.
1.0 onTapDown
1.1 onTapUp
1.2 onTap
1.3 onTapCancel

2. Double-tap

When the user clicks the screen on the same location in a quick time this will lead to triggering the double-tap gesture. Following are the events inside this gesture.
2.0 onDoubleTap
2.1 onDoubleTapDown
2.3 onDoubleTapCancel

3. Long press

When the user makes contact with a screen in the same location for a long time will lead to a Long Press gesture. Following are the events inside this gesture.
3.0 onLongPressDown
3.1 onLongPressStart
3.2 onLongPress
3.3 onLongPressMoveUpdate
3.4 onLongPressEnd
3.5 onLongPressUp
3.6 onLongPressCancel

4. Vertical drag

When the user made contact with the screen and moves the finger in a vertical direction without removing the contact from the screen. Following are the events inside this gesture.
4.0 onVerticalDragStart
4.1 onVerticalDragUpdate
4.2 onVerticalDragEnd

5. Horizontal Drag

When the user made contact with the screen and moves the finger in a horizontal direction without removing the contact from the screen. Following are the events inside this gesture.
5.0 onHorizontalDragStart
5.1 onHorizontalDragUpdate
5.2 onHorizontalDragEnd

Conclusion:

Hope this blog helps you to understand the basic uses of Gestures In Flutter as well as the GestureDetector Widget. You can use the gestures in your application as per your need.

Thank you for reading!!

For more information, you can visit the Dev Console.

author
. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

Start a Project


    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home