This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Lukas Arvidsson
Posted Mar 04 - Read on Facebook

Ok! Very simple question. But how do you separate between a click and a drag? I want one action when i click an image and another when it is dragged...

12 Comments

Alex Bystrov

+1 same question

Kevin Velasco

What do you mean, exactly? Do the Events.click / Events.dragStart not help you?

Lukas Arvidsson

Both trigger at the same time, that is the problem for me, but maybe i have done something wrong...

Koen Bok

This is the way:

- Record the position of a layer on TouchDown
- On TouchUp see if the position changed
- If it changed, it was dragged so no click, if not click

(This is how iOS does it too)

Kevin Velasco

you could try mapping it to the end action instead: Events.touchEnd

Lukas Arvidsson

Thank you Koen Bok, that sounds reasonable, maybe this should be added to the documentation somewhere, could probably be a common question!

Kevin Velasco

That, that works too.

Koen Bok

Sounds like a lot of work, but should be ~4 lines of code that you can wrap in a function to re-use. I have plans to add this to the Framer core.

Andreas Wahlström

Adding this calculation to Events.Click would be great. Seems like a common problem

John Anthony Evans

Kevin TouchUp is fired when the drag completes.

FWIW I set a flag using the Drag events that I can test on any other Event and I always use TouchUp for tap interactions.

http://share.framerjs.com/mpc8h64jtzh9/

Kevin Velasco

TIL.

Fran Pérez

This is what I do :) (It's actually Koen suggestion)

Read the entire post on Facebook