DecSoft Support - Some questions about the touch events

Some questions about the touch events

Apache Cordova's official plugins are supported out of the box and there are hundreds of plugins ready to use.

Compile, convert your modern HTML apps and games into Microsoft Windows executable programs without dependencies.

DecSoft NeoPlugins put your VisualNeo projects into another level with +1,000 new actions for your apps.

Take a look at some frequently asked questions about us and our products!

Create modern HTML apps and games at another level making things impossible to do even by modern HTML apps and games.

DecSoft App Builder integrates an Open AI assistant in order to assist you while developing your apps.

Create apps and expand their capabilities by using the world's popular programming language: Javascript.

DecSoft NeoPlugins are available in both runtime and designtime flavours to keep your apps as small as possible.

DecSoft App Builder include a convenient Command Line Compiler, so you can compile your apps from the console.

Save time, resources and money creating apps for Android, iOS and more with the same base of code.

Create multiplatform apps with DecSoft App Builder, including Android and iOS with the same base of code.

DecSoft HTML Compiler include a convenient Command Line Compiler, so you can compile your apps from the console.

Take a look at our YouTube channel and subscribe to be notified about new videos!

DecSoft HTML Compiler is easy to use: set your project's options and compile your apps and games in a nutshell.

Save money by purchasing our NeoPlugins bundles. Five, Ten and even the complete NeoPlugins collection at an incredible price!

Design for small screen devices but deploy also (without changes) in larger devices like tablets.

Adrian Brookbank

Hi David,

Can touch events be added to control options. I know we have mouse up and mouse down - but these don’t seem to work correctly.

I’m wanting to change opacity on mouse down and up of an object this is working fine on Chrome but when I port to Cordova into iOS device this doesn’t work as expected.

See this, might be a conflict in click / timings to mouse up and down.?

https://www.html5rocks.com/en/mobile/touchandmouse/

Thanks for your help,

DecSoft

Hello Adrian,

We already use FastClick to avoid certain "timing" issue between the tap and click on mobile browsers. If I am not wrong, your issue is not specifically related with that.

In principle, we no need touch events, because, at the end a "touchstart" event, for example, finally fire an "onclick" event, also in touch devices. Maybe you don't believe me, but, I have here now various "touch" events implemented in AB, and, after work on it, I am not sure if go ahead or not.

Adding these touch events can made the things more complex, and, I am not really sure if what you wanted amerited to include the touch events in AB. For example, the below code in an app's view Show event can do what you wanted for all the buttons in the view:

StartJS
 $('button')
  .on('touchstart', function (event) {
    event.target.style.opacity = '0.5';
  })
  .on('touchend', function (event) {
    event.target.style.opacity = '1';
  });
EndJS

Believe me, Adrian, it's not a problem to add these touch events in AB, and, in fact, I already do it for the Push button control. However, I am not sure if go ahead and publish a new AB release with that events. Just because I think that that events can made somethings more complex than now.

Note that the above code, for example, don't prevent the Click event to be executed (this is one of the things that we must to think about), if you want to do that, you must use the "preventDefault" in the "startend" event, like in the below code:

StartJS
 $('button')
  .on('touchstart', function (event) {
    event.target.style.opacity = '0.5';
  })
  .on('touchend', function (event) {
    event.preventDefault();
    event.target.style.opacity = '1';
  });
EndJS

The above code don't work in browsers who don't support the touch (in non touch devices, for example). If you want that the code works also in these browsers you must add the appropriate events, like in the below code:

StartJS
 $('button')
  .on('touchstart mousedown', function (event) {
    event.target.style.opacity = '0.5';
  })
  .on('touchend mouseup mouseleave', function (event) {
    event.target.style.opacity = '1';
  });
EndJS

Purchase one or more licenses of our products if they are useful to you!

Everybody can read the DecSoft support forum for learning purposes, however only DecSoft customers can post new threads. Purchase one or more licenses of some DecSoft products in order to give this and other benefits.