创建Waves可视化视频Swift

问题描述

这是我想要做的:

Screen Shot

屏幕截图来自6s iPhone。

Screen Shot

我一直在从中创建视频wave,我想绘制一个看起来像第一个屏幕截图的波形。我正在使用VIWaveformView Github吊舱绘制波浪。但是我很困惑如何画同样的波浪。

代码

@IBOutlet weak var vWmainWave: VIWaveformView!
override func viewDidLoad() {
    super.viewDidLoad()
    vWmainWave.waveformNodeViewProvider = BasicWaveFormNodeProvider(generator: { () -> NodePresentation in
        let view = VIWaveformNodeView()
        view.waveformlayer.strokeColor = UIColor(red:0.86,green:0.35,blue:0.62,alpha:1.00).cgColor
        return view
    }())
    vWmainWave.layoutIfNeeded()
    if let url = Bundle.main.url(forResource: "bulletTrain",withExtension: "mp4") {
        let asset = AVAsset.init(url: url)
        _ = vWmainWave.loadVoice(from: asset,completion: { (asset) in
        })
    }
}

问题:如何显示与原始图像相同的波形(第一个屏幕截图)?

有人可以向我解释如何绘制相同的波形,我已经尝试绘制了这些波形,但没有结果。

任何帮助将不胜感激。

谢谢。

解决方法

您可以检查这部分

var waveformView: VIWaveformView!
override func viewDidLoad() {
        super.viewDidLoad()
        
        
        view.backgroundColor = UIColor(red:0.10,green:0.14,blue:0.29,alpha:1.00)
        
        setupWaveformView()
        view.addSubview(waveformView)
        
        waveformView.translatesAutoresizingMaskIntoConstraints = false
        waveformView.leftAnchor.constraint(equalTo: view.leftAnchor,constant: 15).isActive = true
        waveformView.rightAnchor.constraint(equalTo: view.rightAnchor,constant: -15).isActive = true
        waveformView.topAnchor.constraint(equalTo: view.topAnchor,constant: 65).isActive = true
        waveformView.heightAnchor.constraint(equalToConstant: 80).isActive = true
        
        waveformView.layoutIfNeeded()
        if let url = Bundle.main.url(forResource: "Moon River",withExtension: "mp3") {
            let asset = AVAsset.init(url: url)
            _ = waveformView.loadVoice(from: asset,completion: { (asset) in
            })
        }
}

https://github.com/VideoFlint/VIWaveformView/blob/master/VIWaveformView/ViewController.swift