基于鸿蒙API10的RTSP播放器(二：视频切换实现)

目标：

设置一个播放下一个视频的按钮，通过改变url地址实现 ✔
设置一个视频播放底部轨道，轨道左侧固定为00:00，右侧为当前已经播放的时长差✖
设置音量调节按钮，再实现滑动增减音量发✖

ts 复制代码

// 这里为ArkTS代码，标记为ts只是为了上色好看。注意代码放置位置

// 1.播放位置状态变量，在结构体之外
let  locationIndex:number = 0 ;

// 2.设置url组，苹果测试地址，最快  

@State private playerURL: string = "http://devimages.apple.com/iphone/samples/bipbop/gear3/prog_index.m3u8";  
  
@State private playerURLs:string[] = [  
  // 苹果测试地址，3s  
  "http://devimages.apple.com/iphone/samples/bipbop/bipbopall.m3u8",  
  // 苹果测试地址，1s  
 'http://devimages.apple.com/iphone/samples/bipbop/gear3/prog_index.m3u8',  
  // 苹果测试,4s  
  "http://devimages.apple.com.edgekey.net/streaming/examples/bipbop_4x3/bipbop_4x3_variant.m3u8",  
  // BBC测试  
  "https://vs-dash-ww-rd-live.akamaized.net/pl/testcard2020/avc-mobile.m3u8",  
  // 苹果测试  
  "http://devimages.apple.com.edgekey.net/streaming/examples/bipbop_4x3/bipbop_4x3_variant.m3u8",  
  // 远程湖面监控  
  "rtsp://stream.strba.sk:1935/strba/VYHLAD_JAZERO.stream",  
  // BBC测试  
  "https://vs-dash-ww-rd-live.akamaized.net/pl/testcard2020/avc-mobile.m3u8",  
  // 海边沙滩监控  
  "rtsp://37.157.51.30/axis-media/media.amp",  
  // BBC测试  
  "https://vs-dash-ww-rd-live.akamaized.net/pl/testcard2020/avc-mobile.m3u8",  
  // 灯光闪烁监控  
  // "rtsp://77.110.228.219/axis-media/media.amp",  
  // BBC测试  
  "https://vs-dash-ww-rd-live.akamaized.net/pl/testcard2020/avc-mobile.m3u8",  
  // 观测站监控  
  "rtsp://196.21.92.82/axis-media/media.amp",  
]

//3.设置改变位置变量函数，通过改变url地址播放下一个视频  
nextPlayer() {  
  // 循环条件  
  if (locationIndex == this.playerURLs.length - 1) {  
    locationIndex = 0;  
  } else {  
    locationIndex++;  
  }  
  // 停止播放  
  mIjkMediaPlayer.stop();  
  mIjkMediaPlayer.reset();  
  this.playerURL = this.playerURLs[locationIndex]  
  this.play(this.playerURL);  
}

//4.在build（）函数中通过按钮调用nextPlayer()方法
Button('Next')  
  .width('200px')  
  .onClick(() => {  
    this.nextPlayer();  
  })