One of the big benefits of using SwiftUI is that you can hot update the App like Flutter，UI code changed，Will be directly reflected in the simulator or the real machine，Greatly improve the efficiency of writing user interfaces，No need to change 1px，run，Various clicks，Then check the loop of effects。But it's too early to use SwiftUI，After all, there is still a lot of iOS 12 Equipment is running，Want to do popular software，That still needs to be supported。
Then，Is there any way to make UIKit Can the written software also use real-time preview? It's actually possible... after all，SwiftUI can also directly display UIKit controls。
First of all, let’s take a look at Xcode Preview SwiftUI，What needs to be done：
|
1 2 3 4 5 6 |
struct Login_Preview: PreviewProvider { static var previews: some View { } } |
You only need to be in any one .swift Add the above code to the file，Xcode will show you the preview interface，To make it load UIKit，We need to implement a UIViewControllerRepresentable / UIViewRepresentable ，It depends on what you want to display UIViewController still is UIView 。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
import SwiftUI struct ViewControllerPreview: UIViewControllerRepresentable { typealias UIViewControllerType = UIViewController let viewControllerBuilder: () -> UIViewControllerType init(_ viewControllerBuilder: @escaping () -> UIViewControllerType) { self.viewControllerBuilder = viewControllerBuilder } @available(iOS 13.0.0, *) func makeUIViewController(context: Context) -> UIViewController { viewControllerBuilder() } func updateUIViewController(_ uiViewController: UIViewController, context: Context) { // Do nothing } } struct ViewPreview: UIViewRepresentable { let viewBuilder: () -> UIViewType init(_ viewBuilder: @escaping () -> UIViewType) { self.viewBuilder = viewBuilder } func makeUIView(context: Context) -> UIView { viewBuilder() } func updateUIView(_ uiView: UIView, context: Context) { // Do nothing } typealias UIViewType = UIView } |
These two structures are common，So that it can be used directly in the future。But there is a problem，When we actually compile，You need to modify the minimum supported version number，Because after all, it relies on SwiftUI，This leads to the need to increase the version number during development，Lower it when it is officially released。
|
1 2 3 |
#if canImport(SwiftUI) && DEBUG // your code #endif |
We can use Swift macros to do this，Such，The compiler can automatically determine whether SwiftUI is currently supported，And when it is officially released，Will automatically remove these codes。
Have written these two Representable after that，We go to the file that needs to be previewed，Enable preview：
|
1 2 3 4 5 6 7 8 9 10 11 12 |
#if canImport(SwiftUI) && DEBUG import SwiftUI @available(iOS 13.0, *) struct Login_Preview: PreviewProvider { static var previews: some View { ViewControllerPreview { UINavigationController(rootViewController: LoginPage()) } } } #endif |
Such，Xcode can preview your interface just like using SwiftUI! No matter what is modified，All can be displayed in the side preview in real time!
note，If you use a script that automatically increases the version number after each compilation，That may cause the preview to not refresh automatically，Manually click Resume every time，such as：
|
1 |
version=[crayon-673f9ebde1046926789847 inline="true" ]/usr/libexec/PlistBuddy -c "Print CFBundleVersion" $PRODUCT_SETTINGS_PATH |
version=
expr $version + 1
/usr/libexec/PlistBuddy -c “Set :CFBundleVersion $version” $PRODUCT_SETTINGS_PATH[/crayon]
We need to modify them to identify Live Preview mode：
|
1 2 3 4 |
if [ $ENABLE_PREVIEWS == "NO" ] then # your code to execute here version=[crayon-673f9ebde104a021931136 inline="true" ]/usr/libexec/PlistBuddy -c "Print CFBundleVersion" $PRODUCT_SETTINGS_PATH |
version=
expr $version + 1
/usr/libexec/PlistBuddy -c “Set :CFBundleVersion $version” $PRODUCT_SETTINGS_PATH
else
echo “Skipping the script because of preview mode”
fi
[/crayon]
Such，The script will only be executed during normal compilation，Will not affect Xcode Live Preview。
References
- How to Use Live Previews in UIKit
- mrabiciu/UIViewPreviewProvider
- SwiftUI: Automatic preview updating paused, always
Original article written by LogStudio：R0uter's Blog » Open Xcode Live Preview for UIKit
Reproduced Please keep the source and description link：https://www.logcg.com/archives/3502.html
