SwiftでのperformSegueの使い方!初心者向け10選 – Japanシーモア

SwiftでのperformSegueの使い方!初心者向け10選

SwiftのperformSegueを使った画面遷移のイラストSwift
この記事は約25分で読めます。

 

【サイト内のコードはご自由に個人利用・商用利用いただけます】

このサービスは複数のSSPによる協力の下、運営されています。

この記事では、プログラムの基礎知識を前提に話を進めています。

説明のためのコードや、サンプルコードもありますので、もちろん初心者でも理解できるように表現してあります。

基本的な知識があればカスタムコードを使って機能追加、目的を達成できるように作ってあります。

※この記事は、一般的にプロフェッショナルの指標とされる『実務経験10,000時間以上』を凌駕する現役のプログラマチームによって監修されています。

サイト内のコードを共有する場合は、参照元として引用して下さいますと幸いです

※Japanシーモアは、常に解説内容のわかりやすさや記事の品質に注力しております。不具合、分かりにくい説明や不適切な表現、動かないコードなど気になることがございましたら、記事の品質向上の為にお問い合わせフォームにてご共有いただけますと幸いです。
(送信された情報は、プライバシーポリシーのもと、厳正に取扱い、処分させていただきます。)

はじめに

Swiftにおいて、画面遷移はアプリケーション開発における基本的な要素の一つです。

特にiOSアプリケーションの開発において、多機能なアプリを作成する場面で、異なる画面やデータをスムーズにやり取りするための手段が求められます。

ここで登場するのが「performSegue」です。

この記事では、SwiftでのperformSegueの使い方について、初心者でも理解できるように徹底的に解説していきます。

SwiftのperformSegueを使った画面遷移のイラストがサムネイルとして表示されることで、より直感的にその動作や利用法をイメージすることができるでしょう。

●SwiftのperformSegueとは

performSegueは、Swiftとその開発環境であるXcodeが提供する画面遷移のためのメソッドの一つです。

具体的には、あるViewControllerから別のViewControllerへの遷移をプログラム的に制御する際に使用されるものです。

○performSegueの基本概念

performSegueは、Storyboard上で定義されたSegueを、コードから呼び出すためのメソッドです。

Segueとは、2つのViewController間の遷移を表すもので、通常はStoryboard上でドラッグ&ドロップによって接続されます。

接続されたSegueは、特定の識別子(Identifier)を持ち、この識別子を用いてperformSegueメソッドから呼び出すことができます。

Swiftの開発では、ボタンをタップした際や、特定の条件下で自動的に次の画面へ遷移させるなど、様々なシーンで画面遷移が必要とされることが多いです。

そのような場面で、performSegueは非常に有効的な手段となります。

ただ、単純に画面を遷移させるだけではなく、遷移元から遷移先へのデータの受け渡しや、遷移の条件をプログラム的に制御することも可能です。

また、performSegueは遷移のトリガーとなるメソッドである一方、実際に遷移先のViewControllerにデータを渡す際は、prepare(for:sender:)メソッドが連携して動作します。

このメソッドは、Segueが実行される前に呼び出され、遷移先のViewControllerのインスタンスにアクセスしてデータのセットアップを行うことができます。

●performSegueの使い方

Swiftの中で画面遷移を実現するためのキーとなるのが、performSegueメソッドです。

このメソッドを使用することで、定義されたsegueをトリガーして、画面間の移動やデータの受け渡しを行うことができます。

○サンプルコード1:基本的な画面遷移

このコードでは、シンプルな画面遷移を表しています。

この例では、performSegueメソッドを使って、特定のsegueを呼び出す方法を表しています。

class ViewController: UIViewController {
    @IBAction func moveToNextScreen(_ sender: UIButton) {
        // "goToSecondScreen"はStoryboard上で定義したsegueのidentifierです
        self.performSegue(withIdentifier: "goToSecondScreen", sender: self)
    }
}

この例では、ボタンアクションとしてmoveToNextScreenを設定し、その中でperformSegueメソッドを呼び出しています。

goToSecondScreenは、Storyboard上で前もって定義されたsegueのidentifierになります。

