連載
» 2015年09月17日 05時00分 公開

iOS SDKとSwiftで始めるゲーム作成入門(1):初心者でもiOS 9/tvOS向け2Dゲームが作れる標準フレームワークSpriteKitの基礎知識とチュートリアル (3/3)

[杉本裕樹,マネーフォワード]
前のページへ 1|2|3       

SpriteKitで使われる基本的なクラス

 まずは、SpriteKitを使ったゲームの基本的な部品となるクラスの紹介です。

1つの画面を構成する「SKScene」

 まずはSKSceneについてです。SKSceneとは1つの画面を構成するクラスです。ゲーム開発ではSKSceneのサブクラスを作り、その上に背景やキャラクターなどの要素を配置していきます。

 先ほど作ったアプリでは「GameScene」というクラスがSKSceneのサブクラスになっています。ゲームの画面上のオブジェクトの配置やタップイベントはGameSceneに記述されています。

 今回は1画面だけのゲームなのでGameSceneしか作成されていませんが、実際にゲームを作る際はオープニング画面用のサブクラス(例えば「OpeningScene」)や終了画面のサブクラス(例えば「GameClearScene」)を作ることになるかと思います。

ラベルや画像などの一つ一つの要素を作る「SKNode」

 Scene上のラベルや画像などの一つ一つの要素は「SKNode」というクラスのサブクラスになります。

 前述のGameSceneの上にあるラベルはSKNodeのサブクラスである「SKLabelNode」を使っています。下コードで画面上の「Hello, World!」ラベルを生成しています。

override func didMoveToView(view: SKView) {
    /* Setup your scene here */
    let myLabel = SKLabelNode(fontNamed:"Chalkduster")
    myLabel.text = "Hello, World!";
    myLabel.fontSize = 45;
    myLabel.position = CGPoint(x:CGRectGetMidX(self.frame), y:CGRectGetMidY(self.frame));
        
    self.addChild(myLabel)
}
Swiftコード

 飛行機の画像は「SKSpriteNode」というSKNodeのサブクラスを使っています。GameSceneでは「touchesBegan」メソッド内で生成しています。

 今回はSKSpriteNodeで画像を作っていますが、画像以外には色付きの矩形を作ることもできます。

override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
    /* Called when a touch begins */
        
    for touch in touches {
        let location = touch.locationInNode(self)
            
        let sprite = SKSpriteNode(imageNamed:"Spaceship")
            
        sprite.xScale = 0.5
        sprite.yScale = 0.5
        sprite.position = location
            
        let action = SKAction.rotateByAngle(CGFloat(M_PI), duration:1)
            
        sprite.runAction(SKAction.repeatActionForever(action))
            
        self.addChild(sprite)
    }
}
Swiftコード

 実はSKSceneもSKNodeのサブクラスなのですが、分かりやすくするために別々に説明しています。

ライフサイクルメソッド

 次は、前述のGameSceneに書かれたメソッドについて説明していきます。

didMoveToView

 GameScene中でSKLabelNodeの作成処理が書かれていたメソッドです。このメソッドはSceneが画面表示された際に呼ばれるメソッドです。多くの場合は1回しか呼ばれないのでラベルの配置などの初期化処理を書くことが多いです。

touchesBegan

 これはユーザーが画面をタッチした際に呼ばれるメソッドです。実はこのメソッドはSpriteKitのメソッドではなく「UIKit」のメソッドなので、アプリ開発者の中にはなじみのある方も多いかと思います。このメソッド内ではタップされた位置の情報などが取れるので、それを基に処理を記述していきます。

update

 今回は中身は空ですが、updateは常時呼ばれるメソッドです。このメソッドはフレームごとに呼ばれるので、カウントダウンタイマーを動かしたりキャラクターを動かしたりするときに使われます。

SpriteKitのアニメーション

SKAction

 オブジェクトの移動や回転などのアニメーションは「SKAction」というクラスを使います。今回のサンプルでは、飛行機の画像を回転させるために使っています。

let action = SKAction.rotateByAngle(CGFloat(M_PI), duration:1)
sprite.runAction(SKAction.repeatActionForever(action))
Swiftコード

 SKActionは非常に機能が多く、回転以外でも移動・拡大/縮小・フェードイン/フェードアウトなど多くのことができます。回転処理も今回は永遠に回る処理を書きましたが、一定角度まで到達したら止まるようにすることもできます。

次回からはタワーディフェンス型のゲームを作成

 以上で今回は終了です。ゲーム作りの雰囲気を何となくてもつかめていただけたら幸いです。今回話したゲーム作りの流れを簡単にまとめると下のようになります。

  • 画面ごとにSKSceneのサブクラスのインスタンスを作成する
  • 作成したScene(SKSceneのインスタンス)上に、Node(SKNodeのインスタンス)を配置して処理を記述していく

 基本的にはSceneを作って、その上に処理を書いていくだけなので慣れればスムーズに制作できるかと思います。次回からはタワーディフェンス型のゲームを作っていきます。

筆者紹介

杉本裕樹

田町のベンチャーで働くエンジニア。

仕事ではiPhoneアプリの開発やRailsを使ったWebサービス開発を行っている。最近のマイブームはUnityを使った3Dゲーム開発。


前のページへ 1|2|3       

Copyright © ITmedia, Inc. All Rights Reserved.

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。