How to detect swipe direction?

Terry Judd terry.judd at unimelb.edu.au
Mon Oct 7 03:58:34 CEST 2013


On 07/10/2013, at 12:23 PM, Scott Rossi wrote:

> 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...

Thanks Scott. The iOS Calendar app works like that too and is exactly how I would like my app to behave. I've tried disabling the scroller as the default and then enabling it in a touchMove handler when the vertical swipe component is greater than the horizontal - but I couldn't get that to work either. I'll have another crack at it one day.

Terry...

> 
> 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
>> 
> 
> 
> 
> _______________________________________________
> 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








More information about the use-livecode mailing list