Lição: 88: Integrando SwiftUI com UIKit
SwiftUI é um poderoso e moderno framework introduzido pela Apple para construção de interfaces de usuário em todas as plataformas da Apple. No entanto, muitos aplicativos existentes ainda utilizam UIKit, e há cenários onde pode ser necessário integrar ambos os frameworks. Esta aula irá guiá-lo através do processo de embutir views do SwiftUI em aplicativos UIKit e vice-versa.
Parte 1: Embutindo SwiftUI em uma Aplicação UIKit
Para começar a integrar SwiftUI em um aplicativo baseado em UIKit, você pode usar UIHostingController
, que atua como uma ponte entre os dois frameworks.
Passo 1: Criar uma View SwiftUI
Vamos criar uma simples view SwiftUI para exibir uma mensagem de saudação.
import SwiftUI
struct GreetingView: View {
var body: some View {
Text("Olá, SwiftUI!")
.font(.largeTitle)
.padding()
}
}
Passo 2: Embutir a View SwiftUI em um ViewController UIKit
Agora, vamos criar um UIViewController
que hospedará nossa GreetingView
.
import UIKit
import SwiftUI
class GreetingViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Criar a view SwiftUI
let greetingView = GreetingView()
// Criar um UIHostingController com a view SwiftUI
let hostingController = UIHostingController(rootView: greetingView)
// Adicionar o controller como filho
addChild(hostingController)
hostingController.view.frame = view.bounds
view.addSubview(hostingController.view)
hostingController.didMove(toParent: self)
}
}
Passo 3: Apresentando o View Controller
Certifique-se de apresentar o GreetingViewController
a partir de outro view controller ou defina-o como o view controller raiz no seu SceneDelegate
(se você estiver usando o ciclo de vida UIKit).
class SceneDelegate: UIResponder, UIWindowSceneDelegate {
var window: UIWindow?
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
guard let windowScene = scene as? UIWindowScene else { return }
window = UIWindow(windowScene: windowScene)
window?.rootViewController = GreetingViewController()
window?.makeKeyAndVisible()
}
}
Agora, ao executar a aplicação, você deve ver o texto "Olá, SwiftUI!" exibido na tela.
Parte 2: Usando UIKit no SwiftUI
Às vezes, você pode precisar usar componentes UIKit dentro de uma aplicação SwiftUI. Você pode realizar isso usando UIViewRepresentable
.
Passo 1: Criar um UIView Representable
Vamos criar um simples UILabel
que pode ser usado no SwiftUI.
import SwiftUI
struct LabelView: UIViewRepresentable {
var text: String
func makeUIView(context: Context) -> UILabel {
let label = UILabel()
label.textAlignment = .center
return label
}
func updateUIView(_ uiView: UILabel, context: Context) {
uiView.text = text
}
}
Passo 2: Usar o UIView Representable em uma View SwiftUI
Agora, vamos incorporar nossa LabelView
em uma view SwiftUI.
struct ContentView: View {
var body: some View {
VStack {
Text("Olá, UIKit!")
.font(.largeTitle)
LabelView(text: "Este é um UILabel no SwiftUI")
.padding()
}
}
}
Passo 3: Definir ContentView como a View Raiz
Por fim, atualize o SceneDelegate
para exibir o ContentView
em vez do GreetingViewController
.
func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
guard let windowScene = scene as? UIWindowScene else { return }
window = UIWindow(windowScene: windowScene)
window?.rootViewController = UIHostingController(rootView: ContentView())
window?.makeKeyAndVisible()
}
Agora, ao executar o aplicativo, você verá componentes SwiftUI e UIKit funcionando juntos sem problemas.
Conclusão
Integrar SwiftUI com UIKit é uma maneira poderosa de aproveitar as melhores características de ambos os frameworks. Usando o UIHostingController
, você pode facilmente embutir views SwiftUI em aplicativos UIKit existentes. Por outro lado, o UIViewRepresentable
permite que você incorpore views UIKit no SwiftUI. Esta integração abre uma ampla gama de possibilidades para suas aplicações, proporcionando flexibilidade em design e funcionalidade.