基于鸿蒙API10的RTSP播放器(五：拖动底部视频滑轨实现跳转）

PlumCarefree

已于 2024-09-13 16:35:22 修改

阅读量173

点赞数 2

分类专栏：鸿蒙实战：RTSP播放器文章标签：音视频 ffmpeg 华为

于 2024-09-13 16:21:08 首次发布

本文链接：https://blog.csdn.net/MuZiChunChun/article/details/142213924

版权

鸿蒙实战：RTSP播放器专栏收录该内容

8 篇文章 0 订阅

订阅专栏

拖动前播放位置：
在这里插入图片描述

拖动后播放位置：

在这里插入图片描述

在Slider组件中，添加onChange方法进行监听，当视频轨道拖放结束时，触发this.seekTo()函数，其中seekTo函数需要传递一个视频已播放时长作为参数

Slider({  
  value: this.progressValue,  
  min: 0,  
  max: 100,  
  step: 1,  
  style: SliderStyle.OutSet  
})  
  .height('20px')  
  .width('650px')  
  .blockColor($r('app.color.slider_block_color'))  
  .trackColor($r('app.color.slider_track_color'))  
  .selectedColor($r('app.color.slider_selected_color'))  
  .showSteps(true)  
  .showTips(true)  
.enabled(this.sliderEnable)  
.onChange((value: number, mode: SliderChangeMode) => {  
  LogUtils.getInstance().LOGI("plumcarefree slider-->onChangeStart:" + value);  
  // 状态值为2时，标志手势离开滑块  
  if (mode == SliderChangeMode.End) {  
    // 获取滑块位置  
    let seekValue = value * (mIjkMediaPlayer.getDuration() / 100);  
    // 设置视频位置  
    this.seekTo(seekValue.toString());  
  }  
  LogUtils.getInstance().LOGI("plumcarefree slider-->onChangestartEnd:" + value);  
})

编写seekTo（）函数，可以按照自己需求添加一些额外的逻辑。核心函数是继续调用底层的seekTo（）函数

seekTo(value: string) {  
  // if (mIjkMediaPlayer.isPlaying()) {  
  //   mIjkMediaPlayer.pause();  // 先暂停视频  
  // }  
  mIjkMediaPlayer.seekTo(value);  
  
  // 延迟执行reset和seek操作，确保资源释放完毕  
  // setTimeout(() => {  
  //   mIjkMediaPlayer.stop();  //   mIjkMediaPlayer.reset();  //   // 设置新位置并重新播放  
  //   mIjkMediaPlayer.seekTo(value);  
  //   mIjkMediaPlayer.start();  // }, 100);
  }