iOS SceneKit 在项目中加载 ` .dae .scn ` 文件及手势基本处理

写在前面:因为之前公司一直用的是Unity写的3D,通过Unity那边约定的接口进行与iOS这边信息传递,iOS这边只需要将Unity集成到项目中,通过接口通信就可以实现iOSUnity的交互,iOS客户端这边不用关心Unity 3D内部的场景渲染和动作执行的实现。iOS只需要告诉Unity加载的人物和动作就可以了。但是 在项目上线一段时间之后发现Unity启动之后项目就相当于(王者荣耀)游戏一样,性能、耗电让原本轻量的APP变得非常沉重,用户反馈手机发烫、耗电非常快、卡顿,体验非常不友好。公司决定拿掉Unity3D引擎,于是打算用苹果自带的3D引擎SceneKit或者将Unity中的所有动作导出MP4视频,于是我就研究了2天的ScenekKit,在这里记录一下

注意: 首先看一下最终效果,如果效果跟你想要的差不多,可以继续往下看,如果效果跟你想象的完全不一样,就没必要往下看了
SceneKitDemo.gif
  • SceneKit支持比较好的格式就两种 .scn.dae,另外 .obj也支持,只是兼容的不太好,贴图和动画需要你自己手动添加上去,这里不多介绍。而前两种格式SceneKit会自动识别贴图和动画,本篇文章重点介绍的的是.dae文件的渲染与加载
  • .dae文件又分为模特文件和骨骼动画文件两种,废话不多说,开始撸代码
第一步:创建一个空白的项目,导入 SceneKit
WeChat185ff22d9ae8cc70d54c82342db1e81d.png
第二步:导入3dsmax同学导出来的dae文件,Demo的dae文件是从一个叫Seven的健身APP内获取的
  • 注意:1、.dae文件和贴图要放在.scnassets文件夹里面,否则贴图并不会自动贴到模特身上,这样的模特看起来就是没穿衣服的样子,透明的或者是白色的纯色模型,大概就是下图这个样子
    nullmodel.png

    2、如果出现了这样的情况,你也可以手动将贴图指定到对应的节点上,如图:
    WeChat03a085909641cced345a2604da131848.png

    弊端:如果你的项目中只有一个模特,是可以这样手动指定贴图的,但是如果项目有n个模特,这样你会很痛苦
第三步:初始化场景
override func viewDidLoad() {
    super.viewDidLoad()
    //初始化场景
    let scenceView = SCNView(frame: CGRect(x: 14, y: kTopNavM, width: kWidth - 28.0, height: kWidth - 28.0))
    self.view.addSubview(scenceView)
    //开启可以手动控制相机(如果设置为true,你的模型在场景中可以360°旋转,可放大,可缩小)
    //scenceView.allowsCameraControl = true
    //是否显示调试的静态板
    scenceView.showsStatistics = true
    self.sceneView  = scenceView
}
  • scenceView.allowsCameraControl = true 开启相机控制(如果设置为true,你的模型在场景中可以360°旋转,可放大,可缩小),根据项目需求,一般项目中是不会用到的

  • scenceView.showsStatistics = true 调试板,是为了在debug下看数据使用的,release版本要关闭掉,调试板长这样如图:

    WeChat1a1087b0a3f1502fdd322685df9d66fd.png

