文档章节

ARKit 从零到一:教你编写 AR 立方体

秦无炎
 秦无炎
发布于 2017/07/11 10:10
字数 1524
阅读 46
收藏 0
点赞 0
评论 0

本文将会使用 ARKit 创建一个相当简单的 hello world AR app,结束时就可以在增强世界里放置 3D 立方体,并且可以用 iOS 设备绕着它移动。

要渲染 ARKit 中的 3D 内容,我会使用 SceneKit:https://developer.apple.com/scenekit/这是在 iOS 设备上渲染 3D 图形的框架。如果了解基础的 3D 概念,这玩意儿就相当简单了。

如果等不及看到文章最后,这是 app 的录屏。可以看到用 ARKit 可以在真实世界中放置虚拟物体,并且在移动摄像头时,这个物体会固定在空间中。

虽然这是一个非常简单的 app,我们在后面的文章中继续为其编写更多功能,包括几何检测、3D 物理和很多好玩的东西。

视频

准备

ARKit 目前仅支持 A9/A10 处理器的 iOS 设备。表示你需要一台 iPhone 6s 或以上的设备,当然也可以是 iPad 2017 款或以上的设备。

软件则需要安装:

这样就准备就绪了。

创建项目

首先打开 Xcode,选择 ARKit 项目模板:

Xcode 9 Beta - 新建项目模板选择器

填上项目信息,确保 Content Technology 选项选择了 “SceneKit”。默认可能是 “SpriteKit”,这是用来做 2D 渲染的,我们需要的是 “SceneKit”,这才是用于 3D 渲染的。

在你的设备上运行项目,如果没有异常的话应该能看见实时摄像头视频,还有一架飞机的 3D 模型,这个模型被放置在了物理空间中。

来回移动,看看飞机是如何固定在真实世界中的:

这个初始项目中的例子其实比马上要创建的项目更高级,但重点是学习如何从头编写 ARKit 项目,所以打开项目,移除 viewDidLoad 方法中所有的代码(除了 super 调用的那句)。

ARKit 核心类

ARSCNView——这是一个助手类,帮我们用 SceneKit 渲染的 3D 内容来增强实时摄像头视图。这个类做了下面几件事:

  • 在视图中渲染设备摄像头的实时视频流,并就其设置为 3D 场景的背景
  • ARKit 的 3D 坐标系会匹配 SceneKit 的 3D 坐标系,所以此视图渲染的对象会自动匹配增强后的 ARKit 世界视图
  • 自动移动虚拟 SceneKit 3D 摄像头来匹配 ARKit 追踪到的 3D 位置,所以不需要再写代码连接 ARKit 移动事件与 SceneKit 3D 渲染。

ARSession——每个增强现实会话都都需要有一个 ARSession 实例。它负责控制摄像头、聚合所有来自设备的传感器数据等等以构建无缝体验。ARSCNView 实例已经有 ARSession 实例,只需要在开始的时候配置一下。

ARWorldTrackingSessionConfiguration——这个类会告诉 ARSession,在真实世界中追踪用户时需要使用六个自由度,roll、pitch、yaw 以及 X轴、Y轴、Z轴上的变换。如果不用这个类,就只能创建在同一个点旋转查看增强内容的 AR 体验。有了这个类,就可以在 3D 空间里绕着物体移动了。如果你不需要在 X轴、Y轴、Z轴上的变换,用户就会在投影增强内容时保持在固定位置,这时可以用 ARSessionConfiguration 类替代此类来初始化 ARSession 实例。

本文仅需使用这三个类,当然 ARKit 还有很多类,但我们才刚起步,这些就足够了。回到项目,可以看到在 viewWillAppear 方法中初始化了 ARSession 实例,self.sceneView 指向一个 ARSCNView 实例。

override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)

        // Create a session configuration
        let configuration = ARWorldTrackingSessionConfiguration()

        // Run the view's session
        sceneView.session.run(configuration)
    }

绘制立方体

下面我要用 SceneKit 来绘制 3D 立方体。SceneKit 有一些基础类,SCNScene 是所有 3D 内容的容器,可以向其添加多个 3D 几何体,分别是不同的位置、旋转、缩放等等。

要向 scene 中添加内容,首先要创建 Geometry,geometry 可以是负责的形状,也可以是简单的形状如球、立方体、平面等等。然后将 geometry 包装为 scene node 并将其添加到 scene 中。然后 SceneKit 会遍历 scene graph 并渲染内容。

为了添加 scene 并绘制立方体(cube), 需要在 viewDidLoad 方法里添加如下代码:

