微信小程序实现手机振动效果
作者:Java Fans
一、微信官方文档资料
官方地址:https://developers.weixin.qq.com/miniprogram/dev/api/device/vibrate/wx.vibrateShort.html
1、wx.vibrateShort(Object object)
- 基础库 1.2.0 开始支持,低版本需做兼容处理。
- 以 Promise 风格 调用:支持
- 小程序插件:支持,需要小程序基础库版本不低于 1.9.6
功能描述:
使手机发生较短时间的振动(15 ms)。仅在 iPhone 7 / 7 Plus 以上及 Android 机型生效
参数:
属性 | 类型 | 默认值 | 必填 | 说明 | 最低版本 |
---|---|---|---|---|---|
type | string | 是 | 震动强度类型,有效值为:heavy、medium、light | 2.13.0 | |
success | function | 否 | 接口调用成功的回调函数 | ||
fail | function | 否 | 接口调用失败的回调函数 | ||
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
案例说明:
wxml代码
<button bindtap="vibrateShortTap">振动(15ms)</button>
js代码
vibrateShortTap: function () { // 使手机振动15ms wx.vibrateShort(); },
2、wx.vibrateLong(Object object)
- 基础库 1.2.0 开始支持,低版本需做兼容处理。
- 以 Promise 风格 调用:支持
- 小程序插件:支持,需要小程序基础库版本不低于 1.9.6
功能描述:
使手机发生较长时间的振动(400 ms)
参数:
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
案例说明:
wxml代码
<button bindtap="vibrateLongTap">振动(400ms)</button>
js代码
vibrateLongTap: function () { // 使手机振动400ms wx.vibrateLong(); },
二、手机振动应用场景(以 wx.vibrateLong() 方法为例)
1、如何实现一直震动?
要实现一直震动的效果,可以使用 wx.vibrateLong() 方法以一定的时间间隔重复调用自身来实现。
以下是一个示例代码,实现一直震动的效果:
function vibrateContinuously() { wx.vibrateLong({ success: function () { // 在成功回调中递归调用自身,以实现震动的连续效果 vibrateContinuously(); }, fail: function (err) { console.error('震动调用失败:', err); } }); } // 调用函数开始连续震动 vibrateContinuously();
在上述代码中,我们定义了一个名为 vibrateContinuously 的函数,在该函数中调用 wx.vibrateLong() 来触发长震动。在成功回调函数中,我们使用递归的方式再次调用 vibrateContinuously() 函数,从而实现连续震动的效果。
2、如何关闭连续震动?
要关闭连续震动,需要使用 wx.stopVibrate() 方法来停止当前正在进行的震动。以下是一个示例代码,用于关闭连续震动:
// 定义标记用于判断是否要停止震动 let shouldStopVibrating = false; function vibrateContinuously() { // 检查是否需要停止震动 if (shouldStopVibrating) { return; // 停止震动 } wx.vibrateLong({ success: function() { // 在成功回调中递归调用自身,以实现连续震动的效果 vibrateContinuously(); }, fail: function(err) { console.error('震动调用失败:', err); } }); } // 调用函数开始连续震动 vibrateContinuously(); // 通过设置 shouldStopVibrating 为 true 来停止震动 shouldStopVibrating = true; // 停止当前正在进行的震动 wx.stopVibrate();
在上述代码中,我们使用了一个名为 shouldStopVibrating 的标记变量,通过将其设置为 true 来停止震动。然后在递归函数 vibrateContinuously 中添加条件判断,如果 shouldStopVibrating 变量为 true,就直接退出函数,从而停止连续震动。最后,调用 wx.stopVibrate() 方法来停止当前正在进行的震动。
通过设置 shouldStopVibrating 变量为 true 可以立即停止震动,而调用 wx.stopVibrate() 方法可以停止正在进行的震动。根据你的具体需求,可以选择其中的一种或两种方式来关闭连续震动。
到此这篇关于微信小程序实现手机振动效果的文章就介绍到这了,更多相关小程序手机振动内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!