Wie mache ich einen waved Fortschrittsbalken in swift?

Question

Ich bin Anfänger IOS Entwickler und oft in Design-Muster, die Menschen Heart Beat or Waves als Progressionsbalken (d. H. Song Fortschritt) sehen. Manchmal sind diese progress bars go around the Album Art usw.

Wie kann ich so etwas erreichen? Ich bin mir bewusst, UISlider kombiniert mit AVAudioPlayer aber konnte nichts finden, wie zum Beispiel folgende für Song-Slider zu erreichen.

Answer 1

Sie können eine benutzerdefinierte Ansicht, machen und die vertikalen Linien von Hand zeichnen. Das Hauptverfahren als Referenz:

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) 
    } 
} 

Der Effekt ist:

Und bitte selbst es perfekt machen, wie: Ereignisverarbeitung, Standard Anwendung und hervorgehoben Farbe etc.