Comment utiliser l'API de vibration HTML5

La popularité des appareils mobiles a fait que de plus en plus les utilisateurs accédaient aux pages Web via des téléphones mobiles et des tablettes. En décembre 2013, une visite sur cinq sur cinq provient d'un appareil mobile. Ce ratio peut être plus élevé si votre site Web ou votre application est en mesure de s'adapter aux appareils mobiles. Le développement multi-appareils fait face à des défis, mais il apporte également des possibilités que les ordinateurs de bureau ne peuvent pas réaliser. Par exemple, le mécanisme de vibration est un simple dispositif de rétroaction haptique qui vous rappelle de nouveaux messages ou appels. Il est particulièrement utile dans des environnements bruyants ou calmes (le son peut provoquer des interférences). Ne serait-ce pas génial si votre application peut utiliser la fonctionnalité de vibration?

• Instructions de route de marche: Tournez à gauche et vibrez deux fois.
• Lorsqu'un événement se produit ou que vous approchez de quelqu'un, le téléphone vibre de manière spécifique.
• Vous pouvez envoyer des messages secrets à l'aide de codes Morse basés sur des vibrations!
• Le jeu peut améliorer l'expérience de jeu en vibrant lorsque vous entrez en collision ou que vous êtes touché par un missile.

L'API de vibration HTML5 vous permet de le faire!

La vibration est-elle requise?

juste parce que nous pouvons faire vibrer le téléphone, cela ne signifie pas que nous devrions le faire. Les vibrations peuvent sévèrement vider la batterie, donc si la batterie est faible ou que le jeu ne fonctionne pas dans l'onglet actuel, il est préférable de le désactiver. Selon votre application, il est préférable de fournir des options d'utilisateur afin de pouvoir activer, désactiver ou configurer des conditions de vibration.

Prise en charge et détection du navigateur

Cette API est relativement nouvelle et est actuellement limitée aux dernières versions de Firefox et de support chromé. Les versions antérieures nécessitent respectivement les préfixes de Moz et WebKit. Vous devez également utiliser un appareil avec un mécanisme de vibration - l'API peut être disponible dans votre navigateur, mais sans le mécanisme de vibration, vous ne saurez pas si cela fonctionne! Utilisez les vérifications suivantes pour détecter le support des vibrations:

if ("vibrate" in navigator) {
    // 支持振动 API
}

Pour vérifier et utiliser une version préfixée, vous pouvez utiliser le code suivant:

// 启用振动支持
navigator.vibrate = navigator.vibrate || navigator.webkitVibrate || navigator.mozVibrate || navigator.msVibrate;

if (navigator.vibrate) {
    // 支持振动 API
}

Basiques des vibrations

La vibration de base peut être définie en passant des millisecondes à Navigator.vibrate:

// 振动一秒钟
navigator.vibrate(1000);

Alternativement, vous pouvez passer un tableau contenant des paramètres de vibration et de retard spécifiés en millisecondes. Par exemple, pour vibrer 500 millisecondes, attendez 300 millisecondes, puis vibrez à nouveau 100 millisecondes:

// 振动一秒钟
navigator.vibrate([500, 300, 100]);

Les termes du tableau avec des index uniformes définissent le temps de vibration (le tableau commence à zéro, donc les premier et troisième termes sont respectivement de 0 et 2). Un élément de tableau avec un index impair définit le temps de retard. Les vibrations sont non bloquantes; Pour arrêter les vibrations, vous pouvez passer des zéros à Navigator.vibrate. Ce concept peut être utile dans le jeu. Par exemple, lorsqu'un utilisateur écrase une voiture, vous définissez Navigator.Vibrate (10000). Cependant, si l'effet de collision se termine dans les 10 secondes, définissez Navigator.vibrate (0) pour mettre fin à la vibration.

Demo de vibration

Pour tester l'API sur votre appareil ... Afficher la démo de l'API vibration ... Afficher tous les code source HTML, CSS et JavaScript. Le paramètre de formulaire construit un tableau qui est passé à Navigator.vibrate lors du démarrage de Click. Lorsque le bouton "Stop" est cliqué, Navigator.Vibrate (0) est exécuté. Utilisez l'API Vibration autant que vous le souhaitez, faites-moi savoir si vous avez des utilisations intéressantes.

