上墙弹幕需用cover-view+canvas(小程序)或subNVue(App),禁用videoContext.sendDanmu;摇一摇须调uni.startAccelerometer、配权限、用加速度变化率滤波、复用音频上下文并监听onCanPlay。

上墙弹幕和摇一摇抽奖在 uni-app 里是两类完全独立的技术问题:前者卡在 video 组件的原生置顶限制,后者卡在传感器启动链路与抖动判定逻辑。两者都**不能靠“写了就跑”糊弄过去**,真机调试时 90% 的失败源于权限、生命周期或平台误用。
video 上墙弹幕为什么总被盖住?不是 z-index 不够高,是它根本无效
uni-app 的 video 在 App 和小程序端是原生渲染组件,默认强制置顶,z-index、transform、opacity 全部失效——这不是 bug,是设计如此。
- 微信/支付宝小程序必须用
cover-view+canvas组合:外层cover-view容器设宽高 100%,内嵌canvas渲染文字;cover-image可用于头像等固定元素,但不支持动态文本 - App 端优先走
subNVue:pages.json 中对应页面需配置"position": "absolute"和"zIndex": 100,且指向一个独立的.nvue文件;该文件内 canvas 渲染不受 Vue 页面样式干扰,天然高于video - 别用
videoContext.sendDanmu:这个 API 在 mp-weixin 平台静默失败,调了等于没调;H5 和 App 端可用,但跨平台项目必须加平台判断:uni.getSystemInfoSync().platform !== 'mp-weixin' - 弹幕卡顿主因是实时计算:每帧调
ctx.fillText()在安卓低端机直接掉帧;改用ctx.drawImage()预渲染文字贴图,轨迹点提前生成数组(如正弦抖动路径),运行时只查表
摇一摇抽奖触发不了?先看 uni.startAccelerometer 调了没
uni.onAccelerometerChange 是监听函数,但**不调 uni.startAccelerometer() 就永远收不到数据**——这是最常漏掉的一步,连 iOS 权限都配对了也白搭。
- iOS 真机必须在
manifest.json→ App SDK 配置 → 「运动与健身」权限勾选,否则静默失败,无任何错误提示 - Android(尤其 MIUI/HarmonyOS)冷启动时调
uni.startAccelerometer()易被拦截;应放在onShow或用户点击按钮后触发,而非onLoad或onLaunch - 别用单轴绝对值判断:
Math.abs(res.x) > 30在华为 Mate 60、iPhone 15 Pro 上误触率超 70%;正确做法是算加速度变化率(jerk):缓存最近 4 帧的合加速度acc = Math.sqrt(x*x + y*y + z*z),再算差值平方和dx*dx + dy*dy + dz*dz,连续 2 帧 > 20 才记为一次抖动 - 累计 3 次有效抖动再触发抽奖,配合
isShaking = true+setTimeout(() => { isShaking = false }, 1500)防连续弹窗;别用clearTimeout动态重置,摇动持续时间不可控
摇一摇反馈音播放不了?音频上下文没就绪,不是权限问题
创建 uni.createInnerAudioContext() 后直接 play(),iOS 上大概率静音——因为音频上下文未激活,需用户手势触发后才可播放。
- 音频实例必须复用,不要每次摇都新建;提前创建并设
audioContext.autoplay = true、audioContext.loop = false - 播放前必须等
onCanPlay回调,否则安卓部分机型会报错或无声;可加兜底:setTimeout(() => audioContext.play(), 100),但延迟别超 200ms - 安卓部分机型需振动权限支持,在
manifest.json补"scope.vibrate": {"desc": "用于摇一摇反馈"} - 页面跳转或隐藏后还在响?说明没注销监听:必须在
onHide或onUnload中调uni.offAccelerometerChange(handle),且回调函数引用要一致(推荐写法:const handle = res => { ... })
真正难的不是写代码,而是把传感器启动、抖动滤波、弹幕层级、音频上下文这四条链路全串通——任一环断开,功能就残缺。真机调试时,优先确认 manifest 权限、onShow 触发时机、canvas 是否预渲染、音频是否等了 onCanPlay,比反复调阈值更省时间。


















