Double Tap Issue iOS

I appreciate it is frustrating. Let me see what I can do in finding another developer with bandwidth to look at this.

At the moment we are using personal devices as all the test devices are locked up in the office so we are working with what we have.

I already got a ticket to see if there are spare iOS devices that can be shipped over to me to use a couple of days ago and seeing if I can source another in the meantime.

1 Like

I’ve just tried using a simulator and it’s just too slow to get anything meaningful out of it.

I also have a new project to test the issue with that logs the timings of the double click and missed double clicks (tap on vconsole to see the timings): https://playcanvas.com/editor/scene/926335

Just need a developer (me or someone else) with a device now.

Gotcha, I have the engine source on one tab (to keep looking for leads) and been bothering my friend to test a couple of things

Gave him this: http://jsfiddle.net/brettwp/J4djY/

Reports same problem. It may be a safari issue altogether. Do you guys have any useful contacts to figure that out?

@Leonidas do you remember issues related to any meta tags or header attributes that had to be added as they interfered with touch input on the page? I vaguely a bug years ago related to something like this. Or was that rendering related?

I wonder if Chrome has this issue too on iOS :thinking:

They do have bug database IIRC, might be worth a search there too.

Chrome works the same as Safari
Might be a meta tag behaviour that changed who knows

There were some meta tags required in iOS HTML pages for setting the viewport on Safari. I can’t recall any touch related metatag though. Here is a helpful page for all Apple related HTML metatags used (some deprecated):

https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html

Most likely it will, since on iOS chrome isn’t chromium, Apple enforces all browsers to use the Safari web engine for their browsers implementation.

1 Like

I do wonder if it’s related to the double to zoom feature on both platforms. The engine’s touch callbacks hook directly into the browsers native events.

I hate giving out builds to test that I haven’t tried myself but can someone with this issue try this build please? It calls preventDefault on the browser touchEvent which some say should stop the double tap to zoom feature? https://playcanv.as/p/DzCHGrZP/

Will send it to my friend, will get back to you with the results.

Hay @yaustar! Which info do you need?

Seems to work. If @Albertos can confirm there are no regressions, could you share the changes you made?

If you have had this issue (double click not working all the time), can you try the build posted above please :slight_smile:

Oh really? That’s good to hear!: Project: https://playcanvas.com/project/688746/overview/double-tap-bug

If you ignore the console logging, all I did was call preventDefault on the touch event:

DetectDoubleTap.prototype.onTouchStart = function(touchEvent) {
    // Only register a tap if one finger is used at one time
    if (touchEvent.touches.length > 1) {
        console.warn('More than one finger');
        return;
    }
    
    console.log('Tap');
    
    // Check if user has previously tapped within the time window to be registered as a double tap
    if (this.timeSinceLastTap < this.doubleTapSpeed) {
        // User has double tapped so let's perform an action
        this.onDoubleTap();

        // We should also set the timeSinceLastTap to be outside the time window so their third tap
        // won't accidently be registered as a double tap
        this.timeSinceLastTap = this.doubleTapSpeed;  
    }
    else {
            // Reset timeSinceLastTap if the click was done after the time allowed for a double
            // tap to register
        console.log('Missed tap: ' + this.timeSinceLastTap);
            this.timeSinceLastTap = 0;
    }
    
    touchEvent.event.preventDefault();
};

I need to do some more investigation on this as this could be solved with a CSS change and I need to make a change to the API/JS docs of the engine to make this fix ‘official’

1 Like

No I didn’t have the problem and the project works too. (Double tap to change orientation). But I see missed taps in the log, is that oke?

Yeah that fine as that’s due to the gap between the second tap of a previous double tap and a new first tap.

1 Like

I’ve got hold of an iPhone 6 Plus (thanks to my inlaws) with iOS 12.4.5 and I can’t reproduce the original bug either. Double tap works fine in the original project. Has your friend got any assistive settings enabled on the device?

Sorry @NokFrt, I can’t reproduce this issue on Android either with this project: https://playcanvas.com/editor/scene/926464

(Changes colour on the touch end event)

Hi @yaustar . I made a standalone project to test this issue and you are right - the problem on Android is not there but double tap issue on iOS is still present. It’s strange because if I use exactly the same code in my game, I will receive pc.EVENT_TOUCHEND after a second or two even if the finger is still touching the screen.

Here is my test project: http://games.1-easysoft.com/touchTest/ (I use Typescript + Playcanvas engine, I don’t know how to make project in the Playcanvas editor).

This is how I handle touch events:

Game._APP = new pc.Application(canvas, { touch: new pc.TouchDevice(canvas) });
        
if (Game.APP.touch) {
            Game.APP.touch.on(pc.EVENT_TOUCHSTART, (event: pc.TouchEvent): void => {
                console.addEntry("TOUCH START: " + event.changedTouches[0].id);
            }, this);
            Game.APP.touch.on(pc.EVENT_TOUCHEND, (event: pc.TouchEvent): void => {
                console.addEntry("TOUCH END: " + event.changedTouches[0].id);
            }, this);
            Game.APP.touch.on(pc.EVENT_TOUCHCANCEL, (event: pc.TouchEvent): void => {
                console.addEntry("TOUCH CANCEL: " + event.changedTouches[0].id);
            }, this);
        }

(console in not a browser’s console. It’s my object which output lines of text to the screen)

The touble tap iOS bug is present only on some iOS devices. This is my test project: http://games.1-easysoft.com/touchTest/

These are the results:

iPhone X: double tap doesn’t work
iPhone 7 - it works
iPad Mini 2 - it works
iPhone SE - it doesn’t work
iPhone 6S - it doesn’t work
another iPhone 6S - it works

I solved the issue by listening to native touch events:

        let canvas = document.getElementById(canvasID) as HTMLCanvasElement;

        canvas.addEventListener("touchstart", (event: TouchEvent) => {
            event.preventDefault();
            // ...
        }, false);
        canvas.addEventListener("touchend", (event: TouchEvent) => {
            event.preventDefault();
            // ...
        }, false);
        canvas.addEventListener("touchcancel", (event: TouchEvent) => {
            event.preventDefault();
            // ...
        }, false);

	Game._APP = new pc.Application(canvas, { keyboard: new pc.Keyboard(window), /*touch: new pc.TouchDevice(canvas),*/ elementInput: new pc.ElementInput(canvas) });

1 Like

In these tests, it seems that double tap does indeed not work on my iPhone X running iOS 13.5. It also seems that your previous test project (change color at touch input) is not working properly.