画面遷移
ここでは画面遷移の方法を学びます。
その中でもNavigationContorollerrを使ったノンコードで実装できる最も簡単な画面遷移の方法とスワイプで移動できるPresent Modalyでの画面遷移の二つを学びます。
また、遷移先のテキストを変更する方法もちょっとやります。
NavigationControllerを使った遷移
プロジェクトを作成する
いつも通りプロジェクトを作成してください。
名前はTransitionとかでいいと思います。
まずボタンを作成し、大きさを変えてみましょう。
下のようでできていればOKです。
NavigationControllerを追加する。
ViewContorollerを選択した状態で、画面左上のEditor->Embed in->NavigationControllerを選択します。
下のように、ViewControllerの左にNavigation Controllerが出現します。
これは画面遷移専用のControllerです。
遷移先の画面を用意する
右上の＋ボタンで、ViewControllerを選択してドラッグアンドドロップします。
下のように今は三つの画面がある状態になりました。
Buttonと新しいViewControllerを紐付ける
Buttonを選択し、Controlキーを押しながら新しいViewControllerの方にドラッグ&ドロップします。
すると、下のような選択画面が出てくるのでShowを選択しましょう。
矢印が出現するはずです。この矢印をSegueと呼びます。
さらに、新しいViewControllerの上に戻るボタンが勝手についてくれました。NavigationControllerのおかげです。
下のような状態になっていれば大丈夫です。これで実行してみましょう。
ボタンを押したら次の画面にいき、戻るボタンを押したら戻ってくるようになったと思います。
これで最も簡易的な画面移動は完了です。
遷移先に情報を渡す
Present Modalyでの遷移をやる前に、遷移先に押されたボタンの情報を渡す方法を学びます。
ボタンを二つ用意する
下のように、ボタンを二つ、区別がつくように配置してください。（まあ、区別がつけばなんでもいいです。上の続きからやるのであれば、ボタンを一つ追加して、ボタンを変えてみてください）
ここでは、0のボタンが押されたら０が押された、 1のボタンが押されたら１が押されたと次の画面に表示されるようにします。
次の画面に結果が表示されるLabelを配置する。
先程作った次の画面に、「0が押された」/「1が押された」を表示する用のLabelを配置してください。
ボタンを次画面に遷移させる設定をする
ViewControllerに作った二つのボタンを押したら、今作った新しい画面へ遷移できるようにします。
上でやったButtonと新しいViewControllerを紐づけると同じように、新しい画面へボタンを紐付けてください。同じようにshowを選択してください。
下のようになっていればOKです。
新しいプログラムを作成する。
Command+nを押して新しいプログラムを作成します。
iosのcocoa touch classを選択し、名前はNextViewControllerにしてください。
今作ったプログラムを、2個目の画面専用のプログラムにします。
下の画像で赤い丸をつけたところのように、この欄を今作ったNextViewControllerに設定してください。
Xcodeでアプリを作るときは、基本一つのViewControllerに一つのプログラムしかつきません
Labelをプログラムに紐づける。
新しいViewControllerと二分割したプログラム画面を開き、Labelをプログラムに紐づけます（これのやり方がわからなかったら#1に戻ってみてください)。
名前はnextlabelとかにしておいてください。
### 押されたボタンがどちらか判定する
ViewController.swiftを開いてください。
ここに次のように追加で書き足します。
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
}
//これを追記
@IBAction func ButtonAction(sender: UIButton){
}
}
さらに、ViewController.swiftとmain.storybordを二分割して、二つのボタンをcontrolを押しながら今追記したところにドラッグ&ドロップしましょう。
そうすると、この関数と二つのボタンが紐づくはずです。
この関数の意味は、ざっくり説明すると「このボタンが押されたとき」です。
tagを取得する。
次を書き足してみて、実行してみましょう。
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
}
@IBAction func ButtonAction(sender: UIButton){
//これを追記
print(sender.tag)
}
}
print(sender.tag)これはボタンについてあるタグを出力するという意味です。
tagの設定はボタンのInspector（下の画像のところ）から設定します。
これを「０が押されたボタン」には0、「１が押されたボタン」には1を割り当ててみましょう。
下のようにプログラムを書き換えて、実行してみてください。コンソールエリアにボタンが押されたのに合わせて「１」「０」と表示されるはずです。
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
}
@IBAction func ButtonAction(sender: UIButton){
if sender.tag == 0{
print(sender.tag)
}
if sender.tag == 1{
print(sender.tag)
}
}
}
違うプログラムの変数を取得する
違うプログラムの変数を取得するのはUnityでも難しいスキルの一つでした。
Swiftも同じように少し難しいです。
まずはNextViewController.swiftを以下のように書き換えます。
import UIKit
class NextViewController: UIViewController {
var result = ""
@IBOutlet weak var nextlabel: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
nextlabel.text = result
// Do any additional setup after loading the view.
}
}
このまま実行しても、Labelは変更しません。
var result = ""がポイントで、この変数をViewController.swiftでいじって変化させます。
それをnextlabel.text = resultで出力します。
次に、ViewController.swiftを開いてください。
以下のように書き足します。
import UIKit
class ViewController: UIViewController {
var gonext = "移動した!"
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
}
@IBAction func ButtonAction(sender: UIButton){
if sender.tag == 0{
gonext = "0が押された！"
}
if sender.tag == 1{
gonext = "1が押された！"
}
}
//ここでgonextをNextViewController.swiftのresultに代入する
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
let resultGo = segue.destination as! NextViewController
resultGo.result = gonext
}
}
順番に説明します。
①まずは変数gonextを作成します。
②次に、押されたボタンによってgonextの中身を変えます。
ここまでは簡単だと思います。問題は次です。
③override func prepare(for segue: UIStoryboardSegue, sender: Any?){}Segue実行時に呼び出される関数
④let resultGo = segue.destination as! NextViewControllerで、resultGoをNextViewCotroller内の変数を利用可能にする
⑤resultGo.result = gonextresultGo（つまりNextViewController内）のresultを、gonextに変える。
という処理をしています。
これで完了です
実行する
こんな感じで、押されたボタンによってNextViewControllerの文字が変わっていれば成功です。