実際に上記のコードを実行すると、ボタンをタップするとgoToSecondScreenという名前のsegueが実行され、次の画面へと遷移します。

○サンプルコード2:データを渡しながらの画面遷移

画面遷移する際、遷移先の画面に何らかのデータを渡したい場合も多いでしょう。

下記のコードは、そのようなケースを想定したものです。

class FirstViewController: UIViewController {

    @IBAction func moveToNextWithParameter(_ sender: UIButton) {
        // segueの実行
        self.performSegue(withIdentifier: "goToSecondScreenWithData", sender: "Hello Second Screen!")
    }

    // prepareメソッドをオーバーライドしてデータの受け渡しを行う
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "goToSecondScreenWithData" {
            let secondVC = segue.destination as! SecondViewController
            secondVC.receivedData = sender as? String
        }
    }
}

class SecondViewController: UIViewController {
    var receivedData: String?
}

この例では、遷移する前にprepareメソッドをオーバーライドして、遷移先のSecondViewControllerにデータを渡しています。

実行すると、ボタンをタップした際に”Hello Second Screen!”という文字列をSecondViewControllerへ渡し、その画面内のreceivedDataという変数に格納されます。

○サンプルコード3:条件分岐を使った画面遷移

すべてのボタンタップで同じ画面遷移を行うわけではありません。

条件に応じて異なる遷移を行う場合も考えられます。以下はその一例です。

class ViewController: UIViewController {

    @IBAction func conditionalMove(_ sender: UIButton) {
        if someCondition {
            self.performSegue(withIdentifier: "goToGreenScreen", sender: self)
        } else {
            self.performSegue(withIdentifier: "goToRedScreen", sender: self)
        }
    }
}

この例では、someConditionという条件式の結果に応じて、異なるsegueを実行しています。

実際に上記のコードを実行すると、条件に応じて”goToGreenScreen”または”goToRedScreen”のsegueが実行され、それぞれの画面へ遷移します。

○サンプルコード4:ボタンアクションでの画面遷移

Swiftを使用してアプリケーションを開発する際、ボタンのタップをトリガーとして画面遷移を行いたい場面は多々あります。

下記のサンプルコードは、ボタンがタップされた際に新しい画面へと遷移する方法を表しています。

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var transitionButton: UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()

        transitionButton.addTarget(self, action: #selector(transitionToNextScreen), for: .touchUpInside)
    }

    @objc func transitionToNextScreen() {
        performSegue(withIdentifier: "goToDetailScreen", sender: self)
    }
}

class DetailViewController: UIViewController {
    // 遷移先のViewControllerの内容
}

このコードでは、ViewController内にあるボタン(transitionButton)をタップしたときに、transitionToNextScreenメソッドが呼び出される仕組みを表しています。

このメソッドの中でperformSegue関数を用いて、”goToDetailScreen”というIDを持つsegueを実行して、新しい画面へと遷移しています。

続いて、実際にこのコードを実行するとどのような挙動になるかを見てみましょう。

具体的には、アプリケーションを起動し、ViewControllerが表示された際、中央のボタンをタップするとDetailViewControllerという新しい画面へと遷移します。

この時、画面遷移のアニメーションや挙動はStoryboardで設定したものに基づいて行われます。

○サンプルコード5:テーブルビューからの画面遷移

テーブルビューのセルをタップした際に、詳細画面へと遷移するケースは一般的です。

下記のサンプルコードは、テーブルビューのセルを選択することで、そのセルに関連する詳細情報を表示する画面へと遷移する方法を表しています。

import UIKit

class ListViewController: UITableViewController {

    let dataList = ["Item1", "Item2", "Item3"]

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return dataList.count
    }

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "dataCell", for: indexPath)
        cell.textLabel?.text = dataList[indexPath.row]
        return cell
    }

    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        performSegue(withIdentifier: "goToDetailFromList", sender: dataList[indexPath.row])
    }

    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "goToDetailFromList" {
            let detailVC = segue.destination as! DetailFromListViewController
            detailVC.itemDetail = sender as? String
        }
    }
}

class DetailFromListViewController: UIViewController {
    var itemDetail: String?

    // この中でitemDetailを使用して詳細情報を表示する処理を行う
}

