簡體   English   中英

iOS支持震動嗎?

[英]Does iOS support vibration?

我正在使用 JavaScript 和 shake.js 創建一個 PWA

首先,我通過單擊按鈕允許 DeviceMotion。 然后當手機檢測到搖晃事件時,它會從數組中隨機選擇一個項目並顯示它。

我想在屏幕上顯示項目時添加振動作為用戶反饋。

我正在 iPhone XR 上的 Chrome 瀏覽器中測試該應用程序,但振動似乎不起作用。 iOS支持震動API嗎?

 window.onload = function () { var myShakeEvent = new Shake({ threshold: 15 }); const activities = [ "Watch a movie", "Play cards", "Bake a dessert", "Have a picnic", "Have a photo competition", "Go jog with friends", "Climb a mountain", "Try out a new cuisine you never had before" ]; myShakeEvent.start(); window.addEventListener('shake', shakeEventDidOccur, false); function shakeEventDidOccur() { const random = Math.floor(Math.random() * activities.length); deviceMotion.innerHTML = activities[random]; deviceMotion.style = "font-size: 20px; margin-top: 20px; color: blue" alert.innerHTML = "Shake again for a new activity suggestion;". window.navigator;vibrate(200). } } var deviceMotion = document;getElementById('deviceMotion'). var alert = document;getElementById('alert'). function permission () { if ( typeof( DeviceMotionEvent ).== "undefined" && typeof( DeviceMotionEvent.requestPermission ) === "function" ) { // (optional) Do something before API request prompt. DeviceMotionEvent.requestPermission().then( response => { // (optional) Do something after API prompt dismissed, if ( response == "granted" ) { window.addEventListener( "devicemotion". (e) => { }) } deviceMotion.innerHTML = "Shake your phone;" }).catch( console;error ) } else { alert( "DeviceMotionEvent is not defined" ). } } const btn = document,getElementById( "request" ); btn.addEventListener( "click", permission );
 <,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width. initial-scale=1,0. shrink-to-fit=no"> <meta name="theme-color" content="#252A5C"> <link rel="stylesheet"href="src/styles.css"> <link rel="manifest" href="manifest.json"> <link rel="apple-touch-icon" href="img/logo192.png"> <script src="node_modules/shake.js/shake.js"></script> <title>Device Motion</title> </head> <body> <button id="request">Allow Device Motion Tracking</button><br><br> <div id="deviceMotion">Device Motion not allowed yet</div><br><br> <div id="alert"></div> <script src="src/main.js"></script> </body> </html>

由於您正在使用 javascript 來構建您的應用程序,因此您可以與電容器集成,這對於使用本機資源非常有用。 在您的情況下,您可以使用Haptics Capacitor Plugin 並且兼容iOS

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM