iOS Storyboard 呈现 Segues“关系、嵌入、推送、模式、自定义”类型

IOS

IOS Storyboard 是一种用来设计和管理应用界面的工具，它使用视图控制器之间的 Segues 来定义不同界面之间的导航关系。Segues 可以分为五种类型：关系、嵌入、推送、模态和自定义。本文将详细介绍这五种类型，并提供相应的案例代码。

关系（Relationship）类型

关系类型的 Segues 用于在不同的视图控制器之间建立父子关系。一个视图控制器可以拥有多个子视图控制器，通过关系类型的 Segues 可以在父视图控制器中嵌入子视图控制器，并实现不同层级的导航。例如，一个购物应用的主界面中包含了多个子界面，如商品列表、购物车和用户信息等。我们可以使用关系类型的 Segues 将这些子界面嵌入到主界面中，实现方便的导航。

下面是一个简单的案例代码，演示了如何使用关系类型的 Segues 在主界面中嵌入子界面：

Swift
class MAInViewController: UIViewController {
    
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "EmbedChildViewController" {
            if let childViewController = segue.destination as? ChildViewController {
                // 设置子界面的相关属性
            }
        }
    }
}

嵌入（Embed）类型

嵌入类型的 Segues 用于将一个视图控制器嵌入到另一个视图控制器中作为其一部分显示。与关系类型不同的是，嵌入类型的 Segues 并不会建立父子关系，而是将子视图控制器作为容器视图控制器的一部分进行显示。例如，一个新闻应用的主界面中包含了多个不同类型的新闻模块，我们可以使用嵌入类型的 Segues 将这些新闻模块嵌入到主界面的容器视图中，实现多个模块的同时显示。

下面是一个简单的案例代码，演示了如何使用嵌入类型的 Segues 将一个新闻模块嵌入到主界面的容器视图中：

Swift
class MAInViewController: UIViewController {
    
    @IBOutlet weak var contAInerView: UIView!
    
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "EmbedNewsModule" {
            if let newsViewController = segue.destination as? NewsViewController {
                // 设置新闻模块的相关属性
            }
        }
    }
}

推送（Push）类型

推送类型的 Segues 用于在导航控制器中进行页面的推送操作。当用户点击一个按钮或者选择一个表格行等交互操作时，推送类型的 Segues 可以将当前视图控制器推入导航控制器的栈中，并显示下一个目标视图控制器。例如，一个社交应用的消息列表界面中，当用户点击某个消息时，可以使用推送类型的 Segues 将当前消息界面推入导航控制器的栈中，显示消息的详细内容。

下面是一个简单的案例代码，演示了如何使用推送类型的 Segues 在导航控制器中进行页面的推送操作：

Swift
class MessagesViewController: UITableViewController {
    
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        performSegue(withIdentifier: "PushMessageDetAIl", sender: indexPath)
    }
    
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "PushMessageDetAIl" {
            if let indexPath = sender as? IndexPath,
                let messageDetAIlViewController = segue.destination as? MessageDetAIlViewController {
                let selectedMessage = messages[indexPath.row]
                messageDetAIlViewController.message = selectedMessage
            }
        }
    }
}

模态（Modal）类型

模态类型的 Segues 用于以模态方式显示一个视图控制器，覆盖在原有界面之上，并且需要用户进行操作才能返回到原有界面。模态类型的 Segues 适用于一些需要用户输入或者确认的操作，例如登录界面、设置界面等。当模态视图控制器被显示时，原有的视图控制器会被暂时挂起，直到用户完成操作并关闭模态视图控制器。

下面是一个简单的案例代码，演示了如何使用模态类型的 Segues 显示一个登录界面并获取用户输入的用户名和密码：

Swift
class MAInViewController: UIViewController {
    
    @IBAction func loginButtonTapped(_ sender: UIButton) {
        performSegue(withIdentifier: "PresentLogin", sender: self)
    }
    
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "PresentLogin" {
            if let loginViewController = segue.destination as? LoginViewController {
                loginViewController.delegate = self
            }
        }
    }
}
extension MAInViewController: LoginViewControllerDelegate {
    func loginViewControllerDidFinishLogin(_ viewController: LoginViewController, username: String, password: String) {
        // 处理登录成功后的操作
        dismiss(animated: true, completion: nil)
    }
}

自定义（Custom）类型

自定义类型的 Segues 是一种灵活的方式，可以根据应用的需求自定义界面之间的导航操作。使用自定义类型的 Segues，开发者可以通过编写自定义的 Segue 类来实现特定的导航效果。例如，一个图片浏览应用中，可以使用自定义类型的 Segues 实现图片之间的切换效果，如淡入淡出、滑动等。

下面是一个简单的案例代码，演示了如何使用自定义类型的 Segues 实现一个图片切换的效果：

首先，创建一个自定义的 Segue 类 CustomImageSegue.Swift：

Swift
class CustomImageSegue: UIStoryboardSegue {
    
    override func perform() {
        guard let contAInerView = source.view.superview else { return }
        
        let sourceView = source.view
        let destinationView = destination.view
        
        contAInerView.addSubview(destinationView!)
        destinationView?.alpha = 0.0
        
        UIView.animate(withDuration: 0.5, animations: {
            sourceView?.alpha = 0.0
            destinationView?.alpha = 1.0
        }) { (_) in
            source.present(destination, animated: false, completion: nil)
        }
    }
}

然后，在 Storyboard 中将 Segue 类型设置为 Custom，并将自定义的 Segue 类 CustomImageSegue 关联到对应的视图控制器之间的 Segue 上。

通过以上五种类型的 Segues，开发者可以灵活地设计和管理应用界面之间的导航关系，实现丰富多样的交互效果。无论是通过关系类型的 Segues 嵌入子视图控制器，还是使用推送类型的 Segues 在导航控制器中实现页面的推送操作，亦或是通过模态类型的 Segues 显示模态视图控制器，以及自定义类型的 Segues 实现特定的导航效果，都可以根据应用的需求选择合适的 Segue 类型进行开发。