ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

bullet-screen-cj弹幕点击交互教程:如何精准命中任意一条弹幕

bullet-screen-cj弹幕点击交互教程:如何精准命中任意一条弹幕 bullet-screen-cj弹幕点击交互教程如何精准命中任意一条弹幕【免费下载链接】bullet-screen-cj弹幕发送、解析与绘制库项目地址: https://gitcode.com/Cangjie-TPC/bullet-screen-cj在视频播放器里点中一条飞过的弹幕弹出评论卡片、屏蔽作者、点赞加一——这套体验在 OpenHarmony 应用里怎么实现本教程基于开源弹幕库bullet-screen-cj一款支持发送、解析与绘制弹幕的仓颉弹幕框架带你从零理解「弹幕点击命中」的完整原理并手把手完成弹幕点击交互的开发精准命中屏幕上任意一条正在滚动的弹幕。一、为什么命中一条弹幕不是一件简单的事![这里不放图]弹幕和按钮不一样位置是动态的一条滚动弹幕的坐标每一帧都在变化弹幕是重叠的同一时刻屏幕上可能有几十条弹幕点击位置可能同时压在多条上交互要分层点中了弹幕是一回事点到空白处又是另一回事。所以「点击命中」需要的是一套完整的机制坐标捕获 → 区域相交检测 → 命中结果分发。bullet-screen-cj 已经把这套机制封装好了你只需要理解原理、接上监听器即可。核心实现都在弹幕库源码目录中触摸与命中判定ui_widget_danmaku_touch_helper.cj点击监听接口定义controller_i_danmaku_view.cjAPI 说明文档feature_api.md二、精准命中的原理从手指到弹幕的 3 步第 1 步区分「单击」还是「长按」触摸事件首先交给GestureDetector处理见 ui_widget_danmaku_touch_helper.cj#L96-L157手指按下Down时记录时间戳手指抬起Up时计算按压时长小于 600 毫秒判定为单击触发onDanmakuClick大于等于 600 毫秒判定为长按触发onDanmakuLongClick。这也是为什么你的长按回调有时不触发——手太快了被识别成了单击。⏱️第 2 步矩形相交检测精准命中的核心单击确认后touchHitDanmaku方法开始工作见 ui_widget_danmaku_touch_helper.cj#L71-L93通过getCurrentVisibleDanmakus()拿到当前屏幕上所有可见弹幕遍历每一条弹幕用它自己的left / top / right / bottom四个坐标构建一个RectF矩形判断该矩形是否与点击坐标相交intersect相交即命中命中的弹幕全部加入返回列表——注意同坐标可能压着多条弹幕它们会一起返回。这就是精准命中的数学本质点落在哪个弹幕的包围矩形里哪个弹幕就被命中层层叠加时全部返回保证不会漏判。第 3 步事件分发谁消费了这次点击命中结果按优先级分发见 ui_widget_danmaku_touch_helper.cj#L134-L144顺序场景回调①点中了至少一条弹幕onDanmakuClick(danmakus)②①返回false未处理onViewClick(view)③点到空白区域没命中任何弹幕onViewClick(view)回调返回true表示我处理完了事件到此为止返回false则事件会继续向下流转最终落到onViewClick。✅三、三步开启弹幕点击交互实战完整可运行示例见示例工程my_view.cj。第 1 步实现 OnDanmakuClickListener 监听器接口 controller_i_danmaku_view.cj#L120-L131 只要求实现 3 个方法class OnDanMu : OnDanmakuClickListener { public func onDanmakuClick(danmakus: IDanmakus): Bool { // danmakus.last() 即本次点中的那条弹幕 return danmakus.last().isSome() } public func onDanmakuLongClick(danmakus: IDanmakus): Bool { return false } public func onViewClick(view: IDanmakuView): Bool { return false } }在onDanmakuClick里就能拿到被命中的弹幕对象可以读取它的文本、颜色、优先级等任意属性做你需要的业务逻辑展示卡片、上报埋点等。第 2 步把监听器绑定到弹幕组件在prepare弹幕组件准备之前调用一次setOnDanmakuClickListener示例位置见 my_view.cj#L96-L97this.model.setOnDanmakuClickListener(OnDanMu(this)) this.model.prepare(this.mParser.getOrThrow(), this.mContext)第 3 步发送弹幕开始点击弹幕通过model.addDanmaku(danmaku)发送并上屏后用户点击任意一条onDanmakuClick就会带着命中结果被回调。至此「点中飞过的弹幕」能力已经就绪。四、命中小字弹幕不灵敏用 xOff / yOff 放大点击热区小字号弹幕的可点区域很小手指容易打空。bullet-screen-cj 提供了带偏移参数的重载方法可以在命中检测时把点击点向四周扩出 xOff / yOff 的距离等效于放大热区接口见 controller_i_danmaku_view.cj#L109this.model.setOnDanmakuClickListener(listener, 20.0, 20.0)配合第 2 步的矩形相交逻辑等于给每条弹幕套了一圈宽松判定框点击体验更跟手。 数值不用太大10~30 的像素范围通常就足够。五、常见问题 FAQQ1长按回调不触发检查按压时长是否达到600 毫秒不足则会被判定为单击见 GestureDetector 的TIME_LONG_PRESS常量。Q2为什么回调里传进来的是一个列表而不是单条弹幕同一坐标可能同时压住多层弹幕全部命中项都会返回danmakus.last()是最新最上层的那条最常用。Q3返回 false 会怎样当前回调不消费事件框架会继续尝试后续分发最终触发onViewClick可用于点击空白处隐藏弹幕层这类兜底逻辑。Q4命中检测发生在什么线程触摸事件在主线程处理遍历的是屏幕当前可见弹幕量级很小不会造成卡顿。写在最后掌握「矩形相交检测 600ms 单击/长按判定 三级事件分发」这三点你就完全理解了 bullet-screen-cj 弹幕点击交互的底层机制。接下来只需三步接线——实现监听器、setOnDanmakuClickListener绑定、回调中取danmakus.last()——就能让应用里的弹幕真正可点、可点中、可精准点中。 延伸阅读点击监听接口controller_i_danmaku_view.cj触摸辅助类源码ui_widget_danmaku_touch_helper.cj视图模型绑定实现ui_widget_danmaku_view_model.cj#L350-L376完整功能 APIfeature_api.md示例工程入口index.cj【免费下载链接】bullet-screen-cj弹幕发送、解析与绘制库项目地址: https://gitcode.com/Cangjie-TPC/bullet-screen-cj创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表