feat(弹幕组件): 优化顺序弹幕发送逻辑以支持多轨道同时填充
重构顺序弹幕发送逻辑,改为根据可用轨道数量同时填充弹幕 移除弹幕点击时的Toast提示以简化交互
Showing
1 changed file
with
45 additions
and
11 deletions
| ... | @@ -390,14 +390,48 @@ const initFullScreenDanmus = () => { | ... | @@ -390,14 +390,48 @@ const initFullScreenDanmus = () => { |
| 390 | // 当前弹幕索引,用于顺序显示 | 390 | // 当前弹幕索引,用于顺序显示 |
| 391 | let currentDanmuIndex = 0 | 391 | let currentDanmuIndex = 0 |
| 392 | 392 | ||
| 393 | -// 发送顺序弹幕 | 393 | +// 发送顺序弹幕 - 根据可用轨道数量同时填充弹幕 |
| 394 | const sendSequentialDanmu = () => { | 394 | const sendSequentialDanmu = () => { |
| 395 | - // 按顺序获取弹幕数据 | 395 | + // 获取所有可用的轨道 |
| 396 | - const danmuData = familyDanmus.value[currentDanmuIndex % familyDanmus.value.length] | 396 | + const availableTracks = tracks.filter(track => checkTrackSpace(track)) |
| 397 | - sendDanmu(danmuData) | 397 | + |
| 398 | + if (availableTracks.length === 0) { | ||
| 399 | + return // 没有可用轨道,直接返回 | ||
| 400 | + } | ||
| 401 | + | ||
| 402 | + // 为每个可用轨道同时发送一个弹幕 | ||
| 403 | + availableTracks.forEach(track => { | ||
| 404 | + // 按顺序获取弹幕数据 | ||
| 405 | + const danmuData = familyDanmus.value[currentDanmuIndex % familyDanmus.value.length] | ||
| 406 | + | ||
| 407 | + // 发送弹幕到指定轨道 | ||
| 408 | + sendDanmuToTrack(danmuData, track) | ||
| 409 | + | ||
| 410 | + // 更新索引,循环使用 | ||
| 411 | + currentDanmuIndex++ | ||
| 412 | + }) | ||
| 413 | +} | ||
| 414 | + | ||
| 415 | +// 发送弹幕到指定轨道 | ||
| 416 | +const sendDanmuToTrack = (danmuData, track) => { | ||
| 417 | + const danmu = { | ||
| 418 | + id: `danmu-${++danmuId.value}-${Date.now()}-${Math.random()}`, | ||
| 419 | + data: danmuData, | ||
| 420 | + x: 750, // 从右侧开始 | ||
| 421 | + duration: 0, | ||
| 422 | + isMoving: false, | ||
| 423 | + opacity: 1, | ||
| 424 | + startTime: Date.now() | ||
| 425 | + } | ||
| 426 | + | ||
| 427 | + // 添加到轨道 | ||
| 428 | + track.danmus.push(danmu) | ||
| 429 | + track.lastDanmuTime = Date.now() | ||
| 398 | 430 | ||
| 399 | - // 更新索引,循环使用 | 431 | + // 启动动画 |
| 400 | - currentDanmuIndex++ | 432 | + nextTick(() => { |
| 433 | + startDanmuAnimation(danmu, track) | ||
| 434 | + }) | ||
| 401 | } | 435 | } |
| 402 | 436 | ||
| 403 | // 自动发送弹幕 | 437 | // 自动发送弹幕 |
| ... | @@ -472,11 +506,11 @@ const clearDanmu = () => { | ... | @@ -472,11 +506,11 @@ const clearDanmu = () => { |
| 472 | const handleDanmuClick = (danmu) => { | 506 | const handleDanmuClick = (danmu) => { |
| 473 | emit('danmu-click', danmu.data) | 507 | emit('danmu-click', danmu.data) |
| 474 | 508 | ||
| 475 | - Taro.showToast({ | 509 | + // Taro.showToast({ |
| 476 | - title: `点击了${danmu.data.familyName}`, | 510 | + // title: `点击了${danmu.data.familyName}`, |
| 477 | - icon: 'none', | 511 | + // icon: 'none', |
| 478 | - duration: 2000 | 512 | + // duration: 2000 |
| 479 | - }) | 513 | + // }) |
| 480 | } | 514 | } |
| 481 | 515 | ||
| 482 | // 暴露方法给父组件 | 516 | // 暴露方法给父组件 | ... | ... |
-
Please register or login to post a comment