HarmonyOS 用GSYVideoPlayer三方库实现了列表中的视频播放,目前需要滑动到屏幕中心的视频,自动播放

用GSYVideoPlayer三方库实现了列表中的视频播放,目前可以通过点击开始播放视频,需求是需要滑动到屏幕中心的视频,自动播放。目前难点在,ListItem组件内部,无法获取到自己滑动到屏幕中的位置,然后调用播放器开始播放的方法。

HarmonyOS
2024-10-11 12:22:26
1655浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
zbw_apple

获取ListItem相对于屏幕顶部的高度可以通过监听列表的滚动事件来实现。List组件提供了多种事件方法来监听列表的滚动,例如onScroll和onScrollIndex。通过这些事件,可以获取到列表的滑动偏移量或滑动位置索引值,进而计算出特定ListItem的相对位置。例如,使用onScrollIndex事件可以获取列表滑动时的起始和结束位置索引。结合ListItem的高度,您可以计算出任何ListItem相对于列表顶部或屏幕顶部的高度。您也可以直接获取List显示区域内中间位置子组件的索引值。如果需要更精确的位置信息,onScroll事件提供了滑动偏移量,可以用来计算当前可见ListItem的具体位置。

参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-list-V5#%E4%BA%8B%E4%BB%B6

api12中onScroll开始废弃不再使用,推荐使用onDidScroll事件替代:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-list-V5#ondidscroll12

import prompt from '@system.prompt';  
@Entry  
@Component  
struct MyComponent {  
  @State arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20];  
  build() {  
    Column() {  
      List({ space: 10 }) {  
        ForEach(this.arr, (item: number) => {  
          ListItem() {  
            Text(`${item}`)  
              .fontSize(16)  
              .fontColor(0x000000)  
              .backgroundColor(Color.Red)  
              .width('100%')  
              .height(200)  
          }  
        }, (item: number) => item.toString())  
      }  
      .onScrollIndex((firstIndex: number, lastIndex: number, centerIndex: number) => {  
        // 可以在这里计算特定ListItem的相对位置  
        console.log('centerIndex',centerIndex)  
        prompt.showToast({  
          message: `firstIndex: ${firstIndex}, lastIndex:${lastIndex}, centerIndex:${centerIndex}`  
        });  
      })  
      .onScroll((scrollOffset: number, scrollState: ScrollState) => {  
        // 使用scrollOffset来计算更精确的位置  
      })  
    }  
  }  
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
分享
微博
QQ
微信
回复
2024-10-11 17:10:15


相关问题
HarmonyOS 有没有成熟三方视频播放
1001浏览 • 1回复 待解决
HarmonyOS 列表视频滚动播放
1028浏览 • 1回复 待解决
HarmonyOS 视频列表播放问题
706浏览 • 1回复 待解决
HarmonyOS 列表视频全屏播放实现
1200浏览 • 1回复 待解决
HarmonyOS 需要视频小窗播放功能
836浏览 • 1回复 待解决
HarmonyOS 需要视频播放选型
924浏览 • 1回复 待解决
AVPlayer实现视频播放
2038浏览 • 1回复 待解决
HarmonyOS RN三方列表对应CAPI列表
1343浏览 • 1回复 待解决
HarmonyOS三方中心仓在哪里查询
724浏览 • 1回复 待解决
HarmonyOS 视频播放
886浏览 • 1回复 待解决
恭喜您,今日已阅读两篇内容,特奖励+2声望, 快来领取吧。