UIKit 项目中 Swift UI 的妙用

使用 SwiftUI 和 UIKit：无缝集成，打造响应迅速的跨平台应用

作为 iOS 开发者，我们热切期待 SwiftUI 带来的声明式布局和简化开发流程。然而，当涉及到集成现有 UIKit 组件时，事情可能会变得有些棘手。别担心，朋友们！SwiftUI 提供了强大的工具，让我们可以轻松地将 UIKit 的力量融入我们的 SwiftUI 应用程序中。

UIViewControllerRepresentable：UIKit 视图控制器的 SwiftUI 代理

UIKit 视图控制器是构建复杂用户界面的强大工具。但当我们想在 SwiftUI 预览中查看它们时，事情可能会变得混乱。幸运的是，UIViewControllerRepresentable 协议允许我们在 SwiftUI 视图中托管 UIKit 视图控制器。就像一个神奇的桥梁，它让 SwiftUI 和 UIKit 能够和谐地对话。

代码示例：

struct MyUIViewController: UIViewControllerRepresentable {
  func makeUIViewController(context: Context) -> UIViewController {
    let vc = UIViewController()
    vc.view.backgroundColor = .blue
    return vc
  }
  func updateUIViewController(_ uiViewController: UIViewController, context: Context) {
    // 更新 UIKit 视图控制器
  }
}

在 SwiftUI 视图中使用 UIViewControllerRepresentable：

struct MySwiftUIView: View {
  var body: some View {
    MyUIViewController().frame(width: 300, height: 200)
  }
}

UIViewRepresentable：将 UIKit 视图嵌入 SwiftUI

有时候，我们只需要将 UIKit 视图嵌入到 SwiftUI 视图中。这就是 UIViewRepresentable 发挥作用的地方。它充当 UIKit 视图在 SwiftUI 世界中的向导，允许我们像处理任何其他 SwiftUI 视图一样处理它们。

代码示例：

struct MyUIView: UIViewRepresentable {
  func makeUIView(context: Context) -> UIView {
    let view = UIView()
    view.backgroundColor = .red
    return view
  }
  func updateUIView(_ uiView: UIView, context: Context) {
    // 更新 UIKit 视图
  }
}

在 SwiftUI 视图中使用 UIViewRepresentable：

struct MySwiftUIView: View {
  var body: some View {
    MyUIView().frame(width: 300, height: 200)
  }
}

Coordinator：跨框架通信的粘合剂

有时，UIKit 视图控制器或视图需要与 SwiftUI 视图进行通信。这就是 Coordinator 类派上用场的地方。它充当中间人，协调两个框架之间的信息流，确保它们可以无缝地合作。

代码示例：

struct MyCoordinator: Coordinator {
  var parent: MySwiftUIView
  // 在这里处理通信逻辑
}

在 SwiftUI 视图中使用 Coordinator：

struct MySwiftUIView: View {
  var coordinator: Coordinator
  // 初始化 Coordinator
  var body: some View {
    // ...
  }
}

结论

伙计们，有了 UIViewControllerRepresentable、UIViewRepresentable 和 Coordinator，我们拥有了一套工具，可以将 UIKit 的强大功能与 SwiftUI 的声明式优雅完美结合。告别复杂和繁琐的集成，拥抱无缝的用户界面构建体验。

常见问题解答

• 问题：如何在 SwiftUI 预览中显示 UIKit 视图控制器？

  • 答案：使用 UIViewControllerRepresentable 协议将 UIKit 视图控制器托管在 SwiftUI 视图中。

• 问题：如何将 UIKit 视图嵌入 SwiftUI 视图？

  • 答案：使用 UIViewRepresentable 协议将 UIKit 视图嵌入 SwiftUI 视图。

• 问题：如何协调 SwiftUI 视图和 UIKit 视图控制器或视图之间的通信？

  • 答案：使用 Coordinator 类在两个框架之间协调信息流。

• 问题：UIViewControllerRepresentable 和 UIViewRepresentable 有什么区别？

  • 答案：UIViewControllerRepresentable 用于托管 UIKit 视图控制器，而 UIViewRepresentable 用于嵌入 UIKit 视图。

• 问题：何时应该使用 Coordinator？

  • 答案：当需要在 SwiftUI 视图和 UIKit 视图控制器或视图之间传递数据或事件时。