[iOS 10] SpriteKit の Tile Map をつかってミニゲームをつくってみた #1

2016.09.14

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

ゲームの仕様

こんなゲームを作ります。

sk_tile_game_01_01

ざっくり仕様はこんな感じ。よくある氷の床のやつです。

  • フリックで、エンペラーペンギンが上下左右にスベる。
  • スベっているエンペラーペンギンは、壁か障害物に当たると止まる。
  • エンペラーペンギンがジェンツーペンギンのマスに移動してランデブーできればクリア
  • フリック処理をつくる

    では、さっそく作っていきます。
    今回はフリックを GameScene.m でハンドリングするところまで作ります。

    まず、プロジェクトとタイルマップを作ります。
    [iOS 10] SpriteKit の Tile Map をさわってみた #1 が、このまま使えます。というか、このためのブログでした。

    次に GameScene.hGameScene.m にフリックを受け取るメソッドを作ります。

    GameScene.h

    #import <SpriteKit/SpriteKit.h>
    
    typedef NS_ENUM(NSInteger, CMSSwipe) {
        CMSSwipeUp,
        CMSSwipeDown,
        CMSSwipeLeft,
        CMSSwipeRight,
    };
    
    @interface GameScene : SKScene
    
    - (void)swipe:(CMSSwipe)swipe;
    
    @end

    GameScene.m

    - (void)swipe:(CMSSwipe)swipe {
        // ここにフリック処理を書く。
    }

    次に、Main.storyboard 上の GameViewControllerSwipe Gesture Recognizer を4つ追加します。

    sk_tile_game_01_02

    追加したジェスチャーをそれぞれ上下左右に設定します。

    sk_tile_game_01_03

    GameViewController.m で、scene を取得しておきます。

    GameViewController.m

    @implementation GameViewController {
        GameScene *_scene;
    }
    
    - (void)viewDidLoad {
        [super viewDidLoad];
    
        // Load the SKScene from 'GameScene.sks'
        GameScene *scene = (GameScene *)[SKScene nodeWithFileNamed:@"GameScene"];
        
        // Set the scale mode to scale to fit the window
        scene.scaleMode = SKSceneScaleModeAspectFill;
        
        SKView *skView = (SKView *)self.view;
        
        // Present the scene
        [skView presentScene:scene];
        
        skView.showsFPS = YES;
        skView.showsNodeCount = YES;
        
        _scene = scene;
    }

    次に GameViewController.m にアクションメソッドを新規追加して、画面から設定します。

    GameViewController.m

    - (IBAction)upGestureDidAction:(id)sender {
        [_scene swipe:CMSSwipeUp];
    }
    
    - (IBAction)downGestureDidAction:(id)sender {
        [_scene swipe:CMSSwipeDown];
    }
    
    - (IBAction)leftGestureDidAction:(id)sender {
        [_scene swipe:CMSSwipeLeft];
    }
    
    - (IBAction)rightGestureDidAction:(id)sender {
        [_scene swipe:CMSSwipeRight];
    }

    sk_tile_game_01_04

    ホントは、フリックを SpriteKit の GameScene の部分で解決したかったのですが、 ゴニョゴニョして試した結果けっこう厄介だったので、簡単でちょっと強引な方法でフリック処理を作りました。次回へ続く。
    ではでは。