このコードでは、テーブルビューのセルがタップされると、選択されたセルの内容に基づいてDetailFromListViewControllerへと遷移します。

実際に実行すると、テーブルビュー上でセルをタップすると詳細画面に遷移し、選択されたアイテムに関連する情報や内容が表示されます。

●performSegueの応用例

Swiftでの画面遷移を行う際、performSegueを用いることで多様な遷移を実現することができます。

初心者向けにもわかりやすいよう、ここではperformSegueの応用的な使い方について、サンプルコードを交えて詳しく解説していきます。

○サンプルコード6:遷移先のビューコントローラをカスタマイズ

通常、遷移先のビューコントローラの内容やデザインはStoryboard上で設定しますが、コードを使用してカスタマイズすることも可能です。

// ViewController.swift
import UIKit

class ViewController: UIViewController {
    @IBAction func toNextScreen(_ sender: UIButton) {
        performSegue(withIdentifier: "toNext", sender: self)
    }

    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "toNext" {
            if let nextVC = segue.destination as? NextViewController {
                // ここでNextViewControllerのプロパティやメソッドを呼び出してカスタマイズ可能
                nextVC.labelText = "こんにちは、Swift!"
            }
        }
    }
}

このコードでは、prepare(for:sender:)メソッドを使用して、遷移先のNextViewControllerlabelTextプロパティに文字列を設定しています。

この例では、遷移する際に”こんにちは、Swift!”という文字列がNextViewController上のラベルに表示されるようになります。

○サンプルコード7:アニメーションを付加した画面遷移

performSegueを用いることで、画面遷移にアニメーションを付加することもできます。

ここでは、カスタムアニメーションを追加して画面遷移を行うサンプルコードを紹介します。

// ViewController.swift
import UIKit

class ViewController: UIViewController {
    @IBAction func toNextScreenWithAnimation(_ sender: UIButton) {
        performSegue(withIdentifier: "toNextWithAnimation", sender: self)
    }

    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "toNextWithAnimation" {
            let transition = CATransition()
            transition.duration = 0.5
            transition.type = CATransitionType.push
            transition.subtype = CATransitionSubtype.fromRight
            view.window!.layer.add(transition, forKey: kCATransition)
        }
    }
}

このコードでは、prepare(for:sender:)メソッド内でCATransitionを使用してアニメーションを定義しています。

この例では右からのPushアニメーションを付加して、新しいビューコントローラが表示されます。

○サンプルコード8:遷移先での戻るボタンのカスタマイズ

画面遷移を使う際、遷移先の画面に「戻る」ボタンを表示することがよくあります。

iOSアプリ開発において、Navigation Controllerを使って画面遷移を行う場合、デフォルトで戻るボタンが表示されます。

しかし、このボタンのタイトルやスタイルを変更したい場合もあるでしょう。

下記のコードでは、遷移先のViewControllerで戻るボタンのカスタマイズを行う方法を表しています。

import UIKit

class SecondViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // 戻るボタンのタイトルを「Topに戻る」とする
        self.navigationController?.navigationBar.topItem?.backBarButtonItem = UIBarButtonItem(title: "Topに戻る", style: .plain, target: nil, action: nil)
    }
}

このコードではSecondViewControllerviewDidLoadメソッド内で、Navigation Controllerの戻るボタンのタイトルを「Topに戻る」と変更しています。

この例では、ボタンのタイトルだけを変更していますが、アイコンや色などもカスタマイズすることが可能です。

このコードを実行すると、遷移先の画面のナビゲーションバーに「Topに戻る」というタイトルの戻るボタンが表示されます。

デフォルトの「Back」ではなく、わかりやすいタイトルを設定することで、ユーザーエクスペリエンスの向上が期待できます。

○サンプルコード9:複数のsegueを管理する方法

アプリケーションが成長するにつれて、一つのViewControllerから複数の遷移先へのsegueが増えてくることが考えられます。

その際、どのsegueがどの画面遷移に対応しているのかを正確に管理することが重要です。

下記のコードでは、複数のsegueを管理する方法を表しています。

import UIKit

