SpriteKitチュートリアルをやってみる 其の三

イントロダクション

前回、参考サイトを見ながら、*.sksファイルの作成を行いました。
画面の作成テンプレート(*.sks)をXCodeのUI上で作成いたしました。

だけども肝心のコードにはほぼ何も触れていませんでした。

コードに触れる

今回は、swiftファイルの作成方法を確認した後の部分から入ります。
※TitlePage.swiftを作成しましたがこれは使用しません。

TitlePage.sksの画像が全て画面に表示されました。
今度は、アニメーションを追加します。
以下は、シュミレータで今までに作成したものを起動して確認した状態です。

これまで作成していた「TitlePage.sks」からを開いてください。
以下の様な画面が見れるはずです。

因みに、左側には各ボタンなどのスプライトの名前とイメージが参照できる様になっていますのでアニメーションさせる対象を間違うと想定外のスプライトが動きます。

アニメーションの作成画面です。
右端のメディアファイルの一覧より、Move Actionをドラッグ&ドロップします。

下の様になるはずです。そして、

Moveを選択すると以下のプロパティ選択画面が見れると思います。

上記の様に入力して、「Animate」ボタンを押下するとアニメーションが見れます。

細かい部分は参考サイトを参照してください。

そして「TitlePage.sks」から「Scene01.sks」を参照いたします。

上記の様な感じの画面が見れるはずです。
そして、Footer.sksを開きます。
中身は何もありません。
TitlePage.sksと同じ要領で、button_previous, button_next and button_sound_on

をドラッグ&ドロップして追加してください。
それから改めて「Scene01.sks」を開いてみると

フッターができているではないですか⭐︎

各ファイルの関係

ここで、今までのファイルの関係をまとめます。(CustomClass名)

GameScene.sks → 未使用
GameScene.swift → TitlePage.sksのCustom Classに指定している(GameScene)
GameViewController → sksロード処理を行う
TitlePage.sks → トップページ(TitlePage)
Scene01.sks  →  ２番目のページ : Footer.sksをインクルードする
Footer.sks.      →  ２番目のフッター部分ページ(footer)

※影が薄いファイルは赤字にしてあります。

全体としては以下の様になっています。

そして、以下のコードを追加します

In GameScene.swift, add these properties to GameScene:

var footer:SKNode!

var btnNext: SKSpriteNode!

var btnPrevious: SKSpriteNode!

var btnSound: SKSpriteNode!

var btnHome: SKSpriteNode!

Each of these properties will match a sprite in Footer.sks. To connect them, add this method at the bottom:

override func sceneDidLoad() {

  super.sceneDidLoad()

  footer = childNode(withName: "footer")

}

この時点で、下部にあるボタンの処理がつながりました。(実装済)
これでうまくいくはず。。。

結果は、自分でやってみるか次回を待て(笑)