Use SwiftUI in UIKit View Controllers with UIHostingController

4 min readMay 20, 2020

Many of us iOS developers are still working on UIKit, well storyboard, based iOS applications. One might be maintaining these apps or we have yet to become comfortable with creating SwiftUI based Xcode projects. Either way, we need a solid, not hacky solution until we are deep into SwiftUI down the road. This solution is UIHostingController.

If you are looking for the opposite. IE: putting a view controller in a SwiftUI view. You want to learn about UIViewControllerRepresentable, which I’ll go into at the end of this article with links to other resources. For now, let’s learn about UI hosting controller.

Problem: Developers have existing View Controllers we want to put SwiftUI views into.
Solution: UIHostingController

If you would rather watch a video on this exact article, here is a video I filmed of myself building and explaining a UIHostingController project.

Let’s Code

Step 1: create a new single view app Xcode project

Change user interface to Storyboard
We want to use Storyboard because it starts us off in a View Controller instead of a SwiftUI View. You can use SwiftUI, but you’ll have to change things in scene delegate. To avoid this, just use Storyboard for user interface.
This will all make sense after you learn a bit more SwiftUI

your project files should look like what you see in this screenshot.

Step 2: Create a SwiftUI view

Create a SwiftUI view and name it ContentView.swift
Don’t change anything in the file, we just want to quickly see how we can display it in ViewController.swift

Step 3: Create a UIHostingController

in ViewController.swift create an instance of UIHostingController and provide an instance of ContentView as the root view.
add the hosting controller’s view to the subview stack of the view controller’s view.
If you compile, you won’t see anything yet. Why?

Step 4: Adding the content view as a child

Since UIHostingController itself is not a view, we can’t just add the whole thing to the view sub stack.

Add your hosting controller as a child to the view controller directly.
If you compile it, it still won’t work because there is no frame or constraints on the view

Step 5 — Final Step — Add constraints (or a frame)

I use programmatic auto layout so let’s do that.
if you compile this code you will see our SwiftUI view is now in the View Controller.

You have now learned how to use UIHostingController.

If you want to take a big step further and learn how to use UIViewControllerRepresentable. Feel free to check out my video on using UIPageViewController (or any view controller) in a SwiftUI view.
I’ll also be writing a medium article on UIViewControllerRepresentable, once I do that I’ll update this article with the link. For now, there’s the video.

If you want updates on new medium articles, free video tutorials, and iOS development news in general, check out my website maxcodes.io to subscribe to the free dev email list.

That’s all, Maxwell.