class FirstViewController: UIViewController {

    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        // segueのidentifierを使用して、遷移先を判定
        if segue.identifier == "goToSecond" {
            // 遷移先がSecondViewControllerの場合の処理
            let destinationVC = segue.destination as! SecondViewController
            destinationVC.data = "Data for SecondViewController"
        } else if segue.identifier == "goToThird" {
            // 遷移先がThirdViewControllerの場合の処理
            let destinationVC = segue.destination as! ThirdViewController
            destinationVC.data = "Data for ThirdViewController"
        }
    }
}

このコードではprepare(for:sender:)メソッドをオーバーライドして、複数のsegueを管理しています。

segueのidentifierを使用して、どのsegueが実行されたのかを判定し、それに応じて適切な遷移先のViewControllerの設定を行っています。

このコードを実行すると、FirstViewControllerからそれぞれ異なる遷移先へのデータの渡し方ができるようになります。

segueのidentifierを適切に命名し、管理することで、複数の画面遷移をスムーズに行うことが可能となります。

○サンプルコード10:Storyboardを使わずコードのみでの遷移

Swiftの中で、画面遷移を行う方法はStoryboardを使用する方法だけではありません。コードのみで画面遷移を実装する方法もあります。

下記のコードでは、Storyboardを使わずに、コードのみで画面遷移を行う方法を表しています。

import UIKit

class FirstViewController: UIViewController {

    @IBAction func moveToSecond(_ sender: UIButton) {
        let secondVC = SecondViewController()
        self.navigationController?.pushViewController(secondVC, animated: true)
    }
}

このコードでは、ボタンのアクションメソッド内で、新しいSecondViewControllerのインスタンスを生成し、pushViewController(_:animated:)メソッドを使用して画面遷移を行っています。

Storyboardを使用せず、コードのみでの遷移が可能です。

このコードを実行すると、FirstViewController上のボタンをタップすると、SecondViewControllerへと遷移します。

Storyboardを使わない遷移は、動的な画面遷移や複雑な遷移を実装する際に便利です。

●注意点と対処法

SwiftのperformSegueを使った画面遷移を行う際、いくつかの注意点があります。

これらの問題を未然に防ぐための対処法やベストプラクティスを紹介します。

○循環参照を避ける方法

Swiftでの画面遷移において、View Controller間の参照が循環することで、メモリの不要な消費やアプリの不安定性を引き起こす可能性があります。

循環参照が発生すると、オブジェクトがメモリから解放されず、メモリリークの原因となります。

具体的には、A画面からB画面へ遷移する際に、B画面がA画面の参照を保持していると、循環参照が発生します。

この問題を解消するための対処法として、weakキーワードを使った参照の保持が考えられます。

weakキーワードを使うことで、オブジェクトの参照を弱参照として保持し、循環参照を防ぐことができます。

例えば、B画面がA画面のデリゲートとして動作する場合、次のようにコードを記述することが考えられます。

// A画面
class AViewController: UIViewController, BViewControllerDelegate {
    // B画面への遷移処理
    func moveToB() {
        let bViewController = BViewController()
        bViewController.delegate = self
        navigationController?.pushViewController(bViewController, animated: true)
    }
}

// B画面
protocol BViewControllerDelegate: AnyObject {}

class BViewController: UIViewController {
    weak var delegate: BViewControllerDelegate?
}

このコードでは、B画面のデリゲートプロパティがweakキーワードによって弱参照として保持されているため、循環参照を避けることができます。

○メモリリークを防ぐポイント

前述した循環参照のほかにも、メモリリークを引き起こす可能性があるポイントがいくつか存在します。

□クロージャのキャプチャリスト

クロージャ内でselfを強参照としてキャプチャすると、メモリリークが発生するリスクがあります。

これを避けるためには、キャプチャリストを利用してselfを弱参照または非所有参照としてキャプチャします。

button.addAction { [weak self] _ in
    self?.performSegue(withIdentifier: "ToNextScreen", sender: nil)
}

この例では、キャプチャリスト[weak self]を使用して、selfを弱参照としてキャプチャしています。

□通知の解除忘れ

NotificationCenterを使用して通知を受信する際、removeObserverを呼び出さずにオブジェクトが解放されると、メモリリークが発生します。

