How to use UIKit in SwiftUI and vice-versa

We know that the SwiftUI is now available for development, but we have our own Custom view and utility class in swift and want to use it in SwiftUI. we have some steps through this we can easily

1. How to use swiftUI view inside UIKit (UIHostingController)

To use swiftUI view inside the UIKit, swift provides UIHostingController, A UIKit view controller that manages a SwiftUI view hierarchy.

Present a SwiftUI view inside UIKit

2. How to push from a UIViewController to SwiftUI

Push to SwiftUI view

3. How to use UIKit inside the SwiftUI

Swift provides a UIViewRepresentable protocol, that has two functions that are makeUIView and updateUIView

makeUIView() method responsible to return view.

updateUIView() method that will be called whenever the data for the view has changed.

Example 1

Example 2

Uses of XIB as a view inside the SwiftUI

Uses:

How to use an existing Utility class inside the SwiftUI

How to pop UIKit from SwiftUI?

1. SwiftUI Embedded in a UINavigationController (Push Navigation)

If you used a UINavigationController to push a UIHostingController containing your SwiftUI view, you can call popViewController on the navigation controller.

Code Example:

struct MySwiftUIView: View {
    var popToUIKit: () -> Void
    var body: some View {
        VStack {
            Text("This is a SwiftUI View")
                .padding()
            Button("Go Back to UIKit") {
                popToUIKit() // Trigger the UIKit pop action
            }
        }
    }
}
// UIKit Code
let swiftUIView = MySwiftUIView(popToUIKit: {
    self.navigationController?.popViewController(animated: true)
})
let hostingController = UIHostingController(rootView: swiftUIView)
self.navigationController?.pushViewController(hostingController, animated: true)

Here:

• popToUIKit is a closure passed to the SwiftUI view.
• It calls navigationController?.popViewController(animated: true) in UIKit to navigate back.

2. SwiftUI Presented Modally from UIKit

If the SwiftUI view was presented modally (e.g., using present), you can dismiss it by calling dismiss.

Code Example:

struct MySwiftUIView: View {
    var dismissAction: () -> Void

    var body: some View {
        VStack {
            Text("This is a SwiftUI View")
                .padding()
            Button("Dismiss to UIKit") {
                dismissAction() // Trigger the dismiss action
            }
        }
    }
}
// UIKit Code
let swiftUIView = MySwiftUIView(dismissAction: {
    self.dismiss(animated: true, completion: nil)
})
let hostingController = UIHostingController(rootView: swiftUIView)
self.present(hostingController, animated: true, completion: nil)

Here:

• dismissAction triggers the dismiss method in UIKit, returning to the previous screen.

3. Managing Pop or Dismiss with Environment

To make the code cleaner and more SwiftUI-centric, use @Environment(\.presentationMode) to control dismissal from within the SwiftUI view.

Code Example:

struct MySwiftUIView: View {
    @Environment(\.presentationMode) var presentationMode

    var body: some View {
        VStack {
            Text("This is a SwiftUI View")
                .padding()
            Button("Go Back to UIKit") {
                presentationMode.wrappedValue.dismiss() // Dismiss SwiftUI View
            }
        }
    }
}
// UIKit Code
let hostingController = UIHostingController(rootView: MySwiftUIView())
self.navigationController?.pushViewController(hostingController, animated: true)

Choosing the Best Approach

• Use popViewController if you pushed the SwiftUI view using a navigation controller.
• Use dismiss if the SwiftUI view was presented modally.
• Use @Environment(\.presentationMode) for a SwiftUI-native dismissal approach.

References Link:
1. https://sarunw.com/posts/uikit-in-swiftui/

2. https://developer.apple.com/tutorials/swiftui/interfacing-with-uikit

3. https://www.hackingwithswift.com/quick-start/swiftui/how-to-wrap-a-custom-uiview-for-swiftui