675
Views
9
Comments
Outsystems mobile hold touch event
Question

I was wondering if it's possible to 

execute action after touch start and holding down for a certain sec.

Like what we typically see on phone where you touch and hold down for like 2 secs then a popup will appear.


2017-07-05 22-17-18
Henrique Batista
Staff

Hi Christian,


You can do something like the following:

  1. Associate a handler to the OnTouchStart event 
  2. Inside that Action declare a timeout, let's say 1sec to run the desired action, let's call it OpenPopup.
  3. Associate the handler to OnTouchEnd
  4. Inside the OnTouchEnd clear the timeout variable
  5. On the OpenPopup clear the timeout variable and do your code.

This should do the trick.

Let me know if it worked.


Cheers


UserImage.jpg
Ota chan

It works now, I missed the touch end thing thanks!. How do I open the modal that is based on the variable though? i cant assign a variable inside settimeout

2017-07-05 22-17-18
Henrique Batista
Staff

Hi Ota,


You can call actions from inside the Javascript node, look at the below image:


Just Drag&Drop them to the code.

Inside the action you just do your code.


Let me know if it worked

Cheers,

UserImage.jpg
Erick CHEA

Hello i would like to do the same thing that John Wrick wanted but i don't understand Henrique's answer.

  1. Associate a handler to the OnTouchStart event 
    Do you use the "TouchEvents" utility? 
  2. Inside that Action declare a timeout, let's say 1sec to run the desired action, let's call it OpenPopup.
    How do you "declare a timeout" in a client action? 
  3. Associate the handler to OnTouchEnd
    Do you use the same handler without le timeout?
  4. Inside the OnTouchEnd clear the timeout variable
  5. On the OpenPopup clear the timeout variable and do your code.
    "do your code" : Javascript code? 

    Thanks in advance for your answers, 

    Regards,


2017-07-05 22-17-18
Henrique Batista
Staff

Hi Eric,

On my example, I didn't use the TouchEvents block. 

Ok, let's go through your questions 1 by one

  1. Nop, on my example i was using OnTouchStart and OnTouchEnd events from the events properties present on the container, please see below image:
  2. You can run javascript code on client actions by using the Javascript node. The image below is not tested code, just to exemplify how you can achieve it 

  3. The handler is the one that it's present on the first image, where you pick which action will handle the OnTouchEnd. There you should cancel the timeout, so the action OpenPopup() doesn't run

  4. --

  5. For "do your code" i meant your business logic. On this example we were opening a popup, so on the OpenPopup action you should set the variable that controls the popup to true so the popup appear.


Let me know if it helped.


Cheers,

UserImage.jpg
Erick CHEA

Thank you, i used a different way to do it (with OnTouchStart and OnTouchEnd) but it works right now !


2017-07-05 22-17-18
Henrique Batista
Staff

Great,

I'm glad you found a solution!

Cheers

2018-07-03 14-19-02
Saulo Goncalves

Erick, share your solution

2024-04-24 19-28-09
Justin Babel

Hi Saulo,

I’ve recently published the following component to help you achieve this easier:

https://www.outsystems.com/forge/component/3374/custom-touch-events/

For this specific use case, you would use the press handler and change the time input variable.

Let me know if you have any issues,

Justin

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.