Swift - AVPlayerLayer 视频进度条操作:在 TableViewCell 中实现视频播放和同步进度条
要在TableViewCell中放置视频和进度条,并确保视频播放进度与进度条同步,您可以按照以下步骤进行操作:\n\n1. 在TableViewCell的布局中,创建一个UIView作为容器来放置AVPlayerLayer,并设置它的frame为整个Cell的bounds。例如:\n\nswift\nlet playerContainerView = UIView(frame: contentView.bounds)\ncontentView.addSubview(playerContainerView)\n\n\n2. 创建AVPlayer对象和AVPlayerLayer对象,并将AVPlayerLayer添加到容器视图中。例如:\n\nswift\nlet player = AVPlayer(url: videoURL)\nlet playerLayer = AVPlayerLayer(player: player)\nplayerLayer.frame = playerContainerView.bounds\nplayerContainerView.layer.addSublayer(playerLayer)\n\n\n3. 创建一个UIProgressView作为进度条,并将其添加到cell的contentView中。设置进度条的frame和样式。例如:\n\nswift\nlet progressView = UIProgressView(progressViewStyle: .default)\nprogressView.frame = CGRect(x: 0, y: contentView.bounds.height - 20, width: 300, height: 20)\ncontentView.addSubview(progressView)\n\n\n4. 使用AVPlayer的addPeriodicTimeObserver方法监听视频播放进度的变化,并更新进度条的值。例如:\n\nswift\nlet interval = CMTime(seconds: 0.1, preferredTimescale: CMTimeScale(NSEC_PER_SEC))\nplayer.addPeriodicTimeObserver(forInterval: interval, queue: .main) { [weak self] time in\n let currentTime = CMTimeGetSeconds(time)\n let duration = CMTimeGetSeconds(player.currentItem?.duration ?? .zero)\n let progress = Float(currentTime / duration)\n progressView.setProgress(progress, animated: true)\n}\n\n\n5. 若要使进度条可拖动并与视频播放进度同步,需要为进度条添加一个UIPanGestureRecognizer,并在手势的回调方法中设置视频播放器的当前时间。例如:\n\nswift\nlet panGesture = UIPanGestureRecognizer(target: self, action: #selector(handlePanGesture(_:)))\nprogressView.addGestureRecognizer(panGesture)\n\n@objc func handlePanGesture(_ gesture: UIPanGestureRecognizer) {\n let position = gesture.location(in: progressView)\n let progress = Float(position.x / progressView.bounds.width)\n let duration = CMTimeGetSeconds(player.currentItem?.duration ?? .zero)\n let time = CMTime(seconds: Double(progress) * duration, preferredTimescale: CMTimeScale(NSEC_PER_SEC))\n player.seek(to: time)\n}\n\n\n这样,您就可以在TableViewCell中放置视频和进度条,并确保两者同步了。请根据您的需求进行适当的调整和优化。
原文地址: https://www.cveoy.top/t/topic/pSya 著作权归作者所有。请勿转载和采集!