20.11.2024

Aula 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.

Video

Navigation