19.11.2024

Aula 73: Objetos Observáveis e @ObservedObject

No SwiftUI, gerenciar o estado do seu aplicativo é essencial para criar interfaces responsivas. Esta aula abordará ObservableObject e @ObservedObject, dois conceitos poderosos que permitem criar e gerenciar estado em suas views de forma eficaz.

ObservableObject

ObservableObject é um protocolo que você pode adotar em suas classes para permitir que elas sejam observadas em relação a mudanças. Quando você marca uma classe como conformando-se a ObservableObject, ela pode notificar seus observadores sempre que qualquer uma de suas propriedades publicadas mudar, para que as views possam ser re-renderizadas adequadamente.

Exemplo de ObservableObject

Vamos começar criando um modelo simples que conforma-se a ObservableObject.

import SwiftUI
import Combine

class ModeloContador: ObservableObject {
    @Published var contagem: Int = 0

    func incrementar() {
        contagem += 1
    }

    func decrementar() {
        contagem -= 1
    }
}

Neste exemplo, ModeloContador tem uma propriedade contagem que é marcada com @Published. Isso informa ao SwiftUI que qualquer mudança em contagem deve resultar em uma nova renderização das views que estão observando o ModeloContador.

@ObservedObject

O wrapper de propriedade @ObservedObject é utilizado em uma view do SwiftUI para assinar um ObservableObject. Quando o objeto observado muda, a view será atualizada de acordo.

Exemplo de Uso de @ObservedObject

Agora, vamos usar ModeloContador em uma view SwiftUI.

struct ViewContador: View {
    @ObservedObject var contador = ModeloContador() // Cria uma instância de ModeloContador

    var body: some View {
        VStack {
            Text("Contagem Atual: \(contador.contagem)")
                .font(.largeTitle)
            HStack {
                Button(action: {
                    contador.incrementar()
                }) {
                    Text("Incrementar")
                }

                Button(action: {
                    contador.decrementar()
                }) {
                    Text("Decrementar")
                }
            }
        }
        .padding()
    }
}

No código acima, ViewContador utiliza @ObservedObject para assinar uma instância de ModeloContador. Quando os botões são pressionados, o método incrementar ou decrementar atualiza a contagem, o que aciona uma atualização da view devido à propriedade @Published. Isso mantém nossa interface em sincronia com o estado subjacente.

Pré-visualização

Para ver sua ViewContador em ação, utilize o seguinte provedor de pré-visualização:

struct ViewContador_Previews: PreviewProvider {
    static var previews: some View {
        ViewContador()
    }
}

Quando Usar @ObservedObject vs @StateObject

É importante distinguir entre @ObservedObject e @StateObject:

• Use @StateObject quando você cria uma instância de um objeto observável pela primeira vez dentro da view. Isso significa que a view é responsável por gerenciar o ciclo de vida do objeto.

• Use @ObservedObject quando você deseja observar uma instância que já foi criada e que é passada para a view.

Exemplo de @StateObject

Aqui está um exemplo de uso de @StateObject em uma view pai:

struct ContentView: View {
    @StateObject var contador = ModeloContador() // Cria a instância aqui

    var body: some View {
        ViewContador(contador: contador)
    }
}

struct ViewContador: View {
    @ObservedObject var contador: ModeloContador // Observando a instância passada

    var body: some View {
        VStack {
            Text("Contagem Atual: \(contador.contagem)")
                .font(.largeTitle)
            HStack {
                Button(action: {
                    contador.incrementar()
                }) {
                    Text("Incrementar")
                }

                Button(action: {
                    contador.decrementar()
                }) {
                    Text("Decrementar")
                }
            }
        }
        .padding()
    }
}

Nesta ContentView modificada, usamos @StateObject para criar a instância de ModeloContador. A ViewContador agora a aceita como parâmetro e utiliza @ObservedObject para observá-la.

Conclusão

Nesta aula, aprendemos como usar ObservableObject e @ObservedObject no SwiftUI para gerenciar estado e atualizar views de forma responsiva. Ao aproveitar essas tecnologias, você pode construir aplicações mais dinâmicas e interativas. Compreender a distinção entre @StateObject e @ObservedObject é crucial para um gerenciamento de estado eficiente em suas aplicações SwiftUI. Boas codificações!

Navigation