deinitメソッド内で通知の解除を行うようにしましょう。

class SampleViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        NotificationCenter.default.addObserver(self, selector: #selector(handleNotification), name: .someNotification, object: nil)
    }

    deinit {
        NotificationCenter.default.removeObserver(self)
    }

    @objc func handleNotification(_ notification: Notification) {
        // 通知を受け取った時の処理
    }
}

この例では、deinitメソッド内で通知の解除を行っています。

●カスタマイズ方法

Swiftでの画面遷移において、performSegueは非常に便利なメソッドです。

しかし、ただ遷移するだけでなく、遷移時のアニメーションや、遷移先のビューコントローラのレイアウトなどをカスタマイズすることも可能です。

ここでは、そのカスタマイズ方法について詳しく解説していきます。

○遷移アニメーションの変更方法

Swiftでは、遷移時のアニメーションをカスタマイズするための方法が提供されています。

アニメーションの種類や速度などを変更することができるので、アプリのユーザーエクスペリエンスを向上させることが可能です。

このコードでは、カスタムの遷移アニメーションを設定して、画面遷移を行う方法を表しています。

この例では、UIViewControllerAnimatedTransitioningプロトコルを採用してカスタムアニメーションを作成しています。

class CustomSegueAnimation: NSObject, UIViewControllerAnimatedTransitioning {
    // アニメーションの期間を設定
    func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval {
        return 0.5
    }

    // アニメーションの詳細を定義
    func animateTransition(using transitionContext: UIViewControllerContextTransitioning) {
        guard let toViewController = transitionContext.viewController(forKey: .to) else { return }
        let finalFrame = transitionContext.finalFrame(for: toViewController)

        toViewController.view.frame = finalFrame.offsetBy(dx: 0, dy: -finalFrame.height)
        transitionContext.containerView.addSubview(toViewController.view)

        UIView.animate(withDuration: transitionDuration(using: transitionContext), animations: {
            toViewController.view.frame = finalFrame
        }) { (completed) in
            transitionContext.completeTransition(true)
        }
    }
}

このコードを使用することで、画面が上から下にスライドして現れるアニメーションが実現できます。

アニメーションの期間はtransitionDurationメソッドで設定しています。

このカスタムアニメーションを実際に遷移時に使用するためには、UINavigationControllerDelegatenavigationController(_:animationControllerFor:from:to:)メソッドを使用して、このカスタムアニメーションを返すように設定します。

○遷移先ビューコントローラのレイアウト変更方法

遷移先のビューコントローラのレイアウトやデザインをカスタマイズすることも、SwiftのperformSegueを使用する場面でよく行われるカスタマイズの一つです。

このコードでは、遷移先のビューコントローラの背景色を変更しています。

この例では、遷移先のビューコントローラのviewDidLoadメソッド内で背景色を変更しています。

class DestinationViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()

        // 背景色を赤色に変更
        self.view.backgroundColor = .red
    }
}

このようにして、遷移先のビューコントローラの背景色が赤色になります。

この方法を利用すれば、ラベルのテキストやボタンのデザインなど、様々なカスタマイズを遷移先のビューコントローラに対して行うことができます。

まとめ

SwiftでのperformSegueの使い方に関して詳しく解説しました。

このメソッドは、画面遷移を行う際の非常に有効な手段となります。

基本的な画面遷移から、データの受け渡しや条件分岐を用いた遷移、さらにはカスタマイズ方法まで、多岐にわたる内容を学ぶことができたかと思います。

特に、遷移時のアニメーションのカスタマイズや、遷移先のビューコントローラのレイアウト変更方法など、アプリのユーザーエクスペリエンスを向上させるためのテクニックは、日々の開発において非常に役立ちます。

SwiftのperformSegueを使用する際の注意点や応用例も紹介しましたので、これらの知識を活かして、より使いやすく、見栄えの良いアプリの開発を進めていくことができるでしょう。

これまでの内容を踏まえて、Swiftでの画面遷移をスムーズに実装し、カスタマイズの方法や注意点についてもしっかりと理解しておくことで、アプリ開発の幅がさらに広がることを願っています。