Apple Engine

Apple, iPhone, iOS, その周辺のことについて

iOS で SceneKit を試す(Swift 3) その11 - Scene Editor を使ってみる

今まではコードから SCNScene のクラスを使用してシーンを作成していたが、SceneKit にはもう1つ作成方法があり今回はそちらのご紹介。

Xcode に Scene Editor というツールがあり、Unity のエディタのようなもの。 オブジェクトを視覚的置いたり、アニメーションを確認したりできる。

Xcode の Game テンプレートでこちらを使用している

 

プロジェクトの作成

ということで、今回も Single View Application のテンプレートからつくる。

f:id:x67x6fx74x6f:20170616183604p:plain

 

名前は何でも良いが、とりあえず SceneEditor という名前にした。

 

Storyboard の編集

以前と同様に Main.storyboard を開き、
View を SCNView に変更する。

f:id:x67x6fx74x6f:20170530185634p:plain

 

ViewController.swift の編集

こちらも、以前と同様に SceneKit をインポートして、
まず、空のシーンを置き、タップジェスチャーを追加してみる。

import UIKit
import SceneKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        // シーン設定
        let scene = SCNScene()
        
        // SCNView 設定
        let scnView = self.view as! SCNView
        scnView.backgroundColor = UIColor.black
        scnView.scene = scene
        scnView.showsStatistics = true
        scnView.allowsCameraControl = true
        
        // タップジェスチャー
        let tapGesture = UITapGestureRecognizer(target: self, action: #selector(handleTap(_:)))
        scnView.addGestureRecognizer(tapGesture)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func handleTap(_ gestureRecognize: UIGestureRecognizer) {
        
        print("タップされました")
        
    }
}

 

ビルドすると下にっ統計情報が表示される

f:id:x67x6fx74x6f:20170530190203p:plain

 

新規で SceneKit Scene(scn)ファイルをつくり編集してみる

新規作成 (Command + N) から iOS タブの「SceneKit Scene File」を選択。
今回はファイル名を main.scn にしてみた。

f:id:x67x6fx74x6f:20170616183949p:plain

 

するとこんな画面が表示される。

f:id:x67x6fx74x6f:20170616184029p:plain

 

そのままだと、構造がわからないので Editor > Show Document Outline か、左下のアイコンをクリック。

Outline にカメラがあることが確認できる。

f:id:x67x6fx74x6f:20170616184100p:plain

 

シーンエディターに球とライトを配置する

球を配置してみる

右下のから Object Library (Commnd + Option Control + 3)を開き、「Shpere」 探し、シーンへドラッグする。

f:id:x67x6fx74x6f:20170616184221p:plain

 

白く丸い球体が表示されたと思う。

f:id:x67x6fx74x6f:20170616190025p:plain

 

そのままだと適当な位置に配置されてしまうので、Object Library の上にある立方体のアイコン Node Inspector (Commnd + Option Control + 3)を押して、ノードの情報を表示。 X、Y、Z を 0 にしてみる。

f:id:x67x6fx74x6f:20170616190049p:plain

 

ライトを配置してみる

手順は同じ。

Object Library から Omni Light をドラッグして、Node Inspector で Y を 10 にしてみる。

X Y Z
0 10 0

f:id:x67x6fx74x6f:20170616190156p:plain

準備完了したのでソースから scn ファイルを読み込んでみる

 

ViewController.swift を再編集して scn ファイルを読み込む

SCNScene から先程つくった scn ファイルを読み込んで表示させる。 1行変えるだけ。

こちらを

let scene = SCNScene()

こちらに変更。今回名前を main.scn にしたので、この名前で読み込む。

let scene = SCNScene(named: "main.scn")!

ビルドする scn ファイルに配置したものが表示されるかはず。

f:id:x67x6fx74x6f:20170616190237p:plain

 

Scene Editor の中のものが表示されるのでわかりやすいかと。

 

今回はここまで。

スポンサーリンク