14.1_在UIKit中嵌入SwiftUI视图

桥接的艺术：UIKit与SwiftUI的融合 🤝

将SwiftUI视图嵌入到现有的UIKit应用中，可以逐步采用SwiftUI，同时保留UIKit的成熟功能。这是一种非常棒的策略，可以让你在不完全重写应用的情况下，体验SwiftUI的强大之处。你可以利用SwiftUI的声明式语法和现代特性，逐步替换UIKit中的部分视图。

使用UIHostingController：连接UIKit与SwiftUI的桥梁 🌉

UIHostingController 是 UIKit 提供的一个关键类，它允许你将 SwiftUI 视图集成到 UIKit 视图层级中。你可以把它想象成一个容器，专门用来承载 SwiftUI 视图。

1. 创建 SwiftUI 视图: 首先，你需要创建一个 SwiftUI 视图，例如一个简单的文本标签。
2. 实例化 UIHostingController: 使用 SwiftUI 视图初始化 UIHostingController。
3. 添加到 UIKit 视图层级: 将 UIHostingController 的 view 属性添加到 UIKit 视图的子视图中。

import SwiftUI
import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // 1. 创建 SwiftUI 视图
        let swiftUIView = Text("你好，SwiftUI!")
            .font(.title)

        // 2. 实例化 UIHostingController
        let hostingController = UIHostingController(rootView: swiftUIView)

        // 3. 添加到 UIKit 视图层级
        addChild(hostingController)
        view.addSubview(hostingController.view)
        hostingController.didMove(toParent: self)

        // 设置约束
        hostingController.view.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            hostingController.view.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            hostingController.view.centerYAnchor.constraint(equalTo: view.centerYAnchor)
        ])
    }
}

布局与约束：确保SwiftUI视图正确显示 📐

当将 UIHostingController 的视图添加到 UIKit 视图层级中时，务必设置正确的布局约束。否则，SwiftUI 视图可能无法正确显示。你可以使用 Auto Layout 或其他布局方式来确保 SwiftUI 视图在 UIKit 视图中占据正确的位置和大小。

• 使用 translatesAutoresizingMaskIntoConstraints = false 关闭自动约束。
• 使用 NSLayoutConstraint.activate 激活你自定义的约束。

数据传递：UIKit与SwiftUI之间的通信 🗣️

UIKit 和 SwiftUI 之间的数据传递可以通过多种方式实现。你可以使用 ObservableObject 和 @ObservedObject 在 SwiftUI 视图中观察 UIKit 中的数据变化，或者使用闭包回调将 SwiftUI 视图中的事件传递给 UIKit。

• ObservableObject: 用于在 SwiftUI 中观察 UIKit 数据的变化。
• @ObservedObject: 用于声明一个观察对象。
• 闭包回调: 用于将 SwiftUI 视图中的事件传递给 UIKit。

示例：集成一个SwiftUI按钮到UIKit 📱

假设你想要在 UIKit 中使用一个 SwiftUI 按钮。你可以创建一个 SwiftUI 按钮，并使用 UIHostingController 将其嵌入到 UIKit 视图中。当 SwiftUI 按钮被点击时，你可以使用闭包回调通知 UIKit。

import SwiftUI
import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // SwiftUI 按钮点击事件的回调
        let buttonAction = {
            print("SwiftUI 按钮被点击了!")
        }

        // 创建 SwiftUI 按钮
        let swiftUIButton = Button("点击我") {
            buttonAction()
        }

        // 实例化 UIHostingController
        let hostingController = UIHostingController(rootView: swiftUIButton)

        // 添加到 UIKit 视图层级
        addChild(hostingController)
        view.addSubview(hostingController.view)
        hostingController.didMove(toParent: self)

        // 设置约束
        hostingController.view.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            hostingController.view.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            hostingController.view.centerYAnchor.constraint(equalTo: view.centerYAnchor)
        ])
    }
}

通过以上步骤，你就可以成功地将 SwiftUI 视图嵌入到 UIKit 应用中啦！🎉 这种混合开发的方式，可以让你充分利用两种框架的优势，打造更强大的应用。