Cách thêm Chế độ xem vùng chứa theo chương trình

Có thể dễ dàng thêm Chế độ xem vùng chứa vào bảng phân cảnh thông qua Trình chỉnh sửa giao diện. Khi được thêm vào, Chế độ xem vùng chứa là một chế độ xem trình giữ chỗ, một phân đoạn nhúng và một bộ điều khiển chế độ xem (con).

Tuy nhiên, tôi không thể tìm cách thêm Chế độ xem vùng chứa theo chương trình. Trên thực tế, tôi thậm chí không thể tìm thấy một lớp học có tên UIContainerViewnhư vậy.

Một cái tên cho lớp Chế độ xem vùng chứa chắc chắn là một khởi đầu tốt. Một hướng dẫn đầy đủ bao gồm cả segue sẽ được đánh giá cao.

_{Tôi biết Hướng dẫn lập trình bộ điều khiển chế độ xem, nhưng tôi không coi nó giống như cách Trình tạo giao diện thực hiện cho Trình xem vùng chứa. Ví dụ: khi các ràng buộc được đặt đúng cách, dạng xem (con) sẽ thích ứng với các thay đổi về kích thước trong Dạng xem vùng chứa.}

"Chế độ xem vùng chứa" trong bảng phân cảnh chỉ là một UIViewđối tượng tiêu chuẩn . Không có kiểu "chế độ xem vùng chứa" đặc biệt. Trên thực tế, nếu bạn nhìn vào phân cấp chế độ xem, bạn có thể thấy rằng "chế độ xem vùng chứa" là một tiêu chuẩn UIView:

Để đạt được điều này theo chương trình, bạn sử dụng "chức năng ngăn bộ điều khiển chế độ xem":

• Khởi tạo bộ điều khiển chế độ xem trẻ em bằng cách gọi instantiateViewController(withIdentifier:) đối tượng bảng phân cảnh.
• Gọi addChild trong bộ điều khiển chế độ xem cha mẹ của bạn.
• Thêm bộ điều khiển viewchế độ xem vào hệ thống phân cấp chế độ xem của bạn với addSubview(và cũng đặtframe hoặc các ràng buộc nếu thích hợp).
• Gọi didMove(toParent:)phương thức trên bộ điều khiển chế độ xem con, chuyển tham chiếu đến bộ điều khiển chế độ xem mẹ.

Xem Triển khai bộ điều khiển dạng xem vùng chứa trong Hướng dẫn lập trình bộ điều khiển dạng xem và phần "Triển khai bộ điều khiển dạng xem vùng chứa" của Tham chiếu lớp UIViewController .

Ví dụ, trong Swift 4.2, nó có thể giống như sau:

override func viewDidLoad() {
    super.viewDidLoad()

    let controller = storyboard!.instantiateViewController(withIdentifier: "Second")
    addChild(controller)
    controller.view.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(controller.view)

    NSLayoutConstraint.activate([
        controller.view.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 10),
        controller.view.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -10),
        controller.view.topAnchor.constraint(equalTo: view.topAnchor, constant: 10),
        controller.view.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -10)
    ])

    controller.didMove(toParent: self)
}

Lưu ý, phần trên không thực sự thêm "chế độ xem vùng chứa" vào hệ thống phân cấp. Nếu bạn muốn làm điều đó, bạn phải làm điều gì đó như:

override func viewDidLoad() {
    super.viewDidLoad()

    // add container

    let containerView = UIView()
    containerView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(containerView)
    NSLayoutConstraint.activate([
        containerView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 10),
        containerView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -10),
        containerView.topAnchor.constraint(equalTo: view.topAnchor, constant: 10),
        containerView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -10),
    ])

    // add child view controller view to container

    let controller = storyboard!.instantiateViewController(withIdentifier: "Second")
    addChild(controller)
    controller.view.translatesAutoresizingMaskIntoConstraints = false
    containerView.addSubview(controller.view)

    NSLayoutConstraint.activate([
        controller.view.leadingAnchor.constraint(equalTo: containerView.leadingAnchor),
        controller.view.trailingAnchor.constraint(equalTo: containerView.trailingAnchor),
        controller.view.topAnchor.constraint(equalTo: containerView.topAnchor),
        controller.view.bottomAnchor.constraint(equalTo: containerView.bottomAnchor)
    ])

    controller.didMove(toParent: self)
}

