UIViewRepresentable: обёртка для представлений UIKit
Реализуйте makeUIView, updateUIView и удаление представлений UIKit в SwiftUI.
«UIViewRepresentable: обёртка для представлений UIKit» — бесплатный урок Swift Academy на CoddyKit. Это урок 1 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Swift Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Swift Academy содержит 4 уроков всего.
Зачем нужен UIViewRepresentable?
У многих представлений UIKit пока нет эквивалента в SwiftUI. UIViewRepresentable связывает представления UIKit со SwiftUI.
import SwiftUI
import UIKit
struct WebView: UIViewRepresentable {
let url: URL
// ...
}Обязательные методы
Реализуйте makeUIView, чтобы создать представление, и updateUIView, чтобы синхронизировать изменения состояния SwiftUI.
func makeUIView(context: Context) -> WKWebView {
WKWebView()
}
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.load(URLRequest(url: url))
}Полный пример WebView
Полная реализация UIViewRepresentable, оборачивающая WKWebView для отображения веб-содержимого в SwiftUI.
struct WebView: UIViewRepresentable {
let url: URL
func makeUIView(context: Context) -> WKWebView { WKWebView() }
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.load(URLRequest(url: url))
}
}Использование в SwiftUI
Используйте обёрнутое представление так же, как любое представление SwiftUI, и обычно применяйте к нему модификаторы.
WebView(url: URL(string: "https://apple.com")!)
.frame(height: 400)
.cornerRadius(12)Передача данных
Передавайте данные из SwiftUI в UIKit через сохранённые свойства обёртки, обновляя их в updateUIView.
struct MapView: UIViewRepresentable {
var region: MKCoordinateRegion
func makeUIView(context: Context) -> MKMapView { MKMapView() }
func updateUIView(_ uiView: MKMapView, context: Context) {
uiView.setRegion(region, animated: true)
}
}Удаление представлений UIKit
Реализуйте необязательный dismantleUIView, чтобы освобождать такие ресурсы, как наблюдатели, когда представление удаляется.
static func dismantleUIView(_ uiView: WKWebView, coordinator: Coordinator) {
uiView.stopLoading()
}Параметр Context
context предоставляет доступ к координатору, окружению и транзакции анимации.
func updateUIView(_ uiView: MKMapView, context: Context) {
print(context.environment.colorScheme) // .light or .dark
}Значения окружения в UIViewRepresentable
Считывайте значения окружения SwiftUI из context.environment, чтобы адаптировать конфигурацию UIKit.
if context.environment.colorScheme == .dark {
uiView.overrideUserInterfaceStyle = .dark
}Изменение размера представлений UIKit
UIViewRepresentable использует внутренний размер содержимого или модификаторы рамки SwiftUI. Для пользовательского размера реализуйте sizeThatFits.
func sizeThatFits(_ proposal: ProposedViewSize, uiView: WKWebView, context: Context) -> CGSize? {
CGSize(width: proposal.width ?? 300, height: 400)
}Избегание побочных эффектов в makeUIView
Сохраняйте makeUIView чистым: только создавайте и настраивайте представление. Обновления, зависящие от состояния, помещайте в updateUIView.
// WRONG:
func makeUIView(context: Context) -> MKMapView {
let v = MKMapView()
v.setRegion(region, animated: false) // belongs in updateUIView
return v
}Распространённые обёрнутые представления
Типичные представления UIKit, обёрнутые с помощью UIViewRepresentable: веб-представление WKWebView, карта MKMapView, текстовое представление UITextView, контроллер выбора изображений UIImagePickerController и слой видеоплеера AVPlayerLayer.
// UITextView with custom toolbar
struct RichTextEditor: UIViewRepresentable {
@Binding var text: String
// makeUIView, updateUIView, Coordinator...
}Проверка знаний
Какой метод UIViewRepresentable вызывается для синхронизации состояния SwiftUI с представлением UIKit после его первоначального создания?
Итоги урока
UIViewRepresentable требует makeUIView (создаётся один раз) и updateUIView (синхронизация при изменении состояния). Используйте context.environment, чтобы адаптировать внешний вид. Освобождайте ресурсы в dismantleUIView. Для управления размером применяйте модификаторы рамки SwiftUI.
Часто задаваемые вопросы
Урок «UIViewRepresentable: обёртка для представлений UIKit» бесплатный?
Да — полный текст урока «UIViewRepresentable: обёртка для представлений UIKit» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Swift Academy, подпишись на CoddyKit PRO. Курс Swift Academy содержит 4 уроков всего.
Чему я научусь в уроке «UIViewRepresentable: обёртка для представлений UIKit»?
Реализуйте makeUIView, updateUIView и удаление представлений UIKit в SwiftUI. Ты практикуешь Swift Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Swift Academy?
Предыдущий опыт не требуется. Swift Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 1 из 4.
Сколько времени занимает урок «UIViewRepresentable: обёртка для представлений UIKit»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Swift Academy?
Да. Каждый урок Swift Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- UIViewRepresentable: обёртка для представлений UIKit
- Шаблон Coordinator для взаимодействия с делегатами
- UIViewControllerRepresentable
- UIHostingController: SwiftUI внутри UIKit