Na semana passada, vi que a comunidade está tentando transferir padrões de desenvolvimento comprovados do UIKit para o SwiftUI. Mas tenho certeza de que a melhor maneira de escrever código eficiente usando o SwiftUI é esquecer tudo sobre o UIKit e mudar completamente sua mentalidade em termos de desenvolvimento da interface do usuário. Nesta semana, falarei sobre as principais diferenças entre o desenvolvimento usando o UIKit e o SwiftUI.
Definição de diferenças
O UIKit é uma estrutura orientada a eventos imperativa para a criação de interfaces de usuário para a plataforma iOS. Isso significa que você deve lidar com todas as alterações de estado durante eventos, como carregar uma visualização, clicar em um botão etc. Uma grande desvantagem dessa abordagem é a dificuldade de sincronizar a interface do usuário com seu estado. Assim que o estado mudar, você deverá adicionar / excluir / mostrar / ocultar manualmente as visualizações e sincronizá-las com o estado atual do aplicativo.
SwiftUI é uma estrutura declarativa para criar interfaces de usuário para todas as plataformas Apple. A palavra-chave neste caso é declarativa. Declarativo significa que o desenvolvedor precisa declarar o que deseja alcançar, e a estrutura cuidará disso. A estrutura conhece a melhor maneira de renderizar a interface do usuário.
UI = f(state)
No SwiftUI, a interface do usuário é uma função de seu estado. Isso significa que sempre que o estado de uma exibição é alterado, ele recupera sua propriedade do corpo e gera uma nova exibição. Considere o seguinte exemplo.
struct ContentView: View { @ObservedObject var store: Store var body: some View { Group { if store.isLoading { Text("Loading...") .font(.subheadline) } else { Image("photo") .font(.largeTitle) } } } }
No exemplo acima, há uma exibição que exibe o texto "Carregando ..." e exibe imagens no final do download.
ObserverObject é o estado dessa visão e, assim que muda, o SwiftUI recalcula a propriedade body e atribui uma nova visão. Durante o desenvolvimento usando o UIKit, é necessário ocultar / mostrar manualmente os elementos da hierarquia da apresentação, mas no SwiftUI não há necessidade de adicionar / remover um indicador de carregamento. Existem várias maneiras no SwiftUI para descrever o estado de uma exibição, para saber mais sobre elas, consulte “
Wrappers de propriedades no SwiftUI ”.
Agora, veremos mais de perto o que acontece quando o estado da exibição é alterado. O SwiftUI tem uma impressão da hierarquia atual de visualizações e, assim que seu estado muda, calcula uma nova visualização. O SwiftUI aplica algoritmos de comparação para entender as diferenças e adicionar / remover / atualizar automaticamente as visualizações necessárias. Por padrão, o SwiftUI usa a imagem de transição de entrada / saída padrão para mostrar / ocultar as visualizações, mas também é possível alterar manualmente a transição para qualquer outra animação. Para saber mais sobre transição e animações no SwiftUI, dê uma olhada no meu artigo "
Animações no SwiftUI ".
Hierarquia de apresentação
Vamos falar sobre a hierarquia de visualizações e como o SwiftUI realmente exibe a estrutura das visualizações. A primeira coisa que quero mencionar é que o SwiftUI não exibe a estrutura da visualização pelo mapeamento individual. É possível usar quantos contêineres de visualização você quiser, mas no final, o SwiftUI exibe apenas as visualizações que fazem sentido para a renderização. Isso significa que você pode extrair a lógica deles em pequenas representações e depois compor e reutilizá-las no aplicativo. Não se preocupe, o desempenho do aplicativo, neste caso, não sofrerá. Para saber mais sobre como criar visualizações no SwiftUI, dê uma olhada
neste artigo .
A melhor maneira de entender a hierarquia de representações complexas no SwiftUI é exibir seu tipo. O SwiftUI usa um sistema de tipo estático para determinar a diferença com bastante rapidez. Primeiro, ele verifica o tipo de visão e, em seguida, verifica os valores dos componentes da visão. Eu não sou fã de usar reflexões no código de trabalho, mas é muito útil no processo de aprendizado.
print(Mirror(reflecting: ContentView(store: .init()).body))
Usando a estrutura Mirror, você pode exibir o tipo real do corpo do ContentView e descobrir como o SwiftUI funciona.
Conclusões
Nesta semana, aprendemos a principal diferença entre UIKit e SwiftUI e examinamos em detalhes o algoritmo de comparação no SwiftUI. Espero que tenham gostado do artigo. Obrigado pela leitura e até a próxima semana!