Mẫu thứ hai này cực kỳ hữu ích nếu bạn từng chuyển đổi giữa các bộ điều khiển chế độ xem trẻ em khác nhau và bạn chỉ muốn đảm bảo chế độ xem của một đứa trẻ ở cùng một vị trí và chế độ xem của đứa trẻ trước đó (nghĩa là tất cả các ràng buộc duy nhất cho vị trí được quy định bởi chế độ xem vùng chứa, thay vì cần phải xây dựng lại các ràng buộc này mỗi lần). Nhưng nếu chỉ thực hiện ngăn chế độ xem đơn giản, nhu cầu về chế độ xem vùng chứa riêng biệt này sẽ kém hấp dẫn hơn.

Trong các ví dụ trên, tôi đang thiết lập translatesAutosizingMaskIntoConstraintsđể tự falsexác định các ràng buộc. Bạn rõ ràng là có thể để lại translatesAutosizingMaskIntoConstraintsnhư truevà đặt cả framevà autosizingMaskcho quan điểm bạn thêm, nếu bạn muốn.

Xem các bản sửa đổi trước của câu trả lời này cho các phiên bản Swift 3 và Swift 2 .

Câu trả lời của @ Rob trong Swift 3:

    // add container

    let containerView = UIView()
    containerView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(containerView)
    NSLayoutConstraint.activate([
        containerView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 10),
        containerView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -10),
        containerView.topAnchor.constraint(equalTo: view.topAnchor, constant: 10),
        containerView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -10),
        ])

    // add child view controller view to container

    let controller = storyboard!.instantiateViewController(withIdentifier: "Second")
    addChildViewController(controller)
    controller.view.translatesAutoresizingMaskIntoConstraints = false
    containerView.addSubview(controller.view)

    NSLayoutConstraint.activate([
        controller.view.leadingAnchor.constraint(equalTo: containerView.leadingAnchor),
        controller.view.trailingAnchor.constraint(equalTo: containerView.trailingAnchor),
        controller.view.topAnchor.constraint(equalTo: containerView.topAnchor),
        controller.view.bottomAnchor.constraint(equalTo: containerView.bottomAnchor)
        ])

    controller.didMove(toParentViewController: self)

Chi tiết

• Xcode 10.2 (10E125), Swift 5

Giải pháp

import UIKit

class WeakObject {
    weak var object: AnyObject?
    init(object: AnyObject) { self.object = object}
}

class EmbedController {

    private weak var rootViewController: UIViewController?
    private var controllers = [WeakObject]()
    init (rootViewController: UIViewController) { self.rootViewController = rootViewController }

    func append(viewController: UIViewController) {
        guard let rootViewController = rootViewController else { return }
        controllers.append(WeakObject(object: viewController))
        rootViewController.addChild(viewController)
        rootViewController.view.addSubview(viewController.view)
    }

    deinit {
        if rootViewController == nil || controllers.isEmpty { return }
        for controller in controllers {
            if let controller = controller.object {
                controller.view.removeFromSuperview()
                controller.removeFromParent()
            }
        }
        controllers.removeAll()
    }
}

Sử dụng

class SampleViewController: UIViewController {
    private var embedController: EmbedController?

    override func viewDidLoad() {
        super.viewDidLoad()
        embedController = EmbedController(rootViewController: self)

        let newViewController = ViewControllerWithButton()
        newViewController.view.frame = CGRect(origin: CGPoint(x: 50, y: 150), size: CGSize(width: 200, height: 80))
        newViewController.view.backgroundColor = .lightGray
        embedController?.append(viewController: newViewController)
    }
}

