Xcode8 Swift3에서 스토리 보드를 사용한 화면 전환

할 일

Swift에서 스토리 보드를 사용한 화면 전환
우선 간단한 화면 천이라고 하는 것으로, 화면 천이전에 입력 체크를 해, 다음의 화면에 값을 건네주고, 화면 천이처에서 받은 값을 표시한다

개발 환경

Xcode 8
Swift 3

프로젝트 구성

이번 편집한 것은, 이하의 3 파일

Main.storyboard

FirstViewController.swift

SecondViewController.swift

Storyboard 설정

UIViewController를 2개 작성해, 각각 후술하는 FirstViewController , SecondViewController 라고 끈다FirstViewController 에는 다음의 3 개의 컨트롤을 배치

인사말 선택 Picker View

인사를 하는 사람의 이름 입력하기 Text Field

다음 화면으로 전환하는 Button (나중에 Segue를 설정하겠습니다).
SecondViewController 에는 다음의 3 개의 컨트롤을 배치

Navigation Bar

이전 화면으로 돌아가기 위한 Bar Button Item (나중에 Unwind Segue의 설정하겠습니다)

인사말 보기 Label

화면 전환 설정FirstViewController 의 '인사' 버튼을 control 키를 누른 상태에서 SecondViewController


위에서 만든 Segue의 identifier에 이름을 붙인다.

출처

FirstViewController.swift

import Foundation
import UIKit

class FirstViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {
    @IBOutlet weak var greetingType: UIPickerView!
    @IBOutlet weak var greetingTo: UITextField!

    let greetingTypes = ["おはよう", "こんにちは", "こんばんは"]
    var selectedGreetingType: String = ""

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

    /// 画面遷移するかの判定処理
    override func shouldPerformSegue(withIdentifier identifier: String, sender: Any?) -> Bool {
        if (identifier == "toSecondSegue") {
            if (self.greetingTo.text?.isEmpty)! {
                let alert = UIAlertController(title: "入力エラー", message: "名前を入力してください", preferredStyle: .alert)
                alert.addAction(UIAlertAction(title: "OK", style: .default))
                self.present(alert, animated: true, completion: nil)
                return false;
            }
        }
        return true;
    }

    /// 画面遷移時の処理
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if (segue.identifier == "toSecondSegue") {
            let secondViewController:SecondViewController = segue.destination as! SecondViewController
            let selectedRow = self.greetingType.selectedRow(inComponent: 0)
            secondViewController.greetingType = self.greetingTypes[selectedRow]
            secondViewController.greetingTo = self.greetingTo.text!
        }
    }

    /// Storyboadでunwind sequeを引くために必要
    @IBAction func unwindToFirstView(segue: UIStoryboardSegue) {
    }

    /// 以下は挨拶選択を作成している
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 1
    }

    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        return greetingTypes.count
    }

    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
        return greetingTypes[row]
    }

    func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
        self.selectedGreetingType = greetingTypes[row]
    }
}

화면 천이 판정show 가 화면 천이 판정용의 메소드로, false 를 되돌리면 화면 천이를 취소한다
파라미터의 shouldPerformSegue(withIdentifier) 에 Storyboard로 Segue에 붙인 값을 받을 수 있으므로, 화면 천이처가 복수 있는 경우는, 이 값으로 처리를 분기시킨다
이번에는 이름(Text Field)이 입력되어 있지 않은 경우, 경고를 내고 화면 천이를 중지한다

화면 전환 처리identifier 가 화면 천이시의 메소드
파라미터의 prepare(for segue) 가 화면 천이처의 객체가 되어 있어 이전과 같이 segue 로 천이처를 판정하는지, 목적지를 판단할 수도 있다
이번은 segue.identifier 로 천이처를 특정해, segue.destination 를 천이처의 segue.identifier 클래스에 캐스트 해 필요한 값을 건네준다

전환 목적지에서 복귀 처리segue.destination 는 Storyboard로 돌아가는 선을 그리는 데 필요한 메소드SecondViewController 를 붙인 메소드로 파라미터를 unwindToFirstView 로 한다(메서드명은 자유롭게 붙일 수 있다)
닫는 처리 등은 특별히 기술할 필요가 없기 때문에, 돌려줄 때의 처리가 특별히 필요하지 않으면 메소드는 비어 있는 채로 좋다
뒤로 버튼이 있다.

메서드를 만들면 Storyboard를 열고 @IBAction 의 '뒤로' 버튼을 segue: UIStoryboardSegue 선택



SecondViewController.swift

import Foundation
import UIKit

class SecondViewController: UIViewController {
    @IBOutlet weak var greetingLabel: UILabel!

    var greetingType: String = ""
    var greetingTo: String = ""

    override func viewDidLoad() {
        super.viewDidLoad()

        self.greetingLabel.text = String(format: "%@ %@さん", self.greetingType, self.greetingTo)
    }
}

전환 대상
화면 전이시의 값을 받을 수 있도록 SecondViewController , FirstViewController 의 2 개의 변수를 선언해 두고,

완성된 것

화면 시작 시

그대로 「인사」하는 버튼을 탭(입력 에러)

인사를 철회하고 이름도 입력

화면 전환