SwiftUI para Swift: guia completo com exemplos

O que é SwiftUI e para que serve?

SwiftUI é um framework moderno e declarativo para construir interfaces de usuário em todas as plataformas Apple: iOS, macOS, watchOS e tvOS. Diferente da abordagem tradicional do UIKit (onde você gerencia manualmente o estado e a atualização das views), o SwiftUI permite descrever como a interface deve ser, e não como construí-la. O framework rastreia automaticamente as alterações nos dados e redesenha apenas as partes da interface que foram alteradas.

Para que serve?

\n
• Menos código: O mesmo código funciona em todas as plataformas Apple.
\n
• Declaratividade: Você descreve a interface como um conjunto de estruturas simples, em vez de uma sequência de comandos.
\n
• Gerenciamento automático de estado: @State, @Binding, @ObservableObject — o SwiftUI decide por si só quando redesenhar a interface.
\n
• Visualização ao vivo: No Xcode, você vê as alterações em tempo real.
\n
• Animações: Adicionar animações é uma linha de código.
\n

SwiftUI não é uma biblioteca que precisa ser instalada separadamente. É um framework integrado, disponível a partir do iOS 13, macOS 10.15, watchOS 6 e tvOS 13. Ele vem junto com o Xcode e o SDK da Apple.

Instalação (Configuração do projeto)

Como o SwiftUI faz parte do SDK padrão da Apple, ele não precisa ser instalado via pip, npm ou CocoaPods. Tudo o que você precisa é do Xcode (versão 11 ou superior) e um projeto configurado para iOS 13+ / macOS 10.15+.

Como criar um novo projeto com SwiftUI:

\n
1. Abra o Xcode.
\n
2. Selecione File → New → Project.
\n
3. Escolha o modelo "App" (ou "SwiftUI App" em versões mais antigas).
\n
4. Certifique-se de que no campo "Interface" esteja selecionado "SwiftUI".
\n
5. Clique em "Next" e crie o projeto.
\n

Se você estiver trabalhando com um projeto UIKit existente, pode adicionar um arquivo SwiftUI (File → New → File → SwiftUI View). SwiftUI e UIKit podem coexistir no mesmo projeto através de UIHostingController.

Início rápido com exemplo de código

Vamos criar um aplicativo simples "Contador de Cliques". Este é um exemplo clássico que mostra os conceitos básicos do SwiftUI: estado, botões e texto.

import SwiftUI\n\nstruct ContentView: View {\n    // @State — é uma propriedade que armazena o estado e redesenha automaticamente a View quando alterada\n    @State private var count = 0\n\n    var body: some View {\n        VStack(spacing: 20) {\n            Text("Contador: \\(count)")\n                .font(.largeTitle)\n                .padding()\n\n            HStack(spacing: 20) {\n                Button("Aumentar") {\n                    count += 1\n                }\n                .padding()\n                .background(Color.blue)\n                .foregroundColor(.white)\n                .cornerRadius(10)\n\n                Button("Resetar") {\n                    count = 0\n                }\n                .padding()\n                .background(Color.red)\n                .foregroundColor(.white)\n                .cornerRadius(10)\n            }\n        }\n    }\n}\n\n// Ponto de entrada do aplicativo\n@main\nstruct MyApp: App {\n    var body: some Scene {\n        WindowGroup {\n            ContentView()\n        }\n    }\n}\n

Explicação:

\n
• @State — diz ao SwiftUI que esta propriedade deve ser rastreada. Quando count é alterado, o SwiftUI redesenha automaticamente o ContentView.
\n
• VStack e HStack — são contêineres para disposição vertical e horizontal dos elementos.
\n
• Button — cria um botão que executa uma closure ao ser pressionado.
\n
• Modificadores (.font(), .padding(