Swift/iOS開発入門#4_画面遷移その1

# 画面遷移
ここでは画面遷移の方法を学びます。
その中でも**NavigationContorollerr**を使ったノンコードで実装できる最も簡単な画面遷移の方法とスワイプで移動できる**Present Modaly**での画面遷移の二つを学びます。
また、遷移先のテキストを変更する方法もちょっとやります。

## NavigationControllerを使った遷移
### プロジェクトを作成する
いつも通りプロジェクトを作成してください。
名前はTransitionとかでいいと思います。
まずボタンを作成し、大きさを変えてみましょう。
下のようでできていればOKです。
![スクリーンショット 2022-08-26 16.39.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/ad7209ef-34d0-fb00-331c-fb50a82491c1.png)

### NavigationControllerを追加する。
ViewContorollerを選択した状態で、画面左上の**Editor->Embed in->NavigationController**を選択します。
![スクリーンショット 2022-08-26 16.41.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/fad03bad-958f-2c2a-16e8-157048ea5677.png)
下のように、ViewControllerの左にNavigation Controllerが出現します。
これは画面遷移専用のControllerです。
![スクリーンショット 2022-08-26 16.44.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/92fb2b06-3091-b9a1-bcf1-c4227184c514.png)

### 遷移先の画面を用意する
右上の＋ボタンで、ViewControllerを選択してドラッグアンドドロップします。
下のように今は三つの画面がある状態になりました。
![スクリーンショット 2022-08-26 16.46.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/737907e4-1bb2-ab6e-3308-129006ce034d.png)

### Buttonと新しいViewControllerを紐付ける
Buttonを選択し、Controlキーを押しながら新しいViewControllerの方にドラッグ&ドロップします。
すると、下のような選択画面が出てくるので**Show**を選択しましょう。
![スクリーンショット 2022-08-26 16.48.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/e4aa995e-c592-8616-772e-e99dc9231ab9.png)

矢印が出現するはずです。この矢印をSegueと呼びます。
さらに、新しいViewControllerの上に戻るボタンが勝手についてくれました。NavigationControllerのおかげです。
下のような状態になっていれば大丈夫です。これで実行してみましょう。
![スクリーンショット 2022-08-26 16.46.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/22647bbd-b3b2-c68a-b458-2953528c9122.png)

ボタンを押したら次の画面にいき、戻るボタンを押したら戻ってくるようになったと思います。

これで最も簡易的な画面移動は完了です。

## 遷移先に情報を渡す
Present Modalyでの遷移をやる前に、遷移先に押されたボタンの情報を渡す方法を学びます。
### ボタンを二つ用意する
下のように、ボタンを二つ、区別がつくように配置してください。（まあ、区別がつけばなんでもいいです。上の続きからやるのであれば、ボタンを一つ追加して、ボタンを変えてみてください）
ここでは、0のボタンが押されたら**０が押された**、 1のボタンが押されたら**１が押された**と次の画面に表示されるようにします。
![スクリーンショット 2022-08-31 17.21.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/f5a80b22-b50b-4bc7-0af6-c639c6cdd6a9.png)

### 次の画面に結果が表示されるLabelを配置する。
先程作った次の画面に、「0が押された」/「1が押された」を表示する用のLabelを配置してください。
![スクリーンショット 2022-08-31 17.24.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/1f03d42d-8751-fce7-9d8b-3136cae551c1.png)


### ボタンを次画面に遷移させる設定をする
ViewControllerに作った二つのボタンを押したら、今作った新しい画面へ遷移できるようにします。
上でやった**Buttonと新しいViewControllerを紐づける**と同じように、新しい画面へボタンを紐付けてください。同じようにshowを選択してください。
下のようになっていればOKです。
![スクリーンショット 2022-08-31 17.29.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/45e283b2-53f1-a762-4d8d-5bdfa4743dc3.png)

### 新しいプログラムを作成する。

Command+nを押して新しいプログラムを作成します。
**iosのcocoa touch class**を選択し、名前は**NextViewController**にしてください。
今作ったプログラムを、2個目の画面専用のプログラムにします。
下の画像で赤い丸をつけたところのように、この欄を今作った**NextViewController**に設定してください。
![スクリーンショット 2022-08-31 17.31.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/f3e5f335-40ae-e260-cc49-c3679fc203a8.png)

**Xcodeでアプリを作るときは、基本一つのViewControllerに一つのプログラムしかつきません**

### Labelをプログラムに紐づける。
新しいViewControllerと二分割したプログラム画面を開き、Labelをプログラムに紐づけます（これのやり方がわからなかったら#1に戻ってみてください)。
名前はnextlabelとかにしておいてください。

###　押されたボタンがどちらか判定する
ViewController.swiftを開いてください。
ここに次のように追加で書き足します。
```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を取得する。
次を書き足してみて、実行してみましょう。
```swift
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を割り当ててみましょう。
![スクリーンショット 2022-08-31 17.44.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/d11fde08-1617-db77-b218-d380b462b35c.png)
下のようにプログラムを書き換えて、実行してみてください。コンソールエリアにボタンが押されたのに合わせて「１」「０」と表示されるはずです。
```swift
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を以下のように書き換えます。
```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を開いてください。
以下のように書き足します。
```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 = gonext``resultGo（つまりNextViewController内）のresultを、gonextに変える。
という処理をしています。

これで完了です

### 実行する
こんな感じで、押されたボタンによってNextViewControllerの文字が変わっていれば成功です。
![スクリーンショット 2022-08-31 18.00.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2442087/e3686c5c-0a89-187c-dbfc-f3a35c01ce73.png)

## Present Modalyを使用する