[Swift] SpriteKit SKActionで移動、回転、拡大縮小のアクションを実行する | はじはじアプリ体験記

SpriteKit
【Swift】SpriteKitの使い方。SKActionを使ってノードを移動、回転、拡大縮小する。

  • 2016年7月26日
    Swift 2.2で検証
  • Twitterでシェア
  • Facebook
  • LINEで送る

SKActionとは

本記事ではSKScene(以下、シーン)に配置したノードをSKActionを用いて状態変化させる方法を説明する。

SKActionとは、移動、回転、拡大縮小などノードの状態を変化させるためにノードに与えるアクションクラスのことである。

以降の手順を行う前のXcodeプロジェクトをGitHubに置いたので、試してみる方はご利用下さい。
⇒「テスト用プロジェクト

シーンに背景と鳥のノードを配置しておいた。このプロジェクトを変更し、画面タップで鳥ノードの状態が変化するようにする。

画面中央に鳥を配置した

 

以下のコードは変更前のTestScene.swift。

TestSceneが現在シーンになったら、背景画像と鳥のノードをシーンに追加している。

 

ノードの状態を変化させるのにはSKActionクラスを利用する。

以下の例のように、目的別のSKActionインスタンスを取得し、ノードのrunActionメソッドの引数に与えてやればノードの状態が変化する。

//移動のSKActionを取得する
let action = SKAction.moveTo(CGPoint(x:X座標, y:Y座標), duration:時間)

//アクションを実行する。
birdNode.runAction(action)

 

以下は、SKActionのメソッド。他にもたくさんのメソッドがあるので興味のある方は公式リファレンスを参照されたし。⇒「SKAction

メソッド名 説明
moveTo 指定した座標(X,Y)に移動する。
let action = SKAction.moveTo(CGPoint(x:200, y:200), duration:1.0)
moveToX 指定したX座標に移動する。Y座標には変化しない。
let action = SKAction.moveToX(200, duration:1.0)
moveToY 指定したY座標に移動する。X座標には変化しない。
let action = SKAction.moveToY(200, duration:1.0)
moveBy 現在位置から指定した長さ(ポイント)を移動する。
let action = SKAction.moveBy(CGVector(dx: 90,dy: 90), duration: 1.0)
moveByX 現在位置から指定した長さ(ポイント)を移動する。
llet action = SKAction.moveByX(90, y: 90, duration: 1.0)
followPath パスに沿って移動する
let path = CGPathCreateMutable()
CGPathMoveToPoint(path, nil, 0, 0)
CGPathAddLineToPoint(path, nil, 100, 100)
CGPathAddLineToPoint(path, nil, 100, -100)
let action = SKAction.followPath(path, duration: 1.0)
rotateToAngle 指定した角度に回転する。
let action = SKAction.rotateToAngle(CGFloat(M_PI_2), duration: 1.0)
rotateByAngle 現在角度からさらに指定した角度を回転する。
let action = SKAction.rotateByAngle(CGFloat(M_PI_2), duration: 1.0)
scaleTo 指定した倍率まで拡大縮小する(1.0が等倍)。
let action = SKAction.scaleTo(1.5, duration: 1.0)
scaleBy 現在の倍率からさらに指定した倍率まで拡大縮小する。
let action = SKAction.scaleBy(1.5, duration: 1.0)
scaleXBy 現在の倍率からさらに指定した倍率(X、Yを指定)まで拡大縮小する。
let action = SKAction.scaleXBy(2.0, y: 3.0, duration: 1.0)
scaleXTo 指定した倍率まで水平方向に拡大縮小する。
let action = SKAction.scaleXTo(1.5, duration: 1.0)
scaleYTo 指定した倍率まで垂直方向に拡大縮小する。
let action = SKAction.scaleYTo(1.5, duration: 1.0)
resizeToWidth 指定した幅まで画像を拡大縮小する。
let action = SKAction.resizeToWidth(200, duration: 1.0)
resizeToHeight 指定した高さまで画像を拡大縮小する。
let action = SKAction.resizeToHeight(200, duration: 1.0)
resizeByWidth 現在のサイズからさらに指定した幅と高さを追加したサイズまで拡大縮小する。
let action = SKAction.resizeToWidth(200, duration: 1.0)

 

タップした位置にノードを移動する

TestScene.swiftに以下のメソッドを追加する。

画面をタッチしたらtouchesBeganメソッドが呼び出されるので、SKActionを用いてタッチされた座標までノードを移動している。

 

以下は実際のプレイ動画

スポンサーリンク

アクションを組み合わて同時に実行する

タップした位置にノードを移動するだけでなく、移動している間に他のアクションも実行したいことがある。そんなときはgroupメソッドを使ってアクションを1つにまとめて実行する。

実際にやってみよう。先ほど追加したtouchesBeganメソッドを以下のように修正する。

タッチした位置まで移動するアクションと、5回転するアクションと、サイズが1.2倍になるアクションをまとめて実行している。

 

以下は実際のプレイ動画

 

組み合わせたアクションを順番に実行する

順番にアクションを実行する場合は、以下のコードのようにsequenceメソッドでアクションをまとめる。

 

以下は実際のプレイ動画

 

ノードをドラッグで移動する

先ほど追加したtouchesBeganメソッドは削除して、以下のメソッドを追加する。

指を画面に触れたまま移動したときにtouchesMovedメソッドが呼び出されるので、タッチされている座標までノードを移動している。このメソッドは指の位置が変わるたびに呼び出される。

指と全く同じ座標にノードを移動すると指でノードが隠れて見えにくいので、指の位置から20ポイント上に移動するようにした。

 

以下は実際のプレイ動画

Swift記事一覧へ
  • Twitterでシェア
  • Facebook
  • LINEで送る
はじはじビットコイン目指せ!最強の暗号通貨トレーダー

コメントを残す

お名前