【SpriteKit】キャラクターを画面に表示してみた

こんにちは、のっくんです。

今日からiPhoneのゲームアプリを開発していこうと思います。

私はロックマンが好きなので、ロックマンのような２Dゲームを作りたいと思っています。

ゲーム開発はしたことがないので完全素人ですが、チャレンジしてみます。

SwiftにはSpriteKitという便利なゲーム用のフレームワークがありますのでこれを使って作っていきます。

環境はXcode11,Swift5です。

プロジェクトを作る

プロジェクトを作ります。Gameを選択。

GameViewController

GameSceneのサイズをViewに合わせて調整します。

シーンのサイズ調整をしないと、アプリを実行したときにキャラクターが画面に表示されなかったので、忘れないようにやっておきたいですね。

class GameViewController: UIViewController {

     override func viewWillLayoutSubviews() {
          super.viewWillLayoutSubviews()
          
          if let view = self.view as! SKView?{
              if let scene = SKScene(fileNamed: "GameScene"){
                  scene.scaleMode = .aspectFill
                  scene.size = view.bounds.size
                  view.presentScene(scene)
              }
              view.ignoresSiblingOrder = true
              view.showsFPS = true
              view.showsNodeCount = true
          }
      }

    override var shouldAutorotate: Bool {
        return true
    }

    override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
        return .landscape
    }

    override var prefersStatusBarHidden: Bool {
        return true
    }
}

あとは、ノード数を表示したり、FPSの表示設定などを行なっています。

キャラクターを設定する

ゲームを作る上で１番大事なのは主人公キャラクターです。

今回は、走る、歩く、銃を撃つ、などのアクションを想定しているので、それっぽいキャラクターを無料で以下のサイトからダウンロードしました。

https://craftpix.net

ほとんど有料ですが無料のものもあります。

無料のものはメールアドレスを登録するとダウンロードできます。

Assets.xcassetsで、右クリック、「New Sprite Atras」で新しいフォルダを作成します。

その中にダウンロードした画像をドラッグ＆ドロップして取り込みます。

次にこのキャラのクラスを作ります。（Nokkuman.swift）

import SpriteKit

class Nokkuman :SKSpriteNode{
    // SKTextureで画像を指定します。
    let mytexture = SKTexture(imageNamed: "2_entity_000_IDLE_000")
    // キャラクターのサイズを指定します。
    let initialSize = CGSize(width: 64, height: 64)
    // キャラクターの位置を指定します。
    let initialPosition = CGPoint(x: 100, y: 100)
    
    init() {
        super.init(texture: mytexture, color: .clear, size: initialSize)
        self.position = initialPosition
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

ゲームに登場する物体をNode、ゲームで使用する画像はTextureと呼ばれます。

Texture、サイズ、位置情報などを設定します。

ゲーム画面でキャラクターを表示するには、以下のようにします。

class GameScene: SKScene {
    
    let nokkuman = Nokkuman()
    
    override func didMove(to view: SKView) {
        
        self.anchorPoint = .zero
        self.backgroundColor = UIColor(red: 0.4, green: 0.6, blue: 0.95, alpha: 1.0)
        
        self.addChild(nokkuman)
        
    }
}

Xcodeで実行すると以下の画面が表示されます。

やりましたね！

これで最初の一歩が踏み出せました。