javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > 小程序手机振动

微信小程序实现手机振动效果

作者:Java Fans

这篇文章主要介绍了微信小程序实现手机振动效果,手机振动应用场景以 wx.vibrateLong() 方法为例结合实例代码给大家详细讲解,需要的朋友可以参考下

一、微信官方文档资料

官方地址:https://developers.weixin.qq.com/miniprogram/dev/api/device/vibrate/wx.vibrateShort.html

1、wx.vibrateShort(Object object)

功能描述:

使手机发生较短时间的振动(15 ms)。仅在 iPhone 7 / 7 Plus 以上及 Android 机型生效

参数:

属性类型默认值必填说明最低版本
typestring震动强度类型,有效值为:heavy、medium、light2.13.0
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数
completefunction接口调用结束的回调函数(调用成功、失败都会执行)

案例说明:

wxml代码

<button bindtap="vibrateShortTap">振动(15ms)</button>

js代码

vibrateShortTap: function () {
    // 使手机振动15ms
    wx.vibrateShort();
  },

2、wx.vibrateLong(Object object)

功能描述:

使手机发生较长时间的振动(400 ms)

参数:

属性类型默认值必填说明
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数
completefunction接口调用结束的回调函数(调用成功、失败都会执行)

案例说明:

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() 方法可以停止正在进行的震动。根据你的具体需求,可以选择其中的一种或两种方式来关闭连续震动。

到此这篇关于微信小程序实现手机振动效果的文章就介绍到这了,更多相关小程序手机振动内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

阅读全文