当前位置:   article > 正文

【iOS ARKit】3D 视频

【iOS ARKit】3D 视频

      在AR 中播放视频也是一种常见的需求,如在一个展厅中放置的虚拟电视上播放宣传视频,或者在游戏中为营造氛围而设置的虚拟电视视频播放,或者在识别的2D个人名片上播放自我介绍视频,因视频具有静态图像无法比拟的综合信息展示能力,采用视频比单纯使用图像表达上更充分,本节我们将学习如何在AR场景中播放视频。

      在 AR场景中播放视频与在普通应用中播放视频有很多相同之处,但也有很多不一样的地方,在RealityKit 中播放视频,也同样使用 AVFoundation 流媒体框架,但需要将视频作为动态的纹理映射到虚拟物体表面,基本流程如图 11-4所示。

    使用 AVFoundation 流媒体框架播放视频使用到两个最基本的对象:AVPlayeritem 和AVPlayer。其中 AVPlayerItem 为流媒体资源管理对象,它负责管理视频的基本信息和状态,如视频长度、当前状态、缓存进度等,每一个 AVPlayerItem 对象对应一个视频资源;AVPlayer 为视频播放控制操作对象,控制视频的播放、暂停、还原等。

     在理解 RealityKit 播放视频的原理与流程后,就可以编写出视频播放代码,为更好地组织代码,新建一个 VideoPlayController 类管理视频播放相关代码,如下代码所示。

  1. //
  2. // VideoPlayController.swift
  3. // ARKitDeamo
  4. //
  5. // Created by zhaoquan du on 2024/3/22.
  6. //
  7. import AVFoundation
  8. import Foundation
  9. import RealityKit
  10. public class VideoPlayController {
  11. private var playing = false
  12. private var avPlayer: AVPlayer?
  13. private var avPlayerItem: AVPlayerItem?
  14. private var avPlayerLooper: AVPlayerLooper?
  15. private var videoMaterial: VideoMaterial?
  16. public var material: Material? { videoMaterial }
  17. private func createAVPlayer(_ named: String, withExtension ext: String) -> AVPlayer? {
  18. guard let url = Bundle.main.url(forResource: named, withExtension: ext) else {
  19. return nil
  20. }
  21. let avPlayer = AVPlayer(url: url)
  22. return avPlayer
  23. }
  24. private func createVideoPlayerItem(_ named: String, withExtension ext: String) -> AVPlayerItem? {
  25. guard let url = Bundle.main.url(forResource: named, withExtension: ext) else {
  26. return nil
  27. }
  28. let avPlayerItem = AVPlayerItem(asset: AVAsset(url: url))
  29. return avPlayerItem
  30. }
  31. init?(_ named: String, withExtension ext: String, useLooper: Bool = false) {
  32. playing = false
  33. let player: AVPlayer?
  34. if useLooper {
  35. let playerItem = createVideoPlayerItem(named, withExtension: ext)
  36. guard let avPlayerItem = playerItem else { return nil }
  37. let queuePlayer = AVQueuePlayer()
  38. avPlayerLooper = AVPlayerLooper(player: queuePlayer, templateItem: avPlayerItem)
  39. self.avPlayerItem = avPlayerItem
  40. player = queuePlayer
  41. } else {
  42. player = createAVPlayer(named, withExtension: ext)
  43. }
  44. avPlayer = player
  45. guard let avPlayer = player else { return nil }
  46. avPlayer.actionAtItemEnd = .pause
  47. avPlayer.pause()
  48. videoMaterial = VideoMaterial(avPlayer: avPlayer)
  49. videoMaterial?.controller.audioInputMode = .spatial
  50. //if(avPlayerItem?.status == AVPlayerItem.Status.readyToPlay){}
  51. NotificationCenter.default.addObserver(self, selector: #selector(VideoDidReachEndNotificationHandler(_:)), name: NSNotification.Name.AVPlayerItemDidPlayToEndTime, object: avPlayer.currentItem)
  52. }
  53. public func reset() {
  54. guard let avPlayer = self.avPlayer else { return }
  55. avPlayer.pause()
  56. avPlayer.seek(to: .zero)
  57. playing = false
  58. }
  59. public func sceneUpdate() {
  60. guard playing, let avPlayer = avPlayer else { return }
  61. if avPlayer.timeControlStatus == .paused {
  62. avPlayer.seek(to: .zero)
  63. avPlayer.play()
  64. }
  65. }
  66. public func enablePlayPause(_ enable: Bool) {
  67. playing = enable
  68. guard let avPlayer = self.avPlayer else { return }
  69. if playing, avPlayer.timeControlStatus == .paused {
  70. avPlayer.play()
  71. } else if !playing, avPlayer.timeControlStatus != .paused {
  72. avPlayer.pause()
  73. }
  74. }
  75. @objc func VideoDidReachEndNotificationHandler(_ notification:NSNotification){
  76. print("播放完了")
  77. }
  78. deinit {
  79. NotificationCenter.default.removeObserver(self)
  80. }
  81. }

     在代码中,首先根据是否需要循环播放可在构造函数中分别使用 AVPlayer 或者AVPlayerLooper 构建视频播放控制器,然后设置视频播放完毕后的状态,最后利用视频资源作为材质创建VideoMaterial 对象。除此之外,在代码中还新建了几个控制视频播放的方法以便调用。

    代码中设置了视频播放时音频的播放方式,RealityKit 在播放视频时允许其音频以几种不同的方式播放,音频播放方式由 AudioResource. InputMode 枚举描述,具体如下表所示。

枚举值

描述

nonSpatial

不考虑声源位置与方向,以背景音乐方式播放音频

spatial

3D音效,考虑声源的位置与方向

ambient

只考虑声源的方向,不考虑声源位置,声音音量不会出现随距离变化的特性

     在代码中,我们也对视频播放完毕事件进行了处理,需要注意的是,播放视频时的事件处理方式与 RealityKit 中其他事件处理方式有些不一样,播放视频的事件使用了 AVFoundation 中更一般的事件机制,具体支持事件及一般处理方法可参阅AVFoundation 相关资料。

注意⚠️视频播放完毕事件只有在视频以不循环播放类型播放时才会触发,另外,添加的事件监听应当在不需要时移除,如本例中在析构函数中移除。

     除了可以播放本地视频资源,AVFoundation 也支持通过 HTTP 或者 HTTPS播放网络流媒体资源,但需要注意的是,网络视频资源加载受网速、网络连接等因素影响,具有不确定性,在视频播放之前,务必先检查当前视频资源的可用性,如代码清单11-4中第49行的注释一样,以防止出现不可预知的问题(播放网络视频资源通常应当先缓冲,确保资源在播放前可用)。

     视频加载并转换成视频材质之后,就可以像普通材质一样使用,示例代码如下所示。

  1. //
  2. // Video3DView.swift
  3. // ARKitDeamo
  4. //
  5. // Created by zhaoquan du on 2024/3/26.
  6. //
  7. import SwiftUI
  8. import ARKit
  9. import RealityKit
  10. import Combine
  11. struct Video3DView: View {
  12. static var arView:ARView!
  13. var body: some View {
  14. Video3DViewContainer().overlay(
  15. VStack{
  16. Spacer()
  17. HStack{
  18. Button(action:{Video3DView.arView.playOrPause()}) {
  19. Text("播放/暂停")
  20. .frame(width:120,height:40)
  21. .font(.body)
  22. .foregroundColor(.black)
  23. .background(Color.white)
  24. .opacity(0.6)
  25. }
  26. .offset(y:-30)
  27. .padding(.bottom, 30)
  28. Button(action: {Video3DView.arView.reset()}) {
  29. Text("重播")
  30. .frame(width:120,height:40)
  31. .font(.body)
  32. .foregroundColor(.black)
  33. .background(Color.white)
  34. .opacity(0.6)
  35. }
  36. .offset(y:-30)
  37. .padding(.bottom, 30)
  38. }
  39. Spacer().frame(height: 40)
  40. }
  41. ).navigationTitle("3D视频").edgesIgnoringSafeArea(.all)
  42. }
  43. }
  44. var videoPlayController : VideoPlayController!
  45. struct Video3DViewContainer:UIViewRepresentable {
  46. func makeUIView(context: Context) -> some ARView {
  47. let arView = ARView(frame: .zero)
  48. let config = ARWorldTrackingConfiguration()
  49. config.planeDetection = .horizontal
  50. Video3DView.arView = arView
  51. arView.session.run(config)
  52. arView.createVideoPlane()
  53. return arView
  54. }
  55. func updateUIView(_ uiView: UIViewType, context: Context) {
  56. }
  57. }
  58. var play = false;
  59. extension ARView{
  60. func createVideoPlane(isLoop: Bool = false){
  61. videoPlayController = VideoPlayController("video2", withExtension: "mp4", useLooper:false)
  62. guard let vPlayController = videoPlayController,
  63. let planeMaterial = videoPlayController.material else {return}
  64. let planeAnchor = AnchorEntity(plane:.horizontal)
  65. let boxMesh = MeshResource.generatePlane(width: 0.2, height: 0.4, cornerRadius: 0)
  66. let boxEntity = ModelEntity(mesh: boxMesh,materials: [planeMaterial])
  67. boxEntity.generateCollisionShapes(recursive: false)
  68. planeAnchor.addChild(boxEntity)
  69. self.scene.addAnchor(planeAnchor)
  70. self.installGestures(.all,for:boxEntity)
  71. }
  72. func playOrPause(){
  73. play = !play
  74. videoPlayController.enablePlayPause(play)
  75. }
  76. func reset(){
  77. videoPlayController.reset()
  78. videoPlayController.enablePlayPause(true)
  79. }
  80. }

 RealityKit 播放视频的效果如下图所示。

   

图 11-5 在 RealityKit 中播放视频效果图     

     通过本节的学习,我们知道了在 RealityKit 中播放视频实际上是使用了动态纹理映射的方式,VideoMaterial 与其他所有的材质类型一样,可以使用到任何物体表面、平面、曲面上,由于目前 RealityKit并不支持Shader,所以我们可以使用视频材质作为替代方案实现诸如发光、闪烁、描边等特效,更简单地使用 VideoMaterial的代码如下所示。

  1. let planeAnchor = AnchorEntity(plane:. horizontal)
  2. let planeMesh = MeshResource. generatePlane(width: 0. 3, height: 0.2, cornerRadius:0)
  3. let asset = AVURIAsset (url: Bundle. main. url (forResource: "video",withExtension: "mp4")! )
  4. let playerItem = AVPlayerIten(asset:asset)
  5. let player = AVPlayer ( )
  6. let planeEntity = ModelEntity(mesh: planeMesh, materials: [VideoMaterial (aPlayer:player) ])
  7. player. replaceCurrentItem(with: playerItem)
  8. player. play()
  9. planeEntity. generateCollisionShapes(recursive: false)
  10. planeAnchor. addChild(planeEntity)
  11. self. scene. addAnchor (planeAnchor)

        在进行 AR 体验共享时,视频材质与其他材质一样,可以自动进行同步及播放,无须开发人员进行额外处理,在可播放视频格式类型方面,AVFoundation 支持的视频格式其都支持。

具体代码地址:GitHub - duzhaoquan/ARkitDemo

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/368187
推荐阅读
相关标签
  

闽ICP备14008679号