IWantToLearn
IWantToLearn

Reputation: 21

Optimizing 'drawing' application on Iphone so screen does not move when user is drawing

I am using the API from myscript for character recognition

https://myscript.github.io/MyScriptJS/examples/v4/websocket_text_iink_no_smartguide.html

I am creating a web application to be used through mostly phones, however in the link provided, on some phones, when the user attempts to draw, the screen scrolls up and down in sync with the user's movements. This does not happen to all phones, just a few (I have tested it on iPhone 6s and iPhone 8s). I am thinking this is a zoom issue, is there a setting anyone knows that could be causing this? I am trying to replicate the issue on phones that do not have the issue, but to no success. And is there any optimization settings I could take when developing the web application?

Upvotes: 0

Views: 33

Answers (1)

Merijn Den Houting
Merijn Den Houting

Reputation: 199

You'll have to prevent the scrolling through JavaScript. Since the 11.1 Safari update (https://developer.apple.com/library/archive/releasenotes/General/WhatsNewInSafari/Articles/Safari_11_1.html) document touch event listeners are now passive by default so you'll need to set it back to false like this

document.addEventListener('touchmove', function(e) {
e.preventDefault();
}, { passive: false });

this however prevents scrolling on the entire page, so you might want to replace document for the div the user can draw in.

Upvotes: 0

Related Questions