Rumah > hujung hadapan web > uni-app > teks badan

Cara Uniapp memantau Shake

PHPz
Lepaskan: 2023-04-27 14:36:26
asal
1367 orang telah melayarinya

Uniapp ialah rangka kerja pembangunan aplikasi merentas platform berdasarkan rangka kerja Vue.js, yang boleh digunakan untuk membangunkan aplikasi untuk berbilang platform seperti iOS, Android, H5 dan applet. Dalam banyak aplikasi, goncang adalah fungsi yang sangat biasa Artikel ini akan memperkenalkan cara melaksanakan fungsi goncangan pemantauan dalam Uniapp.

1. Prinsip gegaran

Prinsip gegaran adalah menggunakan sensor pecutan terbina dalam telefon bimbit untuk mendapatkan data pecutan telefon mudah alih, dan menentukan sama ada gegaran mempunyai berlaku dengan menganalisis perubahan dalam tindakan pecutan. Khususnya, apabila telefon pegun, nilai pecutan yang diukur oleh penderia pecutan ialah 1g Apabila telefon bergegar, nilai pecutan yang diukur oleh penderia pecutan akan berubah dengan mengesan perubahan dalam nilai pecutan. Gerak gegar.

2. Langkah untuk memantau gegaran dalam Uniapp

  1. Pasang pemalam uni-mpvue-broker dalam projek uni-app

Dalam Uniapp Pemalam uni-mpvue-broker diperlukan untuk pemantauan dan gegaran, yang boleh dipasang dalam projek melalui arahan berikut:

npm install @dcloudio/uni-mpvue-broker

  1. dalam Perkenalkan pemalam ke dalam halaman

Perkenalkan pemalam ke dalam halaman yang perlu memantau gegaran Berikut ialah App.vue sebagai contoh:

<template>
  <div class="container">
    ...
  </div>
</template>

<script>
import broker from '@dcloudio/uni-mpvue-broker'
export default {
  created () {
    broker.emit('JSBridgeReady')
  }
}
</script>
Salin selepas log masuk
  1. Dengar acara goncang

Dalam fungsi kitaran hayat halaman yang dicipta, dengar acara JSBridgeReady melalui broker.emit('JSBridgeReady'), dan dengar acara goncang melalui uni.onAccelerometerChange() dalam fungsi mendengar acara:

<script>
import broker from '@dcloudio/uni-mpvue-broker'
export default {
  created () {
    broker.emit('JSBridgeReady')
    broker.on('onAccelerometerChange', this.onAccelerometerChange)
  },
  destroyed () {
    broker.off('onAccelerometerChange', this.onAccelerometerChange)
  },
  methods: {
    onAccelerometerChange (res) {
      let acceleration = res.accelerationIncludingGravity
      let speed = Math.abs(acceleration.x + acceleration.y + acceleration.z - this.lastAcceleration.x - this.lastAcceleration.y - this.lastAcceleration.z) / (new Date().getTime() - this.lastTime)
      if (speed > 30) {
        console.log('发生了摇一摇的动作')
      }
      this.lastAcceleration = acceleration
      this.lastTime = new Date().getTime()
    }
  }
}
</script>
Salin selepas log masuk

Dalam fungsi mendengar acara onAccelerometerChange, mula-mula dapatkan nilai pecutan semasa dan tentukan sama ada tindakan gegaran telah berlaku dengan mengira kelajuan. Di sini anda boleh melaraskan ambang kelajuan sendiri untuk menentukan sensitiviti goncangan. Pada masa yang sama, untuk mengelakkan salah penilaian, anda juga boleh membuat pertimbangan dengan merekodkan nilai dan masa pecutan terakhir.

3. Ringkasan

Melalui langkah di atas, kita boleh melaksanakan fungsi pemantauan gegaran dalam Uniapp. Walau bagaimanapun, perlu diingat bahawa oleh kerana penderia pecutan setiap telefon mudah alih adalah berbeza, adalah disyorkan untuk menguji dan mengoptimumkan apabila menggunakan fungsi ini untuk mencapai kesan penggunaan yang terbaik. Saya harap artikel ini dapat membantu semua orang.

Atas ialah kandungan terperinci Cara Uniapp memantau Shake. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan