SwipeGestureHandler

SwipeGestureHandler example

export component Example inherits Window {
    width: 270px;
    height: 100px;

    property <int> current-page: 0;

    sgr := SwipeGestureHandler {
        handle-swipe-right: current-page > 0;
        handle-swipe-left: current-page < 5;
        swiped => {
            if self.current-position.x > self.pressed-position.x + self.width / 4 {
                current-page -= 1;
            } else if self.current-position.x < self.pressed-position.x - self.width / 4 {
                current-page += 1;
            }
        }

        HorizontalLayout {
            property <length> position: - current-page * root.width;
            animate position { duration: 200ms; easing: ease-in-out; }
            property <length> swipe-offset;
            x: position + swipe-offset;
            states [
                swiping when sgr.swiping : {
                    swipe-offset: sgr.current-position.x - sgr.pressed-position.x;
                    out { animate swipe-offset { duration: 200ms; easing: ease-in-out; }  }
                }
            ]

            Rectangle { width: root.width; background: green; }
            Rectangle { width: root.width; background: limegreen; }
            Rectangle { width: root.width; background: yellow; }
            Rectangle { width: root.width; background: orange; }
            Rectangle { width: root.width; background: red; }
            Rectangle { width: root.width; background: violet; }
        }
    }
}

Run in Slintpad

Use the SwipeGestureHandler to handle swipe gesture in some particular direction. Recognition is limited to the element’s geometry.

Specify the different swipe directions you’d like to handle by setting the handle-swipe-left/right/up/down properties and react to the gesture in the swiped callback.

Pointer press events on the recognizer’s area are forwarded to the children with a small delay. If the pointer moves by more than 8 logical pixels in one of the enabled swipe directions, the gesture is recognized, and events are no longer forwarded to the children.

enabled

type: bool
default: true

When disabled, the SwipeGestureHandler doesn’t recognize any gestures.

pressed-position

type: Point (out)
default: (0px, 0px)

Point

This structure represents a point with x and y coordinate

• x (length):
• y (length):

The position of the pointer when the swipe started.

current-position

type: Point (out)
default: (0px, 0px)

Point

This structure represents a point with x and y coordinate

• x (length):
• y (length):

The current pointer position.

swiping

type: bool (out)
default: false

true while the gesture is recognized, false otherwise.

Handle swipe directions properties

handle-swipe-left

type: bool
default: false

handle-swipe-right

type: bool
default: false

handle-swipe-up

type: bool
default: false

handle-swipe-down

type: bool
default: false

Callbacks

• moved(): Invoked when the pointer is moved.
• swiped(): Invoked after the swipe gesture was recognized and the pointer was released.
• cancelled(): Invoked when the swipe is cancelled programmatically or if the window loses focus.

Functions

• cancel(): Cancel any on-going swipe gesture recognition.