UIViewRepresentable: Wrapping UIKit Views
Implementing makeUIView, updateUIView and dismantling UIKit views in SwiftUI.
UIViewRepresentable: Wrapping UIKit Views is a free Swift Academy lesson on CoddyKit. This is lesson 1 of 4. Any 3 lessons of this learning path are free to read in full — after that, CoddyKit PRO unlocks every lesson, plus hands-on practice with a built-in code editor and a 24/7 AI tutor. It is part of the Swift Academy learning path, and your progress syncs across the web and the CoddyKit app. The Swift Academy course includes 4 lessons in total.
Why UIViewRepresentable?
Many UIKit views have no SwiftUI equivalent yet. UIViewRepresentable bridges UIKit views into SwiftUI.
import SwiftUI
import UIKit
struct WebView: UIViewRepresentable {
let url: URL
// ...
}Required Methods
Implement makeUIView to create the view and updateUIView to sync SwiftUI state changes.
func makeUIView(context: Context) -> WKWebView {
WKWebView()
}
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.load(URLRequest(url: url))
}Full WebView Example
A complete UIViewRepresentable wrapping WKWebView for displaying web content in SwiftUI.
struct WebView: UIViewRepresentable {
let url: URL
func makeUIView(context: Context) -> WKWebView { WKWebView() }
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.load(URLRequest(url: url))
}
}Using in SwiftUI
Use the wrapped view just like any SwiftUI view and apply modifiers normally.
WebView(url: URL(string: "https://apple.com")!)
.frame(height: 400)
.cornerRadius(12)Passing Data In
Pass data from SwiftUI to UIKit through the representable's stored properties, updated in updateUIView.
struct MapView: UIViewRepresentable {
var region: MKCoordinateRegion
func makeUIView(context: Context) -> MKMapView { MKMapView() }
func updateUIView(_ uiView: MKMapView, context: Context) {
uiView.setRegion(region, animated: true)
}
}Dismantling UIKit Views
Implement the optional dismantleUIView to clean up resources like observers when the view is removed.
static func dismantleUIView(_ uiView: WKWebView, coordinator: Coordinator) {
uiView.stopLoading()
}Context Parameter
The context provides access to the coordinator, environment, and animation transaction.
func updateUIView(_ uiView: MKMapView, context: Context) {
print(context.environment.colorScheme) // .light or .dark
}Environment Values in UIViewRepresentable
Read SwiftUI environment values from context.environment to adapt UIKit configuration.
if context.environment.colorScheme == .dark {
uiView.overrideUserInterfaceStyle = .dark
}Sizing UIKit Views
UIViewRepresentable uses intrinsic content size or SwiftUI frame modifiers. Implement sizeThatFits for custom sizing.
func sizeThatFits(_ proposal: ProposedViewSize, uiView: WKWebView, context: Context) -> CGSize? {
CGSize(width: proposal.width ?? 300, height: 400)
}Avoiding makeUIView Side Effects
Keep makeUIView pure — only create and configure. Put state-driven updates in updateUIView.
// WRONG:
func makeUIView(context: Context) -> MKMapView {
let v = MKMapView()
v.setRegion(region, animated: false) // belongs in updateUIView
return v
}Common Wrapped Views
Typical UIKit views wrapped with UIViewRepresentable: WKWebView, MKMapView, UITextView, UIImagePickerController, AVPlayerLayer.
// UITextView with custom toolbar
struct RichTextEditor: UIViewRepresentable {
@Binding var text: String
// makeUIView, updateUIView, Coordinator...
}Quick Check
Which method in UIViewRepresentable is called to sync SwiftUI state into the UIKit view after the initial creation?
Lesson Recap
UIViewRepresentable requires makeUIView (create once) and updateUIView (sync on state change). Use context.environment to adapt appearance. Clean up in dismantleUIView. Apply SwiftUI frame modifiers to control sizing.
Learn Swift with an AI tutor — free
Write and run real code in your browser, get instant help from a 24/7 AI tutor, and pick up where you left off on the web or in the app.
- Courses
- 122
- Lessons
- 409
Frequently Asked Questions
Is the “UIViewRepresentable: Wrapping UIKit Views” lesson free?
Yes — any 3 lessons of the Swift Academy learning path, including “UIViewRepresentable: Wrapping UIKit Views”, are free to read in full here on the web. After that, CoddyKit PRO unlocks every lesson, plus interactive practice with a built-in code editor and a 24/7 AI tutor. The Swift Academy course includes 4 lessons in total.
What will I learn in “UIViewRepresentable: Wrapping UIKit Views”?
Implementing makeUIView, updateUIView and dismantling UIKit views in SwiftUI. You practise Swift Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Swift Academy?
No prior experience is required. Swift Academy on CoddyKit is structured for beginners through advanced learners, so you can start here or from the beginning and move at your own pace. This is lesson 1 of 4.
How long does the “UIViewRepresentable: Wrapping UIKit Views” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Swift Academy lesson?
Yes. Every Swift Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- UIViewRepresentable: Wrapping UIKit Views
- Coordinator Pattern for Delegate Communication
- UIViewControllerRepresentable
- UIHostingController: SwiftUI Inside UIKit