Cómo utilizar @State y @Binding en SwiftUI

@binding y @state son dos propiedades utilizadas en SwiftUI para gestionar el estado de una vista y su interacción con otros elementos de la UI.

SwiftUI utiliza un enfoque declarativo en lugar de la programación imperativa utilizada en otros frameworks de interfaz de usuario, lo que significa que en lugar de escribir código que indique cómo se deben dibujar las vistas en la interfaz de usuario, simplemente se declara qué se debe mostrar en la interfaz y SwiftUI se encarga de dibujar las vistas de la manera correcta.

Esto permite a los desarrolladores crear aplicaciones de forma más rápida y fácil.

Diferencia entre @Binding y @State

Comenzando por @binding esta es una propiedad que se utiliza para crear una vinculación entre una vista y una propiedad de un objeto externo, mientras que @state es una propiedad que se utiliza para almacenar el estado interno de una vista.

Es decir, @binding se utiliza para sincronizar el estado de una vista con el estado de un objeto externo. Por otro lado @state se utiliza para almacenar el estado interno de una vista que puede cambiar en función de la UI.

Ejemplo de @Binding y @State

Un ejemplo sencillo de cómo se podría utilizar @binding y @state en SwiftUI podría ser el siguiente:

struct MiVista: View {
    @Binding var nombre: String // Crea una vinculación con una propiedad externa
    @State var contador: Int = 0 // Crea una propiedad interna con un valor inicial de 0
    
    var body: some View {
        VStack {
            Text(nombre) // Muestra el valor de la propiedad externa
            Button(action: {
                self.contador += 1 // Aumenta el valor de la propiedad interna cuando se pulsa el botón
            }) {
                Text("Pulsa aquí")
            }
            Text("Pulsado \(contador) veces") // Muestra el valor de la propiedad interna
        }
    }
}

En este ejemplo, la vista MiVista utiliza @binding para crear una vinculación con una propiedad externa llamada «nombre» y @state para crear una propiedad interna llamada «contador».

Al pulsar el botón, el valor de la propiedad interna «contador» aumenta en uno y se muestra en pantalla, mientras que el valor de la propiedad externa «nombre» se muestra tal como se establece desde fuera de la vista.

Cabe recordar que para depurar SwiftUI es necesario ejecutarlo en un dispositivo físico o simulador, las previsualizaciones de SwiftUI no se enlazan a ningún depurator, si te gustaría saber más acerca de qué depurador utiliza Xcode, échale un vistazo a este artículo acerca de lldb.