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

PlumCarefree2024-09-17 17:28

拖动前播放位置：

拖动后播放位置：

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

TS 复制代码

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（）函数

TS 复制代码

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