SwiftUI的聲明式布局是真的炫酷。不過真正運用到項目中還需要點時間。

不過我們可以通過SwiftUI中提供的UIViewControllerRepresentable協(xié)議 讓你的UIKit中的VC顯示在XCode11的Preview中， 如下圖。

image

ok 我們直接開始說說如何實現(xiàn)（共三步）：

• 1、我們先暫定我們的UIKit的VC叫UIKitViewController,先做一點最簡單的UI布局

image

• 2. 創(chuàng)建一個中轉(zhuǎn)結(jié)構(gòu)體UIVCPresenter 遵循并實現(xiàn)UIViewControllerRepresentable 協(xié)議 這個結(jié)構(gòu)體可以當(dāng)做UIKit和SwiftUI的一個橋接。

image

• 3. 最后就是最基本的SwiftUI 中的View的Preview顯示方法。創(chuàng)建一個基本的SwiftUI工程就會有這段示例代碼??

image

下面就是愉快的按下Option + Command + P 的(刷新Preview)快捷鍵。

我們就可以在XCode11的Preview中顯示我們的UIViewController啦~

最后副一下我的示例代碼(差不多30行左右的亞子)：

import SwiftUI

class UIKitViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        self.view.backgroundColor = .red
        let blueView = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))
        blueView.backgroundColor = .green
        view.addSubview(blueView)
    }
}

struct UIVCPresenter: UIViewControllerRepresentable {
    ///UIViewControllerRepresentable  協(xié)議中必須實現(xiàn)的方法 -  當(dāng) SwiftUI 準(zhǔn)備好顯示 view 時，它會調(diào)用此方法一次
    ///作用： 將需要Preview顯示VC 返回出來。
    func makeUIViewController(context: UIViewControllerRepresentableContext<UIVCPresenter>) -> UIKitViewController {
        return UIKitViewController()
    }
    ///UIViewControllerRepresentable  協(xié)議中必須實現(xiàn)的方法
    ///    更新UIViewController時候會調(diào)用這個方法  可以做一系列l(wèi)業(yè)務(wù)實現(xiàn)，
    func updateUIViewController(_ uiViewController: UIKitViewController, context: UIViewControllerRepresentableContext<UIVCPresenter>) {
    }
}

struct swiftUIView: View {
    var body: some View {
        UIVCPresenter()
    }
}

struct UIKitVCPreView : PreviewProvider {
    static var previews: some View {
        swiftUIView()
    }
}