override func viewDidLoad() {
        super.viewDidLoad()

        // 存放所有 3D 几何体的容器
        let scene = SCNScene()

        // 想要绘制的 3D 立方体
        let boxGeometry = SCNBox(width: 0.1, height: 0.1, length: 0.1, chamferRadius: 0.0)

        // 将几何体包装为 node 以便添加到 scene
        let boxNode = SCNNode(geometry: boxGeometry)

        // 把 box 放在摄像头正前方
        boxNode.position = SCNVector3Make(0, 0, -0.5)

        // rootNode 是一个特殊的 node,它是所有 node 的起始点
        scene.rootNode.addChildNode(boxNode)

        // 将 scene 赋给 view
        sceneView.scene = scene
    }

ARKit 中的坐标单位为米,所以我们就创建了一个 10x10x10 厘米的盒子。

ARKit 和 SceneKit 的坐标系看起来就像这样:

因为摄像头面对负 Z 轴方向,所有上面的代码就是把 box 置于摄像头前 -0.5 单位。

ARSession 开始时,摄像头 position 被初始化为 X=0, Y=0, Z=0。

如果现在运行此例,应该可以看见浮在空中的小小 3D 立方体,尝试绕着它走动,它还会保留原处。它应该是全方位无死角的,哪怕从下面、从上面看过去。

如果想在 3D 场景中添加一些默认光照以便看清立方体的边缘,可以设置 SCNScene 实例的 autoenablesDefaultLighting 属性:

sceneView.autoenablesDefaultLighting = true

后面的文章里会为它添加更高级的光照。

示例代码

所有的示例代码都在这里:https://github.com/josephchang10/ARCube

下篇文章

下篇文章会让这个 app 更好玩,添加几个更复杂的对象、检测场景中的平面还有与场景中的几何体交互,保持联系!

 

>>2亿用户起步的苹果ARKit,光是Demo已经让我高潮 | VR陀螺

AR各种使用:https://www.sohu.com/a/155328964_204728

© 著作权归作者所有

共有 人打赏支持
秦无炎
粉丝 4
博文 119
码字总数 4984
作品 0
朝阳
程序员
2017回顾:苹果做AR的这一年,为何值得铭记?

2017是苹果发力AR的一年,其带动了2017下半年AR市场的整体发展。 这一年,CEO库克在各个场合强推AR,在他看来AR对苹果的重要性,正如iPhone对苹果的重要性一样。 苹果在AR硬件和软件上都取得...

李诗 ⋅ 01/03 ⋅ 0

ARKit从入门到精通(1)-ARKit初体验

ARKit从入门到精通(1)-ARKit初体验 转载请标注出处:http://blog.csdn.net/u013263917/article/details/72903174 下一小节:[ARKit从入门到精通(2)-ARKit工作原理及流程介绍]http://blog....

u013263917 ⋅ 2017/06/07 ⋅ 0

从零开始学基于ARKit的Unity3d游戏开发系列1

前言 无可置疑的是,对绝大多数的中小游戏团队来说,目前Unity3d和Unreal Engine4(虚幻4)已经成为3D游戏开发的首选商业引擎。因为Unity3d的简单易上手特性,强大的功能和丰富的游戏资源及扩...

王寒 ⋅ 2017/12/21 ⋅ 0

ARKit国内demo类型大评点!

 自从苹果推出了ARKit,众多AR开发者都坐不住了,纷纷大开脑洞,搞出了五花八门的AR demo,甚至还有人专门为此搭建了一个网站,手动收集了大量的demo。所以,开发者们到底都撸出了哪些新奇的...

zmsn1990 ⋅ 2017/07/06 ⋅ 0

ARKit:也许是 iPhone 十周年最好的新开始

文/魏一白 早在今年 6 月的 WWDC 大会上,苹果就宣布将在 iOS 11 中引入 AR 开发平台 ARKit,在今天夜里的秋季新品发布会上,姗姗来迟的 iOS 11 正式发布,与之随行的,对 ARKit 而言,还有强...

tangxiaoyin ⋅ 2017/09/13 ⋅ 0

ARKit从入门到精通(4)-ARKit全框架API大全

转载请注明出处:ARKit从入门到精通(4)-ARKit全框架API大全 1.1-ARKit框架简介 1.2-ARAnchor 1.3-ARCamera 1.4-ARError 1.5-ARFrame 1.6-ARHitTestResult 1.7-ARLightEstimate 1.8-ARPlan......

u013263917 ⋅ 2017/06/13 ⋅ 0

苹果ARKit开发入门系列2-Unity ARKit Plugin简介

对iOS原生开发感兴趣的朋友当然会首选SceneKit或是Metal,但ARKit对第三方开发工具的支持显然也很受欢迎,颇为流行的Unity和Unreal引擎就在此列。 在这一部分内容中,我们将了解如何使用ARK...

王寒 ⋅ 2017/09/04 ⋅ 0

以AR视频记忆球重现场景记忆,详解ARKit应用Rememball

生命中总有很多美好的瞬间,我们渴望能够重现。 去年,迪士尼和皮克斯共同打造的动画电影《头脑特工队》就带领我们在大脑记忆中来了一场奇幻之旅。 我们看到在主角茉莉的大脑中,有一座记忆图...

李诗 ⋅ 2017/12/04 ⋅ 0

ARKit学习以及创建简单AR程序

AR简介 先讲述一下什么是AR,AR指的是增强现实,什么是增强现实,百度百科上给的概念: 是一种实时地计算摄影机影像的位置及角度并加上相应图像、视频、3D模型的技术,这种技术的目标是在屏幕...

wf96390 ⋅ 2017/11/08 ⋅ 0

ARCore:从哪里冒出来的ARCore

一、ARCore的横空出世 前几天的谷歌开发人员日,技术专家Tom Slater连线在波兰克拉科夫的ICE会议中心,在YouTube直播中荣重推出了ARCore。 苹果今年6月份发布的ARkit,对于开发者和用户都极度...

p106786860 ⋅ 2017/09/07 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

SpringCloud 微服务 (六) 服务通信 RestTemplate

壹 通信的方式主要有两种,Http 和 RPC SpringCloud使用的是Http方式通信, Dubbo的通信方式是RPC 记录学习SpringCloud的restful方式: RestTemplate (本篇)、Feign 贰 RestTemplate 类似 Http...

___大侠 ⋅ 10分钟前 ⋅ 0

React创建组件的三种方式

1.无状态函数式组建 无状态函数式组件,也就是你无法使用State,也无法使用组件的生命周期方法,这就决定了函数组件都是展示性组件,接收Props,渲染DOM,而不关注其他逻辑。 无状态函数式组...

kimyeongnam ⋅ 17分钟前 ⋅ 0

react 判断实例类型

今天在写组件的时候想通过判断内部子元素不同而在父元素上应用不同的class,于是首先要解决的就是如何判断子元素的类型。 这里附上一个讲的很全面的文章: https://www.cnblogs.com/onepixel...

球球 ⋅ 24分钟前 ⋅ 0

Centos7备份数据到百度网盘

一、关于 有时候我们需要进行数据备份,如果能自动将数据备份到百度网盘,那将会非常方便。百度网盘有较大的存储空间,而且不怕数据丢失,安全可靠。下面简单的总结一下如何使用 bypy 实现百...

zctzl ⋅ 38分钟前 ⋅ 0

开启远程SSH

SSH默认没有开启账号密码登陆,需要再配置表中修改: vim /etc/ssh/sshd_configPermitRootLogin yes #是否可以使用root账户登陆PasswordAuthentication yes #是都开启密码登陆ser...

Kefy ⋅ 40分钟前 ⋅ 0

Zookeeper3.4.11+Hadoop2.7.6+Hbase2.0.0搭建分布式集群

有段时间没更新博客了,趁着最近有点时间,来完成之前关于集群部署方面的知识。今天主要讲一讲Zookeeper+Hadoop+Hbase分布式集群的搭建,在我前几篇的集群搭建的博客中已经分别讲过了Zookeep...

海岸线的曙光 ⋅ 48分钟前 ⋅ 0

js保留两位小数方法总结

本文是小编针对js保留两位小数这个大家经常遇到的经典问题整理了在各种情况下的函数写法以及遇到问题的分析,以下是全部内容: 一、我们首先从经典的“四舍五入”算法讲起 1、四舍五入的情况...

孟飞阳 ⋅ 今天 ⋅ 0

python log

python log 处理方式 log_demo.py: 日志代码。 #! /usr/bin/env python# -*- coding: utf-8 -*-# __author__ = "Q1mi""""logging配置"""import osimport logging.config# 定义三种......

inidcard ⋅ 今天 ⋅ 0

mysql 中的信息数据库以及 shell 查询 sql

Information_schema 是 MySQL 自带的信息数据库,里面的“表”保存着服务器当前的实时信息。它提供了访问数据库元数据的方式。 什么是元数据呢?元数据是关于数据的数据,如数据库名或表名,...

blackfoxya ⋅ 今天 ⋅ 0

maven配置阿里云镜像享受飞的感觉

1.在maven目录下的conf/setting.xml中找到mirrors添加如下内容,对所有使用改maven打包的项目生效。 <mirror> <id>alimaven</id> <name>aliyun maven</name> <url>http://maven.al......

kalnkaya ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部