Ei! Gostaria de falar sobre uma estrutura para criar interfaces de usuário no iOS e macOS. É muito conveniente de usar porque emprega uma abordagem declarativa para programação. Com o SwiftUI, você pode descrever o que sua interface deve fazer e se parecer, e a estrutura cuidará do resto. o SwiftUI, Um dos principais elementos do SwiftUI é o uso de wrappers de propriedade. Esses são elementos funcionais que permitem fornecer lógica adicional para propriedades. SwiftUI tem cinco wrappers de propriedade principais: @Estado @Vinculativo @ObservedObject @StateObject @EnvironmentObject Eles se tornarão seus melhores amigos no desenvolvimento. @Estado permite criar propriedades que podem ser alteradas e, se necessário, atualizar a interface com base nessas alterações. Por exemplo, se você deseja criar um botão que muda de cor quando pressionado, você pode criar uma variável @State para armazenar a cor e adicioná-la ao botão: @State struct MyButton: View { @State var buttonColor = Color.blue var body: some View { Button("Press me!") { buttonColor = Color.red } .background(buttonColor) } } @Vinculativo permite que você use um valor Normalmente é usado no SwiftUI para passar um valor de uma visualização para outra, permitindo que elas interajam umas com as outras. Por exemplo, imagine que temos duas visualizações - uma com um campo de texto e outra com um botão. Queremos que o campo de texto seja atualizado quando o usuário pressiona o botão. Para fazer isso, podemos usar @Binding: @Binding armazenado em uma parte do código em outra parte do código. struct ContentView: View { @State private var text = "" var body: some View { VStack { TextField("Enter text", text: $text) Button("Update text") { text = "New text" } SecondView(text: $text) } } } struct SecondView: View { @Binding var text: String var body: some View { Text(text) } } Neste exemplo, é usado para passar o valor de (que está em ) para (que está em ), então quando o usuário pressionar o botão, o campo de texto será atualizado e exibirá o novo texto. @Binding $text ContentView text SecondView @ObservedObject é usado para marcar as propriedades que são Este wrapper de propriedade se inscreve nas alterações no objeto que está em conformidade com o e atualiza automaticamente as partes relevantes da interface se os dados forem alterados. Aqui está um breve exemplo de uso de : @ObservedObject observadas e podem mudar dependendo das mudanças de dados externos. protocolo ObservableObject @ObservedObject class UserData: ObservableObject { @Published var name = "John" } struct ContentView: View { @ObservedObject var userData = UserData() var body: some View { VStack { Text("Hello, \(userData.name)!") TextField("Enter your name", text: $userData.name) } } } Neste exemplo, criamos uma classe chamada UserData, que contém um nome @Published. Na estrutura ContentView, criamos uma propriedade chamada userData com o tipo UserData, Exibimos o valor de userData.name em um campo de texto e o exibimos na tela. utilizando @ObservedObject. Quando o usuário altera o valor no o SwiftUI atualiza automaticamente a parte correspondente da interface, pois a propriedade é publicada e observada usando Isso significa que não precisamos de nosso próprio código para atualizar a interface e permitimos que o SwiftUI faça isso por nós. campo de texto, name @Published. Se você não sabe, @Published é um wrapper de propriedade do framework Combine que pode ser adicionado a uma propriedade de classe ou estrutura, que envia automaticamente notificações de qualquer alteração no valor dessa propriedade para qualquer pessoa que a tenha assinado . Em outras palavras, é um atributo auxiliar para propriedades que podem ser rastreadas quanto a alterações. Nota: @StateObject é um wrapper de propriedade usado Isso significa que o objeto é armazenado enquanto a exibição existir e é destruído junto com ele. Normalmente, usar é mais prático para objetos de classe necessários para exibições, não apenas Por exemplo: @StateObject para inicializar um objeto de classe e armazená-lo no estado de exibição em SwiftUI. @StateObject várias uma. class UserData: ObservableObject { @Published var name = "John" @Published var age = 30 } struct ContentView: View { @StateObject var userData = UserData() var body: some View { NavigationView { VStack { Text("Name: \(userData.name)") Text("Age: \(userData.age)") NavigationLink( destination: ProfileView(userData: userData), label: { Text("Edit Profile") }) } .navigationTitle("Home") } } } struct ProfileView: View { @ObservedObject var userData: UserData var body: some View { Form { TextField("Name", text: $userData.name) Stepper("Age: \(userData.age)", value: $userData.age) } .navigationTitle("Profile") } } Neste exemplo, é um objeto de uma classe que contém várias propriedades que podem ser usadas em várias exibições. A classe é marcada como para que possa ser usada com e . UserData ObservableObject @StateObject @ObservedObject Em criamos um novo objeto usando para salvar o estado entre as transições entre diferentes exibições. Nesse caso, exibe os dados do usuário, os visualiza e contém um link para outra exibição que pode ser usado para editar os dados do usuário. ContentView, UserData @StateObject ContentView (ProfileView) Em , obtemos acesso ao mesmo objeto usando para modificar os dados do usuário. Quando o usuário altera os dados, eles são atualizados automaticamente no porque o mesmo objeto é usado. ProfileView UserData @ObservedObject ContentView UserData use @ObservedObject se precisar observar alterações em um objeto de classe a partir de uma exibição e @StateObject se precisar salvar o estado de um objeto de classe que afeta a exibição de várias exibições. Observação: Se você usar @ObservedObject em vez de @StateObject para um objeto necessário em várias exibições, cada exibição terá sua própria instância do objeto, o que pode levar a problemas com a sincronização de dados entre as exibições. Portanto, neste caso, é melhor usar @StateObject. @EnvironmentObject é um wrapper de propriedade para Ele permite o acesso ao objeto de dados a partir de qualquer visualização na hierarquia SwiftUI que pertença ao container Ambiente (por exemplo, Cena, Visualização, Aplicativo, etc.). Por exemplo, imagine que temos um aplicativo de gerenciamento de lista de tarefas. Podemos ter um raiz que contém uma lista de tarefas e a capacidade de criar novas tarefas. Para isso, criamos uma visualização separada que exibe a lista de tarefas e um botão para adicionar novas tarefas. Depois de adicionar uma nova tarefa, o usuário deve ser redirecionado para a tela de adição de tarefas, então criamos uma exibição separada. @EnvironmentObject passar objetos de dados pela hierarquia de exibição do SwiftUI. ContentView TaskListView AddTaskView Para passar o objeto para todas as três exibições, podemos criar sua instância em e passá-lo como um parâmetro para e . No entanto, isso pode se tornar um problema se decidirmos adicionar ainda mais exibições aninhadas, pois precisaremos passar por várias exibições intermediárias. UserManager ContentView TaskListView AddTaskView o UserManager Em vez disso, podemos usar para passar para baixo na hierarquia de exibição. Dessa forma, todas as visualizações que precisam acessar o podem simplesmente declará-lo como um e usá-lo conforme necessário. @EnvironmentObject UserManager UserManager @EnvironmentObject struct TaskManagerApp: App { @StateObject var userManager = UserManager() var body: some Scene { WindowGroup { ContentView() .environmentObject(userManager) } } } struct ContentView: View { var body: some View { NavigationView { TaskListView() } } } struct TaskListView: View { @EnvironmentObject var userManager: UserManager var body: some View { List(userManager.tasks) { task in TaskRow(task: task) } .navigationBarTitle("Tasks") .navigationBarItems(trailing: Button(action: { // Navigate to AddTaskView }) { Image(systemName: "plus") } ) } } struct AddTaskView: View { @EnvironmentObject var userManager: UserManager var body: some View { // Add new task using userManager } } Portanto, agora o objeto será passado automaticamente para e via . Observe que podemos modificar o estado de em uma visualização e as alterações serão refletidas automaticamente na outra visualização. UserManager TaskListView AddTaskView @EnvironmentObject UserManager O artigo abordou os wrappers básicos de propriedade SwiftUI: @State, @Binding, @ObservedObject, @StateObject, @EnvironmentObject. Esses wrappers de propriedade formam a base do trabalho com o estado do aplicativo no SwiftUI. Use este artigo como uma folha de dicas para ter os wrappers de propriedade básicos ao seu alcance, necessários para desenvolver aplicativos com SwiftUI. Ao aplicar esse conhecimento, você poderá criar interfaces de usuário mais complexas com estados que mudam dinamicamente e integrar dados de seus modelos no SwiftUI.

The code in this story is for educational purposes. The readers are solely responsible for whatever they build with it.

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

Este áudio é produzido no idioma original da história!

Muito longo; Para ler

Making security fun one episode at a time

Os 5 principais wrappers de propriedade do SwiftUI e como usá-los efetivamente

Muito longo; Para ler

Mykhailo Tseitlin

STORY’S CREDIBILITY

Code License

Guide

About Author

Rótulos

Languages

ESTE ARTIGO FOI APRESENTADO EM...

Os 5 principais wrappers de propriedade do SwiftUI e como usá-los efetivamente

Muito longo; Para ler

Mykhailo Tseitlin

STORY’S CREDIBILITY

Code License

Guide

About Author

Rótulos

Languages

ESTE ARTIGO FOI APRESENTADO EM...

HISTÓRIAS RELACIONADAS