HTML5 API de vibration FAQ

Quelle est l'API de vibration HTML5?

L'API de vibration HTML5 est un outil puissant qui permet aux développeurs d'accéder à un matériel vibrant par programme sur leurs appareils (s'ils sont présents). Cela peut être utilisé pour fournir une rétroaction haptique à l'utilisateur en fonction de divers événements, tels que la réception de notifications ou appuyer sur un bouton. Il convient de noter que l'API ne garantit pas que les vibrations se produiront, car la décision finale est laissée au système d'exploitation et aux paramètres de l'utilisateur.

Comment utiliser l'API de vibration dans mon application Web?

Pour utiliser l'API de vibration, vous devez appeler la méthode Navigator.Vibrate (). Cette méthode accepte un seul entier ou un tableau d'entiers. Un seul entier représente le nombre de millisecondes de vibrations. Un tableau d'entiers représente les modes de vibration et de pause. Par exemple, Navigator.Vibrate (200) vibrera le dispositif pour 200 millisecondes, tandis que Navigator. vibrate ([200, 100, 200]) vibrera l'appareil pour 200 millisecondes, s'arrêtera pour 100 millisecondes, puis vibrera à nouveau pendant 200 millisecondes .

Puis-je utiliser l'API de vibration sur tous les appareils?

L'API de vibration

est principalement utilisée dans les appareils mobiles avec du matériel de vibration intégré. Cependant, l'API peut être appelée sur n'importe quel appareil. Si l'appareil ne prend pas en charge les vibrations, l'appel à navigator.vibrate () sera simplement ignoré.

Comment vérifier si l'appareil prend en charge l'API de vibration?

Vous pouvez utiliser la propriété vibrée de l'objet Navigator pour vérifier si le périphérique prend en charge l'API de vibration. Si cette propriété existe, l'appareil prend en charge l'API. Voici comment vous pouvez faire cela: if ("vibrer" dans Navigator) {/ Le périphérique prend en charge la vibration /}.

Puis-je arrêter les vibrations avant la fin de la vibration?

Oui, vous pouvez arrêter la vibration avant sa fin en appelant la méthode Navigator.Vibrate () avec le paramètre 0 ou un tableau vide. Par exemple, Navigator.Vibrate (0) ou Navigator.Vibrate ([]).

Tous les navigateurs soutiennent-ils l'API de vibration?

La plupart des navigateurs modernes, y compris Chrome, Firefox et Opera, soutiennent l'API de vibration. Cependant, Internet Explorer ne le prend pas en charge et Safari a un support limité.

Puis-je utiliser l'API de vibration dans le contexte du thread des travailleurs?

Non, l'API de vibration n'est pas disponible dans le contexte du thread des travailleurs. Il ne peut être utilisé que dans le contexte du navigateur principal.

y a-t-il des restrictions sur l'utilisation de l'API de vibration?

Oui, il y a certaines limites à l'utilisation de l'API de vibration. Par exemple, dans certains navigateurs, les API ne peuvent être utilisées qu'en réponse aux actions des utilisateurs, telles que des clics ou des touches, pour prévenir les abus ou une utilisation ennuyeuse.

Puis-je spécifier l'intensité de la vibration?

Non, l'API de vibration ne vous permet pas de spécifier l'intensité de la vibration. La résistance est contrôlée par le matériel et le système d'exploitation de l'appareil.

Puis-je utiliser l'API de vibration pour créer des modes de vibration complexes?

Oui, vous pouvez créer des modèles de vibration complexes en utilisant l'API de vibration en passant un tableau d'entiers à la méthode Navigator.Vibrate (). Chaque entier du tableau représente la durée de vibration ou de pause. Par exemple, Navigator.Vibrate ([200, 100, 200, 100, 200]) créera un schéma composé de trois vibrations, chacune de 200 millisecondes durables, séparées par deux pauses, chacune durable de 100 millisecondes.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!