第四步:加载模特文件.dae
/**
     *  加载模特模型文件
     */
    private func loadDaeFile() {
        //加载dae模型
        if let url = Bundle.main.url(forResource: "Female.scnassets/model", withExtension: "dae") {
            debugPrint("url == \(url)")
            let sceneSource = SCNSceneSource(url: url, options: [:])
            self.sceneView?.scene = sceneSource?.scene(options: [:])
            //根节点位置
            debugPrint("node postion:\(String(describing: self.sceneView?.scene?.rootNode.position)))")
            /**
             *  设置物体在场景中的位置 默认都是:SCNVector3(0, 0, 0)
             *  详解:position对应的:SCNVector3 三变量x: y: z:
             *  x:代表的是物体在场景中的左右位置
             *  y:代表的是物体在场景中的上下位置(例如:有地板为参照 如果y过大会导致人看起来飘在空中而非站在地板上)
             *  z:表示物体在场景中的远近,值越小 物体看起来越远 相对应的物体看起来也就越小
             *  因为 负数 < 零 < 正数,所以对"z"我这里用了“值越小”来解释
             */
            self.sceneView?.scene?.rootNode.position = SCNVector3(0, 0, -100)
            /**
             *  设置物体最大--最小变动范围
             *  boundingBox:控制物体在场景中 可活动的最小范围 和 最大范围
             */
//            self.sceneView?.scene?.rootNode.boundingBox = (SCNVector3(-39.04131, -6.751049, 66.61811), SCNVector3(35.55095, 56.60195, 204.2077))
            
            /**
             *  设置物体的缩放(带动画的)默认:SCNVector3(1.0, 1.0, 1.0)
             */
            self.sceneView?.scene?.rootNode.scale = SCNVector3(1.0, 1.0, 1.0)
            //添加手势
            let panGesture = UIPanGestureRecognizer(target: self, action: #selector(panGesture(_:)))
            self.sceneView?.addGestureRecognizer(panGesture)
            /*
            //看一下骨骼
            if let skeletonNode = sceneView?.scene?.rootNode {
                for item in skeletonNode.childNodes {
                    debugPrint("skinner:\(String(describing: item.skinner))")
                }
            }
            */
        }
    }
  • 在这里重点强调一下节点的.position属性,这个属性在苹果的官方文档上解释的非常粗,就一句话 /** @abstract Determines the receiver's position. Animatable.*/ 你说气人不,注释等于没说,我是一点一点试出来的,我放在代码中的注释中了,为了方便再贴出来 如下:

/**
* 设置物体在场景中的位置 默认都是:SCNVector3(0, 0, 0)
* 详解:position对应的:SCNVector3 三变量x: y: z:
* x:代表的是物体在场景中的左右位置
* y:代表的是物体在场景中的上下位置(例如:有地板为参照 如果y过大会导致人看起来飘在空中而非站在地板上)
* z:表示物体在场景中的远近,值越小 物体看起来越远 相对应的物体看起来也就越小
* 因为 负数 < 零 < 正数,所以对"z"我这里用了“值越小”来解释
*/
self.sceneView?.scene?.rootNode.position = SCNVector3(0, 0, -100)

第五步:根据路径加载骨骼动画.dae文件
private func loadAnimation(filePath: String) {
        //如果动作不需要椅子节点,移除椅子节点
        self.chairNode?.removeFromParentNode()
        //移除上个动作的动作组
        self.sceneView?.scene?.rootNode.removeAnimation(forKey: kAnimationKey)
        var animationGroups: [CAAnimation] = []
        //加载dae模型
        if let url = Bundle.main.url(forResource: filePath, withExtension: "dae") {
            //debugPrint("url1 == \(url)")
            //获取SceneSource
            let sceneSource = SCNSceneSource(url: url, options: [:])
            /**
            *  获取SceneSource中某种类型的所有对象 或者 对象数组
            *  这里我获取的是动画对象(CAAnimation)
            *  这里可以获取的类型有(SCNMaterial, SCNScene, SCNGeometry, SCNNode, CAAnimation, SCNLight, SCNCamera, SCNSkinner, SCNMorpher, NSImage)
            */
            let animationIDs = sceneSource?.identifiersOfEntries(withClass: CAAnimation.self)
            //debugPrint("animationIDs1:\(String(describing: animationIDs))")
            var maxDuration: CFTimeInterval = 0.0
            //遍历拿到的动画组所有动画,装到一个数组中
            if let animations = animationIDs {
                for item in animations {
                    //debugPrint("animation1:\(item)")
                    if let ani = sceneSource?.entryWithIdentifier(item, withClass: CAAnimation.self) {
                        maxDuration = max(maxDuration, ani.duration)
                        animationGroups.append(ani)
                    }
                }
            }
            /*
            //如果模型的骨骼结构是不一致的,可以考虑使用replaceChildNode方法找到对应的骨骼节点来替换
            if let rootNode = self.sceneView?.scene?.rootNode, let newNode = sceneSource?.scene(options: [:])?.rootNode {
                rootNode.replaceChildNode(rootNode, with: newNode)
            }
            */
            //将获取的所有的动画 -> 创建动画组
            let group = CAAnimationGroup()
            group.animations = animationGroups
            group.duration = maxDuration
            group.repeatCount = MAXFLOAT
            group.autoreverses = true
            //将动画组添加到节点上
            self.sceneView?.scene?.rootNode.addAnimation(group, forKey: kAnimationKey)
            //看一下骨骼
            if let skeletonNode = sceneView?.scene?.rootNode {
                for item in skeletonNode.childNodes {
                    debugPrint("skinner:\(String(describing: item.skinner))")
                }
            }
        }
    }
  • 在这里说一下 SCNSceneSource这个类

主要用于管理场景文件的读取任务,也可以读取NSData对象, 你懂了吧,如果这个模型,我们从服务器加载就需要使用这个类,并且通过这个类可以获取到场景某种类型的对象或者对象数组。类型有:SCNMaterial, SCNScene, SCNGeometry, SCNNode, CAAnimation, SCNLight, SCNCamera,SCNSkinner, SCNMorpher, NSImage,我这里只使用到了CAAnimation

  • 拿到动画数组,初始化一个动画组,将动画组加载到场景的对应节点上,这样模特就可以做动画了
  • 如果模特就一个,如何做不同的骨骼动画呢,如果模型是两个要同时显示在场景中,该如何做呢

1、模特场景中再添加一个椅子场景,只需要将椅子场景文件的对应节点作为childNode添加到另一个场景中。通过修改position配合使用
2、如果模特是同一个但是骨骼模型却是不同的,可以通过rootNode?.childNode(withName: "骨骼节点的ID", recursively: true)拿到对应的节点。那么你就要找到各个.dae文件中的骨骼通过调用replaceChildNode( SCNNode , with: SCNNode)去替换原来的骨骼 然后再去加载动画。

文章到这里关于SceneKit的使用部分算是结束了,但是文中写到了如何根据项目需求自定义手势(项目要求:只可以通过手势左右旋转,不可以上下旋转,不可以缩放大小)处理手势如下:
@objc func panGesture(_ pan: UIPanGestureRecognizer) {
    guard let panView = pan.view else { return }
    //转换的位置
    let translation = pan.translation(in: panView)
    //左右方向的比例
    let widthRatio = Float(translation.x) / Float(panView.frame.size.width) + lastWidthRatio
    //上下方向的比例
    let heightRatio = Float(translation.y) / Float(panView.frame.size.height) + lastHeightRatio
    //左右旋转
    self.sceneView?.scene?.rootNode.eulerAngles.y = Float(2 * Double.pi) * widthRatio
    //上下旋转
    //self.scenceView?.scene?.rootNode.eulerAngles.x = Float(-Double.pi) * heightRatio
    if (pan.state == .ended) {
        lastWidthRatio = widthRatio
        lastHeightRatio = heightRatio
    }
}

代码放在了网盘,不要问我为啥不放在git上
链接: https://pan.baidu.com/s/1FQwos0WlI7Z6VQ9zUR8gnQ 提取码: vdgu

  • 写在最后,公司最终还是决定使用MP4文件,但是我看SceneKit的一些收获以文章的形势记录一下,希望相互交流学习,有不正确的地方还请指正。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 162,050评论 4 370
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 68,538评论 1 306
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 111,673评论 0 254
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,622评论 0 218
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 53,047评论 3 295
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,974评论 1 224
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 32,129评论 2 317
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,893评论 0 209
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,654评论 1 250
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,828评论 2 254
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,297评论 1 265
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,619评论 3 262
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,326评论 3 243
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,176评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,975评论 0 201
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 36,118评论 2 285
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,909评论 2 278

推荐阅读更多精彩内容