Javascript: Capturez le geste de balayage en utilisant ontouchstart avec iOS VoiceOver allumé

Question

Nous développons une application qui utilise des gestes de balayage à gauche et à droite pour naviguer dans le contenu. Pour les utilisateurs aveugles utilisant le lecteur d'écran VoiceOver, le geste est volé par VoiceOver. C'est un problème parce que le geste de balayage est la caractéristique principale de notre application, et fonctionne bien pour les utilisateurs aveugles (mais VoiceOver est nécessaire pour d'autres boutons).

Nous développons en HTML5 javascript avec Cordova/PhoneGap.

Idéalement, nous aimerions désactiver le recouvrement des événements VoiceOver ou désactiver VoiceOver dans une région (c'est-à-dire un DIV). Apple iOS est la cible principale, mais idéalement, il serait également utiliser des normes telles que HTML5 ARIA que nous voulons qu'il fonctionne sur Android avec d'autres lecteurs d'écran.

Answer 1

Nous sommes venus avec une solution de contournement, qui fonctionne pour notre cas d'utilisation. J'ai collé la partie pertinente de mon Speaking Email blog sur la façon dont nous avons obtenu ceci:

Le gros problème est que VoiceOver prend en charge les mouvements de balayage, et une partie fondamentale de notre application est ce que nous appelons le « e-mail curseur "où vous naviguez dans les emails en balayant à gauche et à droite.

Nous avons réussi à résoudre ce problème en présentant le curseur de courrier électronique comme un ARIA "tabset", qui est un composant qui se trouve être navigué en balayant à gauche et à droite. Nous avons nommé les onglets par le titre de l'email (par exemple "Email de Fred Flintstone") de sorte que l'utilisateur peut rapidement basculer entre les e-mails et entendre VoiceOver lire le titre de l'e-mail. Quelques secondes après que l'utilisateur arrête de changer d'onglet (c.-à-d. Glisser vers la gauche et la droite), nous déclenchons notre propre moteur de synthèse vocale pour lire le contenu de l'e-mail comme habituel. Nous avons donc réussi à présenter une interface de balayage gauche et droite en utilisant les normes VoiceOver et WAI ARIA.

Answer 2

NOTE: la solution fournie ci-dessous n'est pas optimale, il serait préférable de fournir une solution différente des gestes.

Il n'existe actuellement aucun moyen d'activer par programmation l'interception de gestes VoiceOver. Le seul moyen est d'amener l'utilisateur à utiliser le geste gestuel iOS. Pour activer ceci, votre région gestuelle doit être focalisée et avoir l'attribut role = "application".

An example can be seen here

Pour utiliser le geste iOS passthru, vous appuyez deux fois et maintenez pendant une seconde. Le contour de VoiceOver disparaît et tous les gestes de glisser-déposer peuvent être utilisés (vous ne pouvez pas utiliser de gestes nécessitant le lever du doigt car cela désactive le passe-partout).

Depuis mes derniers tests avec iOS 8, le rôle d'application est requis. La solution liée fonctionne sur toutes les versions d'iOS jusqu'à la version la plus récente (9.2).

Vous devrez informer les utilisateurs de VoiceOver de la manière d'utiliser le relais en fournissant un texte avec des instructions.

Answer 3

En gardant 4 doigts n'importe où et en balayant avec un doigt sur la zone à glisser, vous travaillerez également. Je l'ai essayé sur un carrousel