Đầy đủ mẫu

ViewController

import UIKit

class ViewController: UIViewController {

    private var embedController: EmbedController?
    private var button: UIButton?
    private let addEmbedButtonTitle = "Add embed"

    override func viewDidLoad() {
        super.viewDidLoad()

        button = UIButton(frame: CGRect(x: 50, y: 50, width: 150, height: 20))
        button?.setTitle(addEmbedButtonTitle, for: .normal)
        button?.setTitleColor(.black, for: .normal)
        button?.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
        view.addSubview(button!)

        print("viewDidLoad")
        printChildViewControllesInfo()
    }

    func addChildViewControllers() {

        var newViewController = ViewControllerWithButton()
        newViewController.view.frame = CGRect(origin: CGPoint(x: 50, y: 150), size: CGSize(width: 200, height: 80))
        newViewController.view.backgroundColor = .lightGray
        embedController?.append(viewController: newViewController)

        newViewController = ViewControllerWithButton()
        newViewController.view.frame = CGRect(origin: CGPoint(x: 50, y: 250), size: CGSize(width: 200, height: 80))
        newViewController.view.backgroundColor = .blue
        embedController?.append(viewController: newViewController)

        print("\nChildViewControllers added")
        printChildViewControllesInfo()
    }

    @objc func buttonTapped() {

        if embedController == nil {
            embedController = EmbedController(rootViewController: self)
            button?.setTitle("Remove embed", for: .normal)
            addChildViewControllers()
        } else {
            embedController = nil
            print("\nChildViewControllers removed")
            printChildViewControllesInfo()
            button?.setTitle(addEmbedButtonTitle, for: .normal)
        }
    }

    func printChildViewControllesInfo() {
        print("view.subviews.count: \(view.subviews.count)")
        print("childViewControllers.count: \(childViewControllers.count)")
    }
}

ViewControllerWithButton

import UIKit

class ViewControllerWithButton:UIViewController {

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

    private func addButon() {
        let buttonWidth: CGFloat = 150
        let buttonHeight: CGFloat = 20
        let frame = CGRect(x: (view.frame.width-buttonWidth)/2, y: (view.frame.height-buttonHeight)/2, width: buttonWidth, height: buttonHeight)
        let button = UIButton(frame: frame)
        button.setTitle("Button", for: .normal)
        button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
        view.addSubview(button)
    }

    override func viewWillLayoutSubviews() {
        addButon()
    }

    @objc func buttonTapped() {
        print("Button tapped in \(self)")
    }
}

Các kết quả

Đây là mã của tôi trong swift 5.

class ViewEmbedder {
class func embed(
    parent:UIViewController,
    container:UIView,
    child:UIViewController,
    previous:UIViewController?){

    if let previous = previous {
        removeFromParent(vc: previous)
    }
    child.willMove(toParent: parent)
    parent.addChild(child)
    container.addSubview(child.view)
    child.didMove(toParent: parent)
    let w = container.frame.size.width;
    let h = container.frame.size.height;
    child.view.frame = CGRect(x: 0, y: 0, width: w, height: h)
}

class func removeFromParent(vc:UIViewController){
    vc.willMove(toParent: nil)
    vc.view.removeFromSuperview()
    vc.removeFromParent()
}

class func embed(withIdentifier id:String, parent:UIViewController, container:UIView, completion:((UIViewController)->Void)? = nil){
    let vc = parent.storyboard!.instantiateViewController(withIdentifier: id)
    embed(
        parent: parent,
        container: container,
        child: vc,
        previous: parent.children.first
    )
    completion?(vc)
}

}

Sử dụng

@IBOutlet weak var container:UIView!

ViewEmbedder.embed(
    withIdentifier: "MyVC", // Storyboard ID
    parent: self,
    container: self.container){ vc in
    // do things when embed complete
}

Sử dụng chức năng nhúng khác với bộ điều khiển chế độ xem không phải bảng phân cảnh.