UIKit에서 SceneKit 통합: 3D 그래픽 및 애니메이션

UIKit과 SceneKit을 함께 사용하면 아이폰 애플리케이션에 풍부한 3D 그래픽과 애니메이션을 추가할 수 있습니다. 이 문서에서는 SceneKit의 기본 설정, 3D 객체 생성, 애니메이션 구현 방법을 다룹니다. 실습 중심의 예제를 통해 구체적으로 설명하겠습니다.

SceneKit 설정

먼저, 프로젝트에 SceneKit을 설정하는 방법을 알아보겠습니다. 새로운 Xcode 프로젝트를 생성하고 ViewController.swift 파일을 선택한 후, 프로젝트에 필요한 SceneKit 프레임워크를 가져옵니다.

swift
import UIKit
import SceneKit

이제 SCNView를 생성하여 UIViewController에 추가합니다. 이를 통해 3D 콘텐츠를 렌더링할 수 있습니다.

swift
class ViewController: UIViewController {

    var sceneView: SCNView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // SCNView를 초기화합니다.
        sceneView = SCNView(frame: self.view.frame)
        self.view.addSubview(sceneView)
        
        // Scene을 생성합니다.
        let scene = SCNScene()
        sceneView.scene = scene
        
        // 기본 설정
        sceneView.allowsCameraControl = true
        sceneView.showsStatistics = true
        sceneView.backgroundColor = UIColor.black
    }
}

위 코드 스니펫에서는 SCNView를 초기화하고, 이를 ViewController의 view에 추가하였습니다. 또한, 기본 SCNScene을 설정하여 3D 콘텐츠를 렌더링할 준비를 마쳤습니다.

3D 객체 생성

SceneKit에서는 다양한 3D 객체를 간단하게 생성할 수 있습니다. 이번에는 기본적인 3D 형태 중 하나인 SCNBox를 추가해보겠습니다.

swift
    override func viewDidLoad() {
        super.viewDidLoad()

        // ... 생략된 부분 ...

        // Box geometry를 생성합니다.
        let boxGeometry = SCNBox(width: 1.0, height: 1.0, length: 1.0, chamferRadius: 0.0)
        
        // 노드를 생성하고 geometry를 추가합니다.
        let boxNode = SCNNode(geometry: boxGeometry)
        
        // 생성한 노드를 scene에 추가합니다.
        sceneView.scene?.rootNode.addChildNode(boxNode)
    }

이 코드는 1x1x1 크기의 Box를 생성하고, 이를 scene에 추가하는 역할을 합니다. 이제 코드를 빌드하고 실행하면, 검은 배경 위에 투명한 박스가 나타날 것입니다.

3D 객체에 색상 추가

단순한 형태를 벗어나, 객체에 색상을 입히는 방법을 알아보겠습니다. 이를 위해서 비트맵 이미지를 텍스처로 사용하는 방법과 색상만을 사용하는 방법 모두를 소개하겠습니다.

swift
let boxMaterial = SCNMaterial()
boxMaterial.diffuse.contents = UIColor.red
boxGeometry.materials = [boxMaterial]

위 예제에서는 SCNMaterial을 사용하여 boxGeometry에 빨간색을 적용했습니다. 이제 박스가 붉은 색으로 렌더링 될 것입니다.

카메라와 조명 설정

3D 그래픽에서는 카메라와 조명의 설정이 매우 중요합니다. 이를 통해 다양한 각도에서 객체를 렌더링하고, 효과적인 조명 처리가 가능합니다.

swift
// 카메라 설정
let camera = SCNCamera()
let cameraNode = SCNNode()
cameraNode.camera = camera
cameraNode.position = SCNVector3(x: 0, y: 0, z: 10)
sceneView.scene?.rootNode.addChildNode(cameraNode)

// 조명 설정
let light = SCNLight()
light.type = .omni
let lightNode = SCNNode()
lightNode.light = light
lightNode.position = SCNVector3(x: 0, y: 10, z: 10)
sceneView.scene?.rootNode.addChildNode(lightNode)

이 코드 스니펫에서는 카메라를 설정하여 10단위 z축 뒤에서 장면을 보는 설정을 하였으며, 전방위 조명을 추가하여 3D 객체들을 더 잘 보이도록 하였습니다.

기본 애니메이션 적용

애니메이션은 SceneKit의 매우 강력한 기능 중 하나입니다. 이번에는 박스를 계속해서 회전시키는 간단한 애니메이션을 추가해 보겠습니다.

swift
let rotation = CABasicAnimation(keyPath: "rotation")
rotation.toValue = NSValue(scnVector4: SCNVector4(x: 0, y: 1, z: 0, w: Float.pi * 2))
rotation.duration = 10
rotation.repeatCount = .infinity
boxNode.addAnimation(rotation, forKey: "rotation")

위 코드는 박스를 Y축을 중심으로 계속해서 회전시키는 애니메이션을 제공합니다. CABasicAnimation을 사용하여 간단하게 애니메이션을 구현할 수 있으며, repeatCount를 .infinity로 설정하여 애니메이션이 무한히 반복되도록 하였습니다.

결론

이제 UIKit에서 SceneKit을 활용하여 3D 그래픽과 애니메이션을 통합하는 방법을 이해했을 것입니다. 기본 설정부터 3D 객체 생성, 색상 추가, 카메라 및 조명 설정, 그리고 애니메이션 구현까지 다루었습니다. 이러한 내용을 통해 더 복잡하고 풍부한 3D 그래픽을 애플리케이션에 추가할 수 있을 것입니다.