How to use SwiftUI in Storyboard using UIHostingController subclass

There are two ways to use SwiftUI as UIViewController in Storyboard for a UIKit project.

1. Use UIHostingController with IBSegueAction.
2. Create a subclass of UIHostingController.

We already cover the first approach in How to use SwiftUI as UIViewController in Storyboard. In this article, we will cover the second one.

Why do we need to subclass UIHostingController

Using SwiftUI view with UIHostingController with IBSegueAction is working when you have a segue action that presents a UIHostingController, e.g., push to navigation stack or present a modal.

But there are some situations where that is not possible, such as

• Using UIHostingController as an Initial view controller.
• Using UIHostingController as a Root view of a navigation controller.
• Using UIHostingController as one of the View controllers in a Tab bar controller.

In these situations, you need to create a custom UIHostingController subclass.

You can easily support sarunw.com by checking out this sponsor.

Tiny OCR: Extract text from image directly from your mac.

Try it for Free

How to create a custom UIHostingController subclass

It requires three steps to create a custom UIHostingController subclass.

1. Create a UIHostingController subclass.
2. Specify a SwiftUI view as a content view of the UIHostingController subclass.
3. Use a custom class in the Storyboard.

Create a UIHostingController subclass

These are normal steps you normally do to create any subclass.

1. Create a new "Cocoa Touch Class".

2. Make it a subclass of UIHostingController and name it whatever you want.

Specify a SwiftUI view as a content view of the UIHostingController subclass

You need to do two things to make the new UIHostingController present a SwiftUI view.

1. Set a hosting controller's generic content type to the SwiftUI view you want to present.
2. Implement the init(coder:) initializer to return the specified SwiftUI view.

import UIKit
import SwiftUI

class SwiftUIViewController: UIHostingController<SwiftUIView> {

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder, rootView: SwiftUIView())
    }
}

1. We specify our SwiftUI view as a hosting controller's content type, UIHostingController<SwiftUIView>.

class UIHostingController<Content> : UIViewController where Content : View { }

2. We return the specified view from init?(coder aDecoder: NSCoder).

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder, rootView: SwiftUIView())
}

Use a custom class in the Storyboard

The last step is to use the newly created subclass in the Storyboard.

1. Open the Storyboard and select the UIHostingController.
2. In the Identity Inspector, put a subclass name in the Class field. In this case, SwiftUIViewController.

Here is the result.