鸿蒙Cordova开发踩坑记录：震动反馈的“时差“

摘要：触觉反馈（Haptic Feedback）是提升游戏沉浸感的关键。Web 标准提供了 navigator.vibrate() API，但在鸿蒙 ArkWeb 上，这个 API 有时候会有几十毫秒的延迟，甚至在某些特定的震动模式下完全失效。本文介绍了如何绕过 Web 接口，直接调用鸿蒙原生震动服务，实现零延迟的"酥麻"体验。

📳 1. 绵软无力的 Web 震动

在 Web 端调用震动很简单：

javascript 复制代码

// 震动 200ms
navigator.vibrate(200);

但在实际体验中：

启动慢：从执行 JS 到马达真正转动，中间隔了 Browser -> IPC -> System Service 多层调用，延迟可感知的慢。
模式少：Web API 只能控制时长，无法控制强度（Amplitude）和频率。这导致所有震动感觉都像是在"嗡嗡嗡"，缺乏质感。

对于 2048 这种高频交互游戏，我们需要的是"短促有力"的反馈。

⚡ 2. 鸿蒙原生震动 (Vibrator)

HarmonyOS 提供了极其丰富的震动能力，特别是对于线性马达（Linear Motor）的支持。

我们可以在 ArkTS 侧封装一个能力接口。

2.1 Native 实现

在 GamePlugin.ets 中：

typescript 复制代码

import vibrator from '@ohos.vibrator';

// 预设震动模式
const HAPTIC_PATTERNS = {
    'light': { type: 'preset', effectId: 'haptic.clock.timer' }, // 轻微的咔哒声
    'medium': { type: 'preset', effectId: 'haptic.slide.tick' }, // 明显的段落感
    'heavy': { type: 'time', duration: 50 }, // 强烈的碰撞感
    'success': { type: 'preset', effectId: 'haptic.note.success' } // 成功的旋律震动
};

vibrate(args: any[]) {
    const type = args[0] || 'medium';
    
    try {
        if (HAPTIC_PATTERNS[type].type === 'preset') {
            // 调用系统预设效果（针对线性马达优化）
            vibrator.startVibration({
                type: 'preset',
                effectId: HAPTIC_PATTERNS[type].effectId,
                count: 1
            }, {
                usage: 'touch' // 场景：触控反馈
            });
        } else {
            // 传统时长震动
            vibrator.startVibration({
                type: 'time',
                duration: HAPTIC_PATTERNS[type].duration
            }, {
                usage: 'touch'
            });
        }
    } catch (e) {
        console.error("Vibrate failed", e);
    }
}

2.2 JS 侧封装

为了兼容性，我们做一个降级处理。如果 Native 接口不可用，回退到 Web API。

javascript 复制代码

class HapticEngine {
    vibrate(style) {
        // 优先调用 Native (零延迟，效果好)
        if (window.gameNative && window.gameNative.vibrate) {
            window.gameNative.vibrate(style);
            return;
        }

        // 降级到 Web API
        if (navigator.vibrate) {
            switch (style) {
                case 'light': navigator.vibrate(10); break;
                case 'medium': navigator.vibrate(30); break;
                case 'heavy': navigator.vibrate(50); break;
                case 'success': navigator.vibrate([50, 30, 50]); break;
            }
        }
    }
}

📊 3. 效果对比

指标	navigator.vibrate()	Native Vibrator
延迟	~80ms	< 10ms
手感	只有"震"和"停"	支持"锐利"、"柔和"、"弹跳"等质感
硬件利用	仅转子马达模式	完美驱动线性马达
功耗	较高	极低 (短震动)

📝 4. 经验总结

抛弃 Web API：在 Hybrid App 中，触觉反馈属于"系统级体验"，Web 标准的实现往往过于保守。
使用 Preset：鸿蒙系统预设了大量针对不同场景（闹钟、按键、滑轮）的震动波形，直接调用这些 Preset ID 比自己通过时长组合出来的效果要高级得多。
权限：记得在 module.json5 中声明 ohos.permission.VIBRATE 权限。

现在，每一次方块的合并，用户指尖都能感受到那清脆的"咔哒"声，爽快感倍增！