说到与UIKit的集成不免会觉得有些鸡肋，因为现在很难做到只支持iOS13，不过到iOS14时，这种集成就变得必不可少了吧，在此先预热一下咯 ~ 先想想使用场景：
- 在现有基于UIKit的App中使用SwiftUI - 这应该是最常见的一种方式；
- 在SwiftUI中使用UIKit - 新写的页面是用了SwiftUI，但不免会跳转到原先的页面，或是在SwiftUI要使用UIKit写的一些View，毕竟重写原先所有的view成本有些大，需要逐步替换。
UIKit中使用SwiftUI
还记得我们在SwiftUI 初识 中提到的UIHostingController，它是SwiftUI的容器，同时也是UIViewController的子类。集成方式也就显而易见咯。
@IBAction func showSwiftUIByCode(_ sender: Any) {
let vc = UIHostingController(rootView: ContentView())
self.show(vc, sender: nil)
}
若使用的是Segue：
@IBSegueAction func openSwiftUI(_ coder: NSCoder) -> UIViewController? {
return UIHostingController(coder: coder, rootView: ContentView())
}
在SwiftUI中使用UIKit
首先，我们来看看，如何从SwiftUI跳转到一个UIViewController。先写一个最简单的UIViewController：
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = UIColor.red
}
}
在SwiftUI中没有提供类似self.show(vc, sender: nil)的方式，需要通过一个wrapper把ViewController包装一下，可以认为这就是一个适配器。SwiftUI提供了UIViewControllerRepresentable协议，来承担适配的功能，写一个自己的ViewControllerRepresentation实现这个协议。
import SwiftUI
struct ViewControllerRepresentation: UIViewControllerRepresentable {
typealias UIViewControllerType = ViewController
func makeUIViewController(context: UIViewControllerRepresentableContext<ViewControllerRepresentation>) -> ViewControllerRepresentation.UIViewControllerType {
return UIStoryboard(name: "Storyboard", bundle: nil).instantiateViewController(identifier: "ViewController") as! ViewController
}
func updateUIViewController(_ uiViewController: ViewControllerRepresentation.UIViewControllerType, context: UIViewControllerRepresentableContext<ViewControllerRepresentation>) {}
}
其中的typealias UIViewControllerType = ViewController指明了要包裹的UIViewController的具体类型，并实现两个方法，一个是make，一个是update。其中make顾名思义，就是如何生成我们的ViewController，大家可以用自己喜欢的方式初始化它。update暂时放空，它的作用是如何更新这个VC。我们会在下个示例中来看看它的用法。
接下来，我们要在SwiftUI中来调用我们这里定义的ViewControllerRepresentation。
var body: some View {
NavigationView {
VStack {
HStack {
TargetView(showAlert: $showAlert, rTarget: rTarget, gTarget: gTarget, bTarget: bTarget)
MatchingView(rGuess: $rGuess, gGuess: $gGuess, bGuess: $bGuess, counter: $counter.counter)
}
Button(action: { self.showAlert = true }) { Text("Hit me") }.alert(isPresented: $showAlert) { () -> Alert in
Alert(title: Text("Your Score"),message: Text(String(computeScore())))
}.frame(width: nil, height: 35, alignment: .center)
SlideView(value: $rGuess, textColor: .red)
SlideView(value: $gGuess, textColor: .green)
SlideView(value: $bGuess, textColor: .blue)
NavigationLink(destination: ViewControllerRepresentation()) {
Text("Play BullsEye").frame(width: nil, height: 31, alignment: .center)
}.padding(.bottom)
}
}
}
在底部我们放了一个NavigationLink，它就是在NavigationView中跳转至其他页面的一个链接容器，指明他的destination就是我们刚刚定义好的ViewControllerRepresentation，run一下，大功告成。
此时，不免会想，如何传递参数呢？这个UIViewController如何将一下返回值回传给SwiftUI呢？我们用下一个例子来说明，这个例子中是在SwiftUI中放置一个UIKit定义的UIView，先看code：
import SwiftUI
import UIKit
struct ColorUISlider: UIViewRepresentable {
var color: UIColor
@Binding var value: Double
typealias UIViewType = UISlider
func makeUIView(context: UIViewRepresentableContext<ColorUISlider>) -> UISlider {
let slider = UISlider(frame: .zero)
slider.thumbTintColor = color
slider.value = Float(value)
slider.addTarget(context.coordinator, action: #selector(Coordinator.valueChanged(_:)), for: .valueChanged)
return slider
}
func updateUIView(_ uiView: UISlider, context: UIViewRepresentableContext<ColorUISlider>) {
uiView.value = Float(value)
}
class Coordinator: NSObject {
var value: Binding<Double>
init(value: Binding<Double>) {
self.value = value
}
@objc func valueChanged(_ sender: UISlider) {
self.value.wrappedValue = Double(sender.value)
}
}
func makeCoordinator() -> ColorUISlider.Coordinator {
return Coordinator(value: $value)
}
}
code有点多，我们一点点看。首先想用再SwiftUI中使用UIView，同样需要一个适配器，在UIViewController时，用了UIViewControllerRepresentable，UIView提供了同样的协议UIViewRepresentable，需要的方法也如出一辙：
typealias UIViewType = UISlider
func makeUIView(...)
func makeUIView(...)
typealias UIViewType = UISlider指定了需要包装的UIView的类型，make方法要求返回UIView的实例，这里无需指定该view的frame或约束。
还记得我们之前留下的问题么？如何从SwiftUI中传值给UIView(UIViewController是相同的)，直接给这个ColorUISlider添加属性，通过struct的默认构造函数，便可以将参数传入：
ColorUISlider(color: .red, value: .constant(0.5))
那么这个ColorUISlider如何影响其父view呢？我们看到了这个@Binding参数@Binding var value: Double（一个引用类型，如果不记得了可以查阅之前的一篇文章Data Binding），但Binding是没有办法在UIView中直接使用的，还需另一个类，Coordinator，如何使用呢？
- 添加内部类：
class Coordinator: NSObject {
var value: Binding<Double>
init(value: Binding<Double>) {
self.value = value
}
@objc func valueChanged(_ sender: UISlider) {
self.value.wrappedValue = Double(sender.value)
}
}
- 实现
UIViewRepresentable的另一个方法makeCoordinator:
func makeCoordinator() -> ColorUISlider.Coordinator {
return Coordinator(value: $value)
}
当我们初始化UISlider的时候，给它添加了一个行为：
slider.addTarget(context.coordinator, action: #selector(Coordinator.valueChanged(_:)), for: .valueChanged)
在我们滑动滑块的时候，会触发：
@objc func valueChanged(_ sender: UISlider) {
self.value.wrappedValue = Double(sender.value)
}
从而使Binding起作用，影响外面传入的value，进而作用于父View。
到此为止，我们集成SwiftUI的预热已经结束，还有很多细节没有涉及，比如context。毕竟是预热嘛，用到的时候再来重温咯~
