How to detect swipe direction?
Scott Rossi
scott at tactilemedia.com
Sun Oct 6 21:23:55 EDT 2013
I imagine you need to implement swipe detection before triggering
scrolling, and scrolling needs to be triggered only after exceeding a
distance threshold. The mail app is a good example. If you look
carefully, scrolling doesn't begin until touch exceeds a small distance,
so swipe to delete has a chance to operate before scrolling takes place.
That's my guess anyway...
Regards,
Scott Rossi
Creative Director
Tactile Media, UX/UI Design
On 10/6/13 5:24 PM, "Terry Judd" <terry.judd at unimelb.edu.au> wrote:
>Thanks for the code Scott. On a related issue, I've tried a number of
>different approaches for implementing side-to-side swiping within a
>vertically scrolling group (a day-per-view calendar object) but haven't
>managed to come up with anything that works reliably - especially on iOS.
>
>A combination of touchStart and touchRelease handlers works sort of OK on
>Android (touchMove and touchEnd messages don't seem to get sent reliably)
>but on iOS I don't seem to be able to prevent the group from scrolling
>vertically if the swipe is more than a little bit off the horizontal.
>
>Any ideas?
>
>Terry...
>
>On 07/10/2013, at 10:26 AM, Scott Rossi wrote:
>
>> Hi Roger:
>>
>> Might be wrong, but I don't believe there's a built-in swipe
>> monitor/property. I put together the following to detect course swipe
>> direction and added the ability to track the swipe angle. You can set
>>the
>> swipe distance threshold to control when an event is triggered from a
>> swipe. The code is written to place direction output in a field.
>>
>>
>> -- 50 PIXEL SWIPE THRESHOLD
>>
>> local hStart, vStart, theSwipeData
>> local theThreshold = 50
>>
>> on touchStart theID
>> put item 1 of mouseLoc() into hStart
>> put item 2 of mouseLoc() into vStart
>> end touchStart
>>
>> on touchmove theID, X, Y
>> put empty into theSwipeData
>> if Y > vStart and abs(vStart - Y) > theThreshold then put "down,"
>> after theSwipeData
>> if Y < vStart and abs(vStart - Y) > theThreshold then put "up," after
>> theSwipeData
>> if X > hStart and abs(hStart - X) > theThreshold then put "right,"
>> after theSwipeData
>> if X < hStart and abs(hStart - X) > theThreshold then put "left,"
>> after theSwipeData
>> if theSwipeData is not empty then put locToAngle(X,Y,hStart,vStart)
>> after theSwipeData
>> end touchmove
>>
>> on touchEnd theID
>> put "swipe: " into theResult
>> if theSwipeData is not empty then put theSwipeData after theResult
>> set text of fld 1 to theResult
>> end touchEnd
>>
>> function locToAngle pX,pY,pXorigin,pYorigin
>> put atan2(pY - pYorigin,pXorigin - pX) into R
>> return round(180+(R*(180/pi)))
>> end locToAngle
>>
>>
>>
>>
>>
>> Hope this helps.
>>
>> Regards,
>>
>> Scott Rossi
>> Creative Director
>> Tactile Media, UX/UI Design
>>
>>
>>
>>
>> On 10/6/13 2:09 PM, "Roger Eller" <roger.e.eller at sealedair.com> wrote:
>>
>>> I want a different action to occur based on the direction the user
>>>swipes
>>> a
>>> control. For example:
>>>
>>> on swipeLeft
>>> set the backgroundColor of me to red
>>> end swipeLeft
>>>
>>> on swipeRight
>>> set the backgroundColor of me to green
>>> end swipeRight
>>>
>>> Is there a one liner on mobile that can give me the direction, or
>>> true/false, or l/r/u/d?
>>>
>>> ~Roger
>>> _______________________________________________
>>> use-livecode mailing list
>>> use-livecode at lists.runrev.com
>>> Please visit this url to subscribe, unsubscribe and manage your
>>> subscription preferences:
>>> http://lists.runrev.com/mailman/listinfo/use-livecode
>>>
>>
>>
>>
>> _______________________________________________
>> use-livecode mailing list
>> use-livecode at lists.runrev.com
>> Please visit this url to subscribe, unsubscribe and manage your
>>subscription preferences:
>> http://lists.runrev.com/mailman/listinfo/use-livecode
>>
>
>Dr Terry Judd
>Senior Lecturer in Medical Education
>Medical Education Unit
>Faculty of Medicine, Dentistry & Health Sciences
>The University of Melbourne
>
>
>
>
>
>
>_______________________________________________
>use-livecode mailing list
>use-livecode at lists.runrev.com
>Please visit this url to subscribe, unsubscribe and manage your
>subscription preferences:
>http://lists.runrev.com/mailman/listinfo/use-livecode
>
More information about the use-livecode
mailing list