Question

另一个问题标题可能是“如何将UIHostingController的视图添加为UIView的子视图？” 。

我正在创建一个新的UI组件，希望尝试一下SwiftUI。下图是当前视图结构。 UIView是我现在正在使用的（右上），而SwiftUI视图是我尝试使用的（右下）。

观看了WWDC 2019中的所有SwiftUI视频之后。我仍然不知道如何使用SwiftUI视图并将其放在UIView实例应该放置的位置。

我从“ Integrating SwiftUI”的谈话中注意到，有一个NSHostingView用于macOS，https://developer.apple.com/documentation/swiftui/nshostingview#使我怀疑是否有类似的东西或实现它的替代方法。 / p>

我读了类似Include SwiftUI views in existing UIKit application的问题，其中提到SwiftUI和UIKit可以与UIHostingController一起玩。但是，我想做的是仅采用一小段SwiftUI，并将其放入我现有的UIKit视图组件中，而不是将其用作控制器。

我是iOS开发的新手，如果有一种方法可以将视图控制器用作UIView视图，请发表评论。谢谢。

Answer 1

视图控制器不仅适用于顶级场景。我们通常将视图控制器放在视图控制器中。称为“视图控制器包含”和/或“子视图控制器”。（顺便说一句，视图控制器容器通常是解决传统UIKit应用程序中视图控制器膨胀，将复杂的场景分解为多个视图控制器的一种好方法。）

所以

继续并使用UIHostingController：

let controller = UIHostingController(rootView: ...)

和;

添加视图控制器，然后可以将托管控制器添加为子视图控制器：
```
addChild(controller)
view.addSubview(controller.view)
controller.didMove(toParent: self)
```
很显然，您还需要为托管控制器的frame设置view或布局约束。

有关将一个视图控制器嵌入另一个视图控制器的一般信息，请参见UIViewController documentation的实施容器视图控制器部分。

例如，假设我们有一个SwiftUI视图来渲染其中包含文本的圆：

struct CircleView : View {
    @ObjectBinding var model: CircleModel

    var body: some View {
        ZStack {
            Circle()
                .fill(Color.blue)
            Text(model.text)
                .color(Color.white)
        }
    }
}

让我们说这是我们视图的模型：

import Combine

class CircleModel: BindableObject {
    var didChange = PassthroughSubject<Void, Never>()

    var text: String { didSet { didChange.send() } }

    init(text: String) {
        self.text = text
    }
}

然后，我们的UIKit视图控制器可以添加SwiftUI视图，在UIView内设置其框架/约束，并根据需要更新其模型：

class ViewController: UIViewController {
    private weak var timer: Timer?
    private var model = CircleModel(text: "")

    override func viewDidLoad() {
        super.viewDidLoad()

        addCircleView()
        startTimer()
    }

    deinit {
        timer?.invalidate()
    }
}

private extension ViewController {
    func addCircleView() {
        let circleView = CircleView(model: model)
        let controller = UIHostingController(rootView: circleView)
        addChild(controller)
        controller.view.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(controller.view)
        controller.didMove(toParent: self)

        NSLayoutConstraint.activate([
            controller.view.widthAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.5),
            controller.view.heightAnchor.constraint(equalTo: view.heightAnchor, multiplier: 0.5),
            controller.view.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            controller.view.centerYAnchor.constraint(equalTo: view.centerYAnchor)
        ])
    }

    func startTimer() {
        var index = 0
        timer = Timer.scheduledTimer(withTimeInterval: 1, repeats: true) { [weak self] _ in
            index += 1
            self?.model.text = "Tick \(index)"
        }
    }
}

Answer 2

我有一些想法。

用UIHostingController包裹SwiftUI
初始化控制器
将新控制器添加为子视图控制器
将控制器视图作为子视图添加到应该去的地方

因此：

addChild(hostingViewController)
hostingViewController.view.frame = ...
view.addSubview(hostingViewController.view)
hostingViewController.didMove(toParent: self)

视图控制器始终将其他视图控制器用作视图。

斯坦福CS193P，https://youtu.be/w7a79cx3UaY?t=679

参考

在SwiftUI中，如何在UIView内或作为UIView使用UIHostingController？

2 个答案: