SnapKit para Swift: guia completo com exemplos

O que é SnapKit e para que serve?

\n\n

SnapKit é uma biblioteca DSL (Domain-Specific Language) poderosa e elegante para trabalhar com Auto Layout em aplicativos iOS, macOS, tvOS e watchOS escritos em Swift. Se você já escreveu constraints manualmente usando a API padrão da Apple, sabe como isso pode ser verboso e difícil de ler. O SnapKit resolve esse problema fornecendo uma sintaxe limpa e intuitiva que torna o código de layout semelhante ao inglês comum.

\n\n

Para que serve o SnapKit?

\n

\n
• Legibilidade do código: Em vez de longas cadeias de chamadas NSLayoutConstraint(item:attribute:relatedBy:toItem:attribute:multiplier:constant:), você escreve view.snp.makeConstraints { $0.center.equalToSuperview() }.
\n
• Velocidade de desenvolvimento: O layout se torna mais rápido, pois o código é mais curto e fácil de entender.
\n
• Segurança de tipos: O SnapKit usa a tipagem estrita do Swift, reduzindo a probabilidade de erros em tempo de execução.
\n
• Flexibilidade: Suporta todos os recursos do Auto Layout: prioridades, proporções, atualização e substituição de constraints.
\n
• Comunidade ativa: A biblioteca é amplamente utilizada na indústria, possui excelente documentação e um grande número de exemplos.
\n

\n\n

Instalação do SnapKit

\n\n

O SnapKit pode ser instalado usando um dos gerenciadores de dependência populares para Swift. Abaixo estão as instruções para Swift Package Manager (SPM) e CocoaPods.

\n\n

1. Swift Package Manager (método recomendado)

\n

SPM é o gerenciador de pacotes integrado ao Xcode. É a maneira mais simples e moderna.

\n

\n
1. No Xcode, abra seu projeto.
\n
2. Vá para File → Add Packages...
\n
3. No campo de busca, insira a URL do repositório do SnapKit: https://github.com/SnapKit/SnapKit.git
\n
4. Selecione a versão desejada (recomenda-se a última estável) e clique em Add Package.
\n
5. Certifique-se de que o pacote foi adicionado ao seu target.
\n

\n\n

2. CocoaPods

\n

Se você usa CocoaPods, adicione a seguinte linha ao seu Podfile:

\n

platform :ios, '12.0'\nuse_frameworks!\n\ntarget 'YourAppTarget' do\n  pod 'SnapKit', '~> 5.6.0'\nend

\n

Em seguida, execute o comando pod install no terminal na pasta do seu projeto.

\n\n

3. Carthage (menos popular)

\n

Adicione ao Cartfile:

\n

github "SnapKit/SnapKit" ~> 5.6.0

\n

Execute carthage update e adicione o framework ao projeto.

\n\n

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

\n\n

Vamos criar uma tela simples com um quadrado vermelho centralizado na tela. Este é o clássico "Hello, World!" do layout.

\n\n

import UIKit\nimport SnapKit\n\nclass ViewController: UIViewController {\n\n    override func viewDidLoad() {\n        super.viewDidLoad()\n        setupUI()\n    }\n\n    private func setupUI() {\n        // 1. Criamos a view\n        let redView = UIView()\n        redView.backgroundColor = .red\n        view.addSubview(redView)\n\n        // 2. Aplicamos SnapKit para o layout\n        redView.snp.makeConstraints { make in\n            make.center.equalToSuperview() // Centralizamos em relação ao pai\n            make.width.height.equalTo(100) // Largura e altura = 100\n        }\n    }\n}

\n\n

O que está acontecendo aqui?

\n

\n
• redView.snp.makeConstraints é o ponto de entrada para a DSL do SnapKit. snp é uma propriedade especial que o SnapKit adiciona a todas as UIView.
\n
• Dentro do closure, recebemos o objeto make (ConstraintMaker), com o qual descrevemos as constraints.
\n
• make.center.equalToSuperview() centraliza a view vermelha em relação à view pai.
\n
• make.width.height.equalTo(100) define a largura e altura como 100 pontos.
\n