2017年9月15日金曜日

SpriteKit で segue を使って別の UIView に遷移する方法

概要

UIKit を使っていると storyboard + segue で各 View の遷移を行います
SpriteKit を使っていてもこの segue が使うことができます
今回はその方法を紹介します

環境

  • macOS X 10.12.6
  • Xcode 8.3.3 (8E3004b)

遷移する先の ViewController を作成する

Main.storyboard を編集して ViewController を追加しましょう (OtherViewControoler)
とりあえず元の View に戻るためにナビゲーションバーを追加してボタンを設置しました

あとはその ViewController 用のクラスも作成します

  • OtherViewController.swift
import UIKit

class OtherViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    @IBAction func unwindToTop(segue: UIStoryboardSegue) {
        print("push")
    }

    @IBAction func back(_ sender: Any) {
        print("push")
        self.dismiss(animated: true, completion: nil)
    }
}

設置したボタンに IBAction を登録しましょう
そして dismiss をコールすることで元の View に戻るようにしています
最終的に以下のようにしました

spritekit_with_segue1.png

SKScene から segue をコールして遷移する

まず Main.storyboard で segue を作成します
先ほど作成した先の UIViewController に対して segue を張りましょう

そして segue に ID を振ります
今回は to_other_vc としました

spritekit_with_segue2.png

そしてこの segue を SKScene 側で使うことで画面遷移させることができます

  • MoveScene.swift
import SpriteKit

class MoveScene: SKScene {

    var move = SKSpriteNode()

    override func didMove(to view: SKView) {
        move = self.childNode(withName: "move") as! SKSpriteNode
    }

    func touchDown(atPoint pos : CGPoint) {
        if let node = atPoint(pos) as? SKSpriteNode {
            if(node == move){
                if let view = self.view {
                    let vc = view.window?.rootViewController;
                    vc?.performSegue(withIdentifier: "to_other_vc", sender: nil)
                }
            }
        }
    }

    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        for t in touches { self.touchDown(atPoint: t.location(in: self)) }
    }
}

画面を遷移するノードをタップしたら view から rootViewController を取得します
それが ViewController になっているのであとは segue を使って画面を遷移することができる performSegue をコールするだけです
その際に先ほど segue に設定した ID を指定します

動作確認

こんな感じで動くと思います
spritekit_with_segue3.gif

最後に

SpriteKit で segue を使ってデフォルトの GameViewController 以外の UIViewController に遷移させてみました

ライブラリによっては UIViewController 上で動くように作られているものもあり SpriteKit 上では動かすのが大変な場合があります
そんな場合に今回の方法でゲーム以外の用途の別の UIViewController を呼び出してそちらで描画など行うことができます

知っておくと結構便利な機能かなと思います

参考サイト

0 件のコメント:

コメントを投稿