Apple Engine

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

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

今回は、アニメーションで使用していた SCNAction を Scene Editor の Action Editor で編集を行う。

ちなみに SpriteKit と異なり SceneKit の Action Editor からではアニメーション用のファイルをつくることができず、 コードから使いまわすことができない。
そのため、シーン上で一定のアニメーションがループされるものなど利用する状況が限られる。

 

全体の UI

アニメーションさせたいオブジェクトを選択し、セカンダリエディタを開くと Action Editor のタイムラインが表示され 以下のような UI が表示される。

f:id:x67x6fx74x6f:20170704192425p:plain

 

オブジェクトにアクションを適応してみる。

オブジェクトライブラリから「Move Action」を選択してタイムライン上にドラッグ&ドロップする。

アクション自体が置かれるのだが、設定値が 0 なので、 アトリビュートインスペクタを開き(Command + Option + 4)、 最初の項目の Action にある Y の値を 1 にしてみる

f:id:x67x6fx74x6f:20170704184704p:plain

 

再生ボタンを押すと UI の色が変更されアニメーションする。
(タイムライン上で再生位置を移動させたり、カーソル左右キーでも確認可能)

f:id:x67x6fx74x6f:20170704184738p:plain

 

設定の値の Start Time が 0、Duration 1 であるため、シーンの再生開始から1秒間で Y軸 1 移動するアニメーションが行われる。

以下のコードと同様の動きである。

SCNAction.move(by: SCNVector3(0, 1, 0), duration: 1)

 

「Move Action」を使用したが「MoveTo Action」は以下のコードと同様である

SCNAction.move(to: SCNVector3(0, 1, 0), duration: 1)

回転や拡大縮小、フェードなども同様に何もない方が by。
To がついている方が to の命令となっている。

一応、タイムライン上での Action を移動させることで再生位置を変更したり、右側をドラッグすると再生時間を伸縮させることができる。

  

あと、もう一つ設定値 Timing Function は以下の設定となっている

f:id:x67x6fx74x6f:20170704184939p:plain

 

設定名 動作
Linear 一定速度でアニメーションをする
Ease In 最初はゆっくりで、最後の方で加速する
Ease Out Ease In の逆で、最初速く終わりの方で減速する
Ease In, Ease Out 最初はゆっくり動き出し、中盤で加速、終わり側で減速する

 

わかりやすい説明

developers.google.com

 

ループ設定

アクションにカーソルを持っていくと左下に回転するアイコンが出てそこをクリックすると SCNAction の repeat、repeatForever と同様の動作を行うことができる。

f:id:x67x6fx74x6f:20170704185351p:plain

 

回転するアイコンをクリックすると1回リピートされる。
プラス、マイナスでリピート数が増え、無限大アイコンクリックで無限にリピートのオン/オフ。
バツボタンでリピートの解除ができる。

f:id:x67x6fx74x6f:20170704185409p:plain

 

Action 選択後、右クリック「Create Loop」でもループを作成することができる。

 

Action Editor で無限ループにした場合の To のアクション

MoveTo の場合は指定位置までしか行かないため、タイムラインでも指定時間後はオブジェクトはそこにとどまる振る舞いをする。
(回転、拡大縮小も同様)

f:id:x67x6fx74x6f:20170704190518p:plain

 

複数の Action を設定する

オブジェクトに対して複数の Action を適応する場合は、タイムライン上に新しいものを追加するだけ。 Y 軸方向に 1 移動し、X軸で 180 度回転している。

f:id:x67x6fx74x6f:20170704190905p:plain

 

複数の Action をループ設定する

複数の Action を選択して、ループアイコンをクリック、もしくは右クリックから「Create Loop」を選ぶ。

以下のように、連続したアクションの場合は単体のループでは間が空くため難しいため。

f:id:x67x6fx74x6f:20170704191017p:plain

 

ちなみに、ループを設定しても元アクションは変更できる。

 

複数のオブジェクトの Action を編集する

複数のオブジェクトを選択するとタイムライン上に列挙される

f:id:x67x6fx74x6f:20170704191056p:plain

 

一時的にタイムラインの表示したいものをフィルターしたい場合は、下の検索までに文字を入れればフィルターされる。

f:id:x67x6fx74x6f:20170704191116p:plain

 

タイムラインのメモリや Action の大きさを変更したい。

タイムライン右下のスライダーを動かす。

f:id:x67x6fx74x6f:20170704191155p:plain

f:id:x67x6fx74x6f:20170704191206p:plain

 

注意点

その1

タイムラインの Action を設定を変更しても表示が反映されない場合があるので、その時は他のオブジェクトを選択してみたり、Source Editor や Interface Builder を表示して、Scene Editor を表示し直す。

 

その2

Node Inspector の Animation の歯車のアイコンクリックで 「Save animation…」 という項目があるがタイムラインのアニメーション単体は保存できない。

f:id:x67x6fx74x6f:20170704191300p:plain

というか、何も選択していない状態でこれをクリックすると Xcode が落ちる。

 

今回はここまで。