【问题标题】:How to display progress of AVPlayer playback of audio如何显示AVPlayer播放音频的进度
【发布时间】:2017-08-08 22:05:21
【问题描述】:

我正在构建一个音乐应用程序,该应用程序将提供包含音乐文件 URL 的帖子供稿。当 UITableView 中的单元格变得完全可见时,相应音乐曲目的播放开始。 这是我现在的布局。

服务器正在生成波形,我将其数据作为 [Float] 类型的数组接收。 完整的波形是一个 UIView,它有一个条形子视图,其高度与服务器数组中相应项目的高度相同。

这是一个波形图源:

class WaveformPlot: UIView {


  override init(frame: CGRect) {
    super.init(frame: frame)
    
  }
  required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    

  }

  //MARK: Populate plot with data from server response
  
  func populateWithData(from dataSet: [Float]){
    
    DispatchQueue.main.async {
      
      var offset: CGFloat = 0
      
      for index in 0..<dataSet.count {
        
        let view = UIView(frame: CGRect(x: offset,
                                        y:   self.frame.height / 2,
                                        width: self.frame.width / CGFloat(dataSet.count),
                                        height: -(CGFloat)((dataSet[index]) / 3)))
        
        let view2 = UIView(frame: CGRect(x: offset,
                                        y:   self.frame.height / 2,
                                        width: self.frame.width / CGFloat(dataSet.count),
                                        height: (CGFloat)((dataSet[index]) / 3)))
        
        
        
        //Upper row of bars adjust
        view.backgroundColor = UIColor.orange
        view.layer.borderColor = UIColor.black.cgColor
        view.layer.borderWidth = 0.25
        view.clipsToBounds = true
        view.round(corners: [.topLeft, .topRight], radius: 2)
        
       
        
        //Lower row of bars adjust
        view2.backgroundColor = UIColor.orange
        view2.layer.borderColor = UIColor.black.cgColor
        view2.layer.borderWidth = 0.25
        view2.round(corners: [.bottomLeft, .bottomRight], radius: 2)
        view2.layer.opacity = 0.6
        self.addSubview(view)
        self.addSubview(view2)
        
        offset += self.frame.width / CGFloat(dataSet.count)
        
      }
      
      //Create gradient
      
      let gradientView = UIView(frame: CGRect(x: 0, y: self.frame.height / 2, width: self.frame.width, height: -self.frame.height / 2))
      let gradientLayer = CAGradientLayer()
      
      gradientLayer.frame = gradientView.bounds
      gradientLayer.colors = [UIColor.black.cgColor, UIColor.clear.cgColor]
      
      gradientView.layer.insertSublayer(gradientLayer, at: 0)
      gradientView.layer.opacity = 0.9
      
      self.addSubview(gradientView)
    }

  }
  
  func clearPlot(){
  
    for item in self.subviews{
      
      item.removeFromSuperview()
      
    }
  
  }
}

我实现的播放器的来源。

class StreamMusicPlayer: AVPlayer {
  private override init(){
    
    super.init()
    
  }
  
  static var currentItemURL: String?
  
  static var shared = AVPlayer()
  
  static func playItem(musicTrack: MusicTrack) {
    
    StreamMusicPlayer.shared = AVPlayer(url: musicTrack.trackURL)
    
    StreamMusicPlayer.currentItemURL = musicTrack.trackURL.absoluteString
    
    StreamMusicPlayer.shared.play()
    
    
    
  }
}

extension AVPlayer {
  
  var isPlaying: Bool {
    return rate != 0 && error == nil
  }
  
}

问题是需要在相应的单元格波形中显示当前正在播放的曲目的进度。

它必须类似于:

我应该选择什么方法?我不知道如何实现这一点。 任何帮助表示赞赏。

【问题讨论】:

    标签: ios objective-c swift uitableview ios10


    【解决方案1】:

    war4l 描述的方法是一种显示进度的方式。但要真正获得进度,您需要添加一个周期性时间观察器。像这样。

    let interval = CMTime(value: 1, timescale: 2)
    StreamMusicPlayer.shared.addPeriodicTimeObserver(forInterval: interval, queue: DispatchQueue.main, using: { (progressTime) in
    
         let seconds = CMTimeGetSeconds(progressTime)
    
         if let duration = self.StreamMusicPlayer.shared.currentItem?.duration {                   
    
             let totalDurationInSeconds = CMTimeGetSeconds(duration)
    
             // Now you have current time and the duration so can display this somehow                          
        }
    })
    

    【讨论】:

    • 谢谢,我会努力的。
    • 我已经研究了许多解决方案的变体,似乎我遗漏了一些东西。当帖子完全可见时,我开始播放。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-08-20
    • 2015-10-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多