Executando verificação de segurança...
1

Desvendando MVVM e Coordinator em SwiftUI: Construindo seu Próprio App de Meditação

Dominando MVVM e Coordinator em SwiftUI: Criando um Aplicativo de Meditação

Neste artigo, vamos abordar dois padrões de design muito utilizados no desenvolvimento de aplicativos em Swift: Model-View-ViewModel (MVVM) e Coordinator. Usaremos como exemplo a criação de um aplicativo de meditação.

Entendendo o MVVM

O MVVM é um padrão de arquitetura de software estrutural que permite uma separação clara entre a lógica de negócios da interface do usuário. Ele é composto por três partes principais:

  • Model: Responsável pela lógica de negócios e pelo acesso aos dados.
  • View: Representa a interface do usuário.
  • ViewModel: Atua como uma ponte entre o Model e a View.

O que é o padrão Coordinator?

O padrão Coordinator é usado para lidar com o fluxo de navegação dentro do aplicativo. Em vez de ter a lógica de navegação espalhada pelas Views, o Coordinator centraliza tudo em um lugar.

Exemplo de código: Aplicativo de Meditação

Vamos começar definindo nossa Model. No nosso caso, teremos apenas uma classe SessaoMeditacao.

struct SessaoMeditacao {
    let id: UUID
    let titulo: String
    let duracao: Int // em minutos
}

Agora, vamos criar o ViewModel para gerenciar as sessões de meditação.

class SessaoViewModel: ObservableObject {
    @Published var sessoes: [SessaoMeditacao] = []

    func adicionarSessao(titulo: String, duracao: Int) {
        let novaSessao = SessaoMeditacao(id: UUID(), titulo: titulo, duracao: duracao)
        sessoes.append(novaSessao)
    }
}

Em seguida, criaremos o Coordinator. No nosso exemplo, teremos duas telas: uma para listar as sessões de meditação e outra para adicionar uma nova sessão.

protocol Coordinator {
    func start()
}

class MainCoordinator: Coordinator {
    let window: UIWindow

    init(window: UIWindow) {
        self.window = window
    }

    func start() {
        let viewModel = SessaoViewModel()
        let view = ContentView(viewModel: viewModel)
        let navigationView = NavigationView {
            view
        }

        window.rootViewController = UIHostingController(rootView: navigationView)
        window.makeKeyAndVisible()
    }
}

Finalmente, vamos criar as Views.

struct ContentView: View {
    @ObservedObject var viewModel: SessaoViewModel

    var body: some View {
        List(viewModel.sessoes, id: \.id) { sessao in
            Text("\(sessao.titulo) - \(sessao.duracao) minutos")
        }
        NavigationLink(destination: AdicionarSessaoView(viewModel: viewModel)) {
            Text("Adicionar Sessão")
        }
    }
}

struct AdicionarSessaoView: View {
    @ObservedObject var viewModel: SessaoViewModel

    @State var titulo: String = ""
    @State var duracao: Int = 0

    var body: some View {
        Form {
            TextField("Título", text: $titulo)
            Stepper(value: $duracao, in: 1...120) {
                Text("Duração: \(duracao) minutos")
            }
            Button(action: {
                viewModel.adicionarSessao(titulo: titulo, duracao: duracao)
            }) {
                Text("Salvar")
            }
        }
    }
}

No exemplo acima, usamos SwiftUI juntamente com MVVM e Coordinator para criar um aplicativo de meditação simples, onde podemos adicionar novas sessões de meditação. Utilizar estes padrões de design no desenvolvimento de aplicativos em Swift pode nos ajudar a manter o código limpo e fácil de manter, além de facilitar a testabilidade do código.

Carregando publicação patrocinada...