Frameworks são ótimos para modularizar seu código, dividindo componentes reutilizáveis ​​em um pacote separado de código.

Por exemplo, considere um aplicativo que fornece a funcionalidade de gravação de tela. Movemos os métodos e classes relacionados à gravação para uma estrutura diferente, chamando-a de RecordingKit. Essa estrutura é criada com a reutilização em mente e pode ser usada em outros cenários também. Além disso, outros engenheiros podem trabalhar nele de forma independente.

Neste artigo, aprenderemos estas etapas:

Crie um framework Importe-o para um projeto Use-o em um projeto

A seguir junto, você deve ter conhecimento básico da linguagem Swift e experiência em trabalhar com o Xcode.

Introdução

Com a recente mania no mercado de ações e criptomoeda, queremos um aplicativo de rastreamento de investimento. Eles rastrearão os preços das ações em uma bolsa de valores e algumas criptomoedas, respectivamente.

O aplicativo precisa de uma tela de configurações e, para manter a consistência, não queremos duplicar o código. Então, vamos criar uma estrutura chamada SettingsKit para reutilizar em nosso aplicativo (ou talvez mais no futuro).

Criando uma nova estrutura

Abra o Xcode e crie um novo projeto. Selecione Estrutura na seção iOS .

Preencha as opções do modelo conforme a seguir e clique em Avançar :

Nome do produto: SettingsKit Organization Identifier: O identificador que você deseja usar para sua estrutura. Por exemplo, com.rudrankriyam.SettingsKit Language: Swift Desmarque a opção Incluir testes

Escolha um diretório para salvar a estrutura e clique em Criar .

Agora, crie uma nova visualização SwiftUI e nomeie-a como SettingsRow.swift. Esta é uma linha genérica com um nome e imagem, com um indicador de divulgação. Certifique-se de verificar a estrutura nos destinos.

Copie o seguinte código para SettingsRow dentro do arquivo:

public struct SettingsRow: View {private var title: String private var image: String private var showDisclosure: Bool///Uma linha de configurações genéricas que pode ser personalizada de acordo com suas necessidades.///-Parâmetros:///-título: O título da linha.///-imagem: O símbolo SF para a linha.///-showDisclosure: Mostra o ícone de divulgação para ação ou navegação. public init (_ title: String, image: String, showDisclosure: Bool=false) {self.image=image self.title=title self.showDisclosure=showDisclosure} public var body: some Exibir {HStack (espaçamento: 8) {Imagem (systemName: image).font (.headline).frame (minWidth: 25, alinhamento:.leading).accessibility (hidden: true) Text (title) Spacer () if showDisclosure {Image (systemName:”chevron.right”).accessibility (hidden: true)}}.padding (.vertical.foregroundColor (.accentColor)}}

Esta visualização pode ser usada em locais para mostrar a versão do aplicativo ou direitos autorais. Neste caso, temos o ícone de divulgação oculto por padrão. Como queremos acessar a visualização fora da própria estrutura e usá-la em nossos próprios aplicativos, alteramos o nível de acesso da estrutura como público.

Outro caso de uso é uma ação a ser executada em um linha. Crie o arquivo SettingsActionRow e adicione o seguinte:

public struct Set tingsActionRow: Exibir {private var image: String private var title: String private var action: ()-> ()///Uma linha de configuração genérica que pode ser personalizada de acordo com suas necessidades.///-Parâmetros:///-título: O título da linha.///-imagem: O símbolo SF para a linha.///-ação: A ação personalizada que você deseja executar ao tocar na linha. public init (_ title: String, image: String, action: @escaping ()-> ()) {self.image=image self.title=title self.action=action} public var body: some Exibir {Botão (ação: action) {SettingsRow (title, image: image, showDisclosure: true)}.buttonStyle (PlainButtonStyle ())}}

O código do cliente fornece uma ação; por exemplo, revisar o aplicativo na loja ou abrir as contas sociais do aplicativo.

Para navegar para outra visualização, criamos outra visualização chamada SettingsNavigationRow:

public struct SettingsNavigationRow : View {private var title: String private var image: String private var destination: Destination///Uma linha de configurações genéricas que pode ser personalizada de acordo com suas necessidades.///-Parâmetros:///-título: O título da linha.///-imagem: O símbolo SF para a linha.///-destino: a vista para a qual navegar, depois de tocar na linha. public init (_ title: String, image: String, destination: Destination) {self.image=image self.title=title self.destination=destination} public var body: some View {NavigationLink (destination: destination) {SettingsRow (title , image: image, showDisclosure: true)}.buttonStyle (PlainButtonStyle ())}}

Depois de algumas linhas semelhantes, nós as agrupamos usando uma cor de fundo secundária, como na tela de configurações do iOS. Adicione o seguinte modificador:

public extension View {func settingsBackground (cornerRadius: CGFloat=16, innerPadding: CGFloat=8, outerPadding: CGFloat=16)-> some View {self.padding (.horizontal, 16).padding (.vertical, innerPadding).background (RoundedRectangle (cornerRadius: cornerRadius, style:.continuous).fill (Color (.secondarySystemBackground))).padding (outerPadding)}}

Com isso, criamos nossa primeira estrutura pronto para ser utilizado em nossos aplicativos!

Criando um novo projeto

Abra o Xcode, selecione Criar um novo projeto Xcode e selecione o Aplicativo modelo sob o cabeçalho iOS .

Preencha as opções de modelo conforme a seguir e clique em Próximo :

Nome do produto: Stocktance Nome da organização: Preencha como quiser Identificador da organização: O identificador que você usa para seus aplicativos Interface: SwiftUI Life Cycle: SwiftUI App Language: Swift Certifique-se de’desmarcamos as opções Usar dados principais , Incluir testes de unidade e Testes de IU

Escolha um diretório para salvar nosso projeto e clique em Criar .

Agora que temos nosso projeto pronto, importamos o framework para nosso aplicativo.

Importando o framework para o projeto

Existem duas maneiras de adicionar o projeto ao seu aplicativo:

Arraste a estrutura para o navegador do projeto e, em seguida, adicione a estrutura ao destino Adicione a estrutura ao projeto e, em seguida, adicione a estrutura para o destino

Ambos são de um tipo semelhante, portanto, preferiremos a última opção. No aplicativo, selecione o projeto no navegador do projeto, selecione o destino Estoque e role até Estruturas, bibliotecas e conteúdo incorporado .

Clique em o botão de adição, clique em Adicionar outro… e selecione Adicionar arquivos…

Navegue até a pasta SettingsKit e selecione-a. Adicionamos a estrutura ao projeto. Para adicioná-lo ao nosso destino, clique no botão de adição novamente e você encontrará SettingsKit.framework no topo. Selecione-o para adicioná-lo ao nosso destino.

Agora, adicionamos com sucesso a estrutura ao nosso aplicativo! É hora de usá-lo!

Usando a estrutura no projeto

Crie um novo arquivo SwiftUI chamado SettingsView em Stocktance e, no início do arquivo, importe nossa estrutura:

import SettingsKit

Assim como importamos a estrutura SwiftUI da Apple para aproveitar tudo o que eles têm a oferecer, importamos nosso framework para criar a visualização de configurações.

Adicione o seguinte ao SettingsView:

struct SettingsView: View {let appVersion=Bundle.main.infoDictionary? [“CFBundleShortVersionString”] as! String var body: some View {NavigationView {ScrollView {VStack {SettingsNavigationRow (“Account”, image:”person.crop.circle”, destination: Text (“Accounts Screen”)) SettingsNavigationRow (“Phone Numbers”, image:”number.circle”, destino: Texto (“Tela do telefone”)) SettingsNavigationRow (“Notificações”, imagem:”bell.circle”, destino: Texto (“Tela de notificações”))}.settingsBackground () VStack {SettingsRow (“Versão do aplicativo \ (appVersion)”, image:”doc.append”)}.settingsBackground ()}.navigationTitle (“Settings”)}}}

Com poucas linhas de código, graças ao framework que criamos anteriormente, criamos um simples visualizações para nossa tela de configurações. Você também pode usar essa estrutura em qualquer outro aplicativo para manter a consistência de suas configurações.

Para adicionar o SettingsView no aplicativo, copie o seguinte em ContentView.swift:

struct Stock {var nome: String var price: Double} extension Stock {static let testStocks=[Stock (name:”Banana”, price: 125), Stock (name:”TapeBook”, price: 320), Stock (name:”Ramalon”, price: 3200)]} struct ContentView: View {var body: some View {NavigationView {List (Stock.testStocks, id: \.name, rowContent: WatchlistRow.init).navigationTitle (“Stocktance”).toolbar {NavigationLink (destino: SettingsView ()) {Image (systemName:”gear”)}}}.accentColor (.purple)}} struct WatchlistRow: View {var stock: Stock var body: some View {HStack {Text (stock.name) Spacer ( ) Texto (“$”+ String (formato:”%.2f”, stock.price)).f oregroundColor (.white).padding (8).background (RoundedRectangle (cornerRadius: 8).fill (Color (.systemGreen)))}.padding (.vertical)}}

Execute o aplicativo para ver o código do framework em ação!

Conclusão

Conforme seu aplicativo é dimensionado, é um excelente plano dividir o código em componentes individuais e pedaços reutilizáveis ​​em estruturas. Por exemplo, você pode ter a camada de rede como uma estrutura, isolada do aplicativo principal. Ou um AnalyticsKit para lidar com as análises. Se o provedor mudar, você só precisa fazer mudanças na estrutura, já que a implementação primária é separada do aplicativo.

Para compartilhar sua estrutura como uma biblioteca de código aberto ou compartilhá-la internamente com a equipe, você pode usar o Gerenciador de pacotes Swift para gerenciar a distribuição do código.