【Swift】SpriteKitの使い方。シーンエディタでノードのリサイズアクションを設定する。(Swift 2.2、XCode 7.3)
シーンエディタでリサイズ
本記事ではSpriteKit Sceneファイルの編集画面(シーンエディタ)で設定できるResize Action関係の部品について説明する。
Resize Actionとは、シーンに配置したノードをリサイズするアクションである。Sceneファイル(以下、SKSファイル)の作り方については次の記事を参照されたし。⇒「SpriteKit Sceneファイルの使い方」
前回記事で説明したScale Actionと異なる点は、Scale Actionは倍率を指定してサイズを変更するのに対し、Resize Actionは縦横の実寸(ポイント)を指定してサイズを変更する点である。
手順や設定項目はScale Actionのものとあまり変わらないが念のため説明しておく。
以降の手順を行う前のXcodeプロジェクトをGitHubに置いたので、試してみる方はご利用下さい。⇒「テスト用プロジェクト」
ResizeTo Action
下図赤枠のSKSファイルを選択してシーンエディタを開く。Animate横のボタン(黄緑枠)を押してタイムラインを表示する。水色枠のオブジェクトライブラリボタンを押して部品一覧を表示し、ドラッグ&ドロップで「ResizeTo Action」を鳥ノードのタイムラインまで運ぶ(紫矢印)。
黄枠のアトリビュートインスペクタボタンを押して設定画面を表示し、Start Timeに「2」、Durationに「2」、Timing Functionに「Linear」、SizeにW「200」、H「200」を入力する。
以下は実際のプレイ動画。縦横が200ポイントの大きさになった。
アトリビュートインスペクタの設定項目を説明する。
設定項目の内容を説明する。
Start Time
シーンが切り替わったタイミングから何秒後にアクションを実行するかを指定する。
Duration
アクションの所要時間を指定する。なぜか、シーンエディタで設定できる最小値は0.033
Timing Function
拡大縮小の速さを以下のの4つから選択する。項目名は「Timing Mode」の間違いと思われる。
設定名 | 説明 |
---|---|
Linear | 一定速度でリサイズする。 |
Ease In | 加速しながらリサイズする。 |
Ease Out | 減速しながらリサイズする。 |
Ease In, Ease Out | 前半は加速し、後半は減速しながらリサイズする。 |
Size
リサイズ後の幅と高さを指定する。マイナス値を設定することはできない。
ちなみに、上記と同じ動きをソースコードで実装するにはTestScene.swiftを以下のコードに変更する。メソッド名がresizeToWidthで幅しか指定できなさそうだが、幅と高さを設定できる。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
// // TestScene.swift // import Foundation import SpriteKit class TestScene:SKScene { //現在シーン設定時の呼び出しメソッド override func didMoveToView(view: SKView) { //SKSファイルに配置した鳥ノードを取得する。 let bird = self.childNodeWithName("bird") as? SKSpriteNode //2秒待機のアクションを作成する。 let action1 = SKAction.waitForDuration(2.0) //リサイズのアクションを作成する。 let action2 = SKAction.resizeToWidth(200, height: 200, duration: 2.0) //一定速度でリサイズする。 action2.timingMode = SKActionTimingMode.Linear //アクションをまとめる。 let actionAll = SKAction.sequence([action1,action2]) //アクションを実行する。 bird?.runAction(actionAll) } } |
ResizeToWidth Action
幅だけ指定してリサイズする。高さは変わらない。
幅と高さを指定するメソッドの場合、高さを変更したくなくてもノードの高さを入力する必要があるが、このメソッドは高さのことは気にする必要がないのが利点だ。
以下の動画は、Wを「200」に設定して実行した結果
ソースコードで実装する場合は、前述したソースコードのアクション作成箇所を以下のようにする。
1 2 3 |
//リサイズのアクションを作成する。 let action2 = SKAction.resizeToWidth(200, duration: 2.0) |
ResizeToHeight Action
高さだけ指定してリサイズする。幅は変わらない。
以下の動画は、Hに「200」を設定して実行した結果
ソースコードで実装する場合は、先ほどのソースコードのアクション作成箇所を以下のようにする。
1 2 3 |
//リサイズのアクションを作成する。 let action2 = SKAction.resizeToHeight(200, duration: 2.0) |
Resize Action
現在のサイズに指定サイズを足した大きさに変更する。
以下の動画は、W「200」、H「200」を設定して実行した結果。最初のサイズ(100×100)に指定サイズが追加されて300×300のサイズになった。
W、Hにはマイナスの値を設定できる。この設定で現在のサイズがマイナスになった場合はノードが反転して表示される。
以下の動画は、現在のサイズ(100×100)に対してResize ActionのW「-200」、H「-200」を実行した結果。