Swift를 사용하여 AR 앱을 만들어 보았습니다.

ARKit을 사용하여 태양계를 현실 공간에 표시하는 앱을 만들어 보았다.
환경 구축을 포함해 초학자가 AR 앱을 작성하기 전에 필요한 정보를 비망록적으로 남겨두기로 한다.

※본 기사는 움직이는 오브젝트를 표시할 때까지 하고 있어 최종적인 완성물은 이하의 기사에서 소개하고 있다.
【ARKit】AR로 VR 공간을 작성한다
앱 다운로드는 여기

준비편

Xcode 설치

iOS 앱을 개발하기 위해서는 Xcode가 필요.
AppStore에서 버전 9.0(2017/10 최신판)을 설치한다.

프로젝트 만들기

XCode 기동 후, 「Create a new Xcode project」를 선택한다.
Single View App을 선택하고 원하는 곳에 저장합니다.
프로젝트명은 「SolarSystem」이라고 한다.

이상으로 앱 작성 준비는 완료.
iOS 앱을 만들 때는 기본적으로 Xcode조차 준비하면 좋기 때문에 매우 쉽게 잡힌다.
※AR 앱의 검증에서는 시뮬레이터를 사용할 수 없기 때문에, iPhone등의 실기를 반드시 준비할 필요가 있다.

AR 앱 화면 준비

화면 왼쪽의 ProjectNavigater에서 Main.storyboard 파일을 선택합니다.

화면 오른쪽 하단의 "Show the Object Library"에서 "ARKit SceneKit View"를 선택하고 storyboard 화면으로 드래그 앤 드롭합니다.

「ARSCNView」라고 쓰여진 청색 오브젝트를 storyboard 화면 가득 넓힌다.

화면 우측 상단의 아이콘 「Show the Assistant editor」를 클릭하면, storyboard 옆에 「ViewController.swift」가 표시된다.

「ARSCNView」라고 쓰여진 파란 오브젝트를 Ctrl키를 누르면서 ViewController에 드래그＆드롭 하면(자), 커넥션 정보를 설정하는 팝업이 표시된다.

이름을 "sceneView"로 "OK"를 선택하면 다음 속성이 추가됩니다.

ViewController.swift

@IBOutlet weak internal var sceneView: ARSCNView!

이 「sceneView」에 작성한 Node를 추가해 가는 것으로,
현실 세계에 물체를 겹칠 수 있다.

실장편

태양 오브젝트를 만들어 보자 ☀️

우선은 태양계의 중심이 되는 태양 오브젝트를 작성한다.

sample1.swift

// 球体を作成
let sun = SCNNode(geometry: SCNSphere(radius: 0.20)) 

// 表示位置を指定
sun.position = SCNVector3(0, 0, -1) 

// 表面を指定(写真を貼るイメージ)
sun.geometry?.firstMaterial?.diffuse.contents = image 

// ARSCNViewに作成物を追加
sceneView.scene.rootNode.addChildNode(sun)

다음으로, 태양 물체를 회전(자전)시킨다.

sample2.swift

// 動きはSCNActionで定義
func doRotation(time: TimeInterval) -> SCNAction {
    let rotation = SCNAction.rotateBy(x: 0, y: CGFloat(Double(360) * .pi/180), z: 0, duration: time)
    let foreverRotation = SCNAction.repeatForever(rotation)
    return foreverRotation
}

// sample1.swiftで作成したNode
sun.runAction(doRotation)

수성 개체를 만들어 보자 🌕

태양 주위를 공전하는 수성 개체를 만듭니다.
물론 공전뿐만 아니라 자전하는 것도 고려할 필요가 있다.
우선은 태양 주위를 공전하는 축을 작성한다.

sample3.swift

// 公転軸
let revolutionAxis = SCNNode()

// 公転軸の位置を指定(太陽の中心位置と同じ)
revolutionAxis.position = SCNVector3(0, 0, -1)

// 公転動作（sample2.swiftのdoRotationと同じ）
let revolution = doRevolution(time: rotationSpeed)
revolutionAxis.runAction(revolution)

그런 다음 수성 객체를 만들고,
sample3.swift로 작성한 공전축에 수성 오브젝트를 거듭해 본다.

sample4.swift

// 水星オブジェクトを作成
let mercury = SCNNode(geometry: SCNSphere(radius: 0.03)) 

// 水星の位置を定義（太陽からの距離がx:0.3）
mercury.position = SCNVector3(0.3, 0, 0) 

// 表面を指定(写真を貼るイメージ)
mercury.geometry?.firstMaterial?.diffuse.contents = image 

// 公転軸に水星オブジェクトを追加
revolutionAxis.addChildNode(mercury)

지금까지 태양과 그 주위를 공전하는 수성 오브젝트가 완성되었다.

완성판

아래 샘플 소스 코드
※상기 관련 파일은 「Sun.swift」「Star.swift」「Mercury.swift」「Planet.swift」가 해당한다.
htps : // 기주 b. 코 m / 슌 p / 소 r sys m