SpriteKitでテクスチャアトラスからSKSpriteNodeを作る

SpriteKitでノード(SKNode)に画像を使いたい場合、SKSpriteNodeをテクスチャアトラスから作るのが便利です。

通常、テクスチャアトラスを作るにはたいてい専用のツールが必要で、隙間なく上手に並べたいときなどなかなか面倒だったりします。ですがXcodeだと.xcassetsファイルがその機能を自動的に実現してくれています。

使い方は簡単です。

ファイル準備

  1. .xcassetsファイルを選択
  2. アセット一覧が表示されているペインの左下部にあるプラス()ボタンをクリックして「New Sprite Atlas」を選択。テクスチャアトラスを表すフォルダ(下の画像だと右側に4つの□が並んだフォルダ)が作成される f:id:swiftlife:20160414123840p:plain
  3. あとは通常の画像と同じように、テクスチャアトラスに入れたい画像をそのフォルダに入れるだけ

f:id:swiftlife:20160414124007p:plain これで、ビルドした時に自動でテクスチャアトラスを作成し、他のアセットも含んだ.carファイルとしてアプリにバンドルしてくれます。

スプライトの作成

テクスチャアトラスからスプライトを作る場合、テクスチャ(SKTexture)を取り出し、そのテクスチャでスプライトを作成します。スプライトはSKSpriteNode(texture:)メソッドで作ります。

let atlas = SKTextureAtlas(named: "Sprites") // テクスチャアトラスのフォルダ名を指定
let texture = atlas.textureNamed("pinwheel1") // スプライトに使うテクスチャを選択
let sprite = SKSpriteNode(texture: texture)

あるいは、テクスチャに使っている名前がユニークであれば、SKTexture(imageNamed:)でいきなりテクスチャを作ることも可能です。

let texture = SKTexture(imageNamed: "pinwheel2")
let sprite = SKSpriteNode(texture: texture)

細かい設定はできませんが、とても簡単に用意できるのは便利ですね。