[New plugin] Enable swipe #native mobile XP (works on mobile)

Hello everyone !

Labastide.io is happy to introduce you a brand new paid plugin !

You can now use the swipe on mobile !

note : if you try to use/test it in desktop mode , it might not work as you expected. Turn you app into mobile view with the browser inspector to try it !

How does it works ?

Adding a Swipe Element to the Page
Add the Element to Swipe:

Simply place the element you want to swipe on your page.
Choose an ID Attribute:

Assign a unique ID to the element you want to swipe so that the plugin can identify it.
Available Configurations:

Detection of Passing:
Configure the criteria to detect if the swiped element has passed a specific reference element.
You can choose to detect when the swiped element passes the reference element either at the first pixel or completely.
Swipe Direction:
Define the direction of the swipe (left, right, up, down, horizontal, vertical).
Trigger Condition:
Determine the condition that triggers the passing detection: either by going out of the screen (out_of_the_screen) or by going out of a specific element (out_of_an_element).
Trigger Point:
Specify the trigger point (first pixel or full element) to activate the passing event.
Publish on Move:
Enable publishing information during the movement to get real-time updates on the swipe position.
Receiving Information:

When the swiped element passes the reference element according to the defined criteria, events are triggered, and the corresponding information is published:
unique_id_swipe: Unique ID of the swiped element.
swipe_position: Position of the swipe (first_pixel or full_element).
swipe_direction: Direction of the swipe.
Use these events and published states to perform specific actions on your page.

  • You can also detect the “swipped speed” on an element (very usefull to combine it with the “swipper” to include a fluid behavior to close en modal element for example). Simply add the swipe speed element.

Those elements are working perflectly in a repeating group . Make sur to attribute a unique id attribute to each element.

We also included a pressed watcher

Try out this plugin on the demo page :

Happy to have your feedback and questions or helping you to configure it with more example if necessary

1 Like