如何使swove揮動進度條？

Question

我是初學iOS開發人員，經常看到人們使用Heart Beat or Waves作爲進度條（即歌曲進度）的設計模式。有時這些progress bars go around the專輯藝術等

我該如何實現這樣的事情？我知道UISlider加上AVAudioPlayer，但找不到任何東西來實現，例如歌曲滑塊。

Answer 1

你可以做一個自定義的視圖，手動繪製垂直線。供參考的主要過程：

import UIKit 

class WavedProgressView: UIView { 

    var lineMargin:CGFloat = 2.0 
    var volumes:[CGFloat] = [0.5,0.3,0.2,0.6,0.4,0.5,0.8,0.6,0.4] 

    override init(frame: CGRect) { 
     super.init(frame: frame) 
     self.backgroundColor = UIColor.darkGray 
    } 

    required init?(coder aDecoder: NSCoder) { 
     super.init(coder: aDecoder) 
     self.backgroundColor = UIColor.darkGray 
    } 

    override var frame: CGRect { 
     didSet{ 
      self.drawVerticalLines() 
     } 
    } 

    var lineWidth:CGFloat = 3.0{ 
     didSet{ 
      self.drawVerticalLines() 
     } 
    } 

    func drawVerticalLines() { 
     let linePath = CGMutablePath() 
     for i in 0..<self.volumes.count { 
      let height = self.frame.height * volumes[i] 
      let y = (self.frame.height - height)/2.0 
      linePath.addRect(CGRect(x: lineMargin + (lineMargin + lineWidth) * CGFloat(i), y: y, width: lineWidth, height: height)) 
     } 

     let lineLayer = CAShapeLayer() 
     lineLayer.path = linePath 
     lineLayer.lineWidth = 0.5 
     lineLayer.strokeColor = UIColor.white.cgColor 
     lineLayer.fillColor = UIColor.white.cgColor 
     self.layer.sublayers?.removeAll() 
     self.layer.addSublayer(lineLayer) 
    } 
} 

的效果是：

並請自行更加完善，比如：在處理事件時，將默認並強調顏色等