@APPSTORAGE en SWIFTUI en Español
Property Wrapper AppStorage en SwiftUI

@APPSTORAGE en SWIFTUI en Español

AppStorage en SwiftUI es otro Property Wrapper y lo usamos para persistir información. Este Property Wrapper usa por debajo la clase UserDefaults para almacenar información en una base de datos

SwiftBeta
Aprende SwiftUI desde cero

AppStorage en SwiftUI es otro Property Wrapper y lo usamos para persistir información. Este Property Wrapper usa por debajo la clase UserDefaults para almacenar información en una base de datos.

Hoy vamos a persistir información mientras usemos nuestra app. Y al cerrarla y volverla abrir recuperaremos esta información. ¿Esto qué significa? Tenemos que guardar esta información en algún lado ya que si la dejaramos en memoria y cerraramos la app, toda la información/estado que tuvieramos se perdería. Y es por eso que usaremos el Property Wrapper AppStorage en las propiedades que queremos guardar su estado.

AppStorage en código

Vamos a crear un formulario con un solo campo. Simulando que queremos guardar el nombre de un user. Será muy sencillo, solo tendrá 2 vistas:

  • Un TextField, para que el user pueda añadir el nombre.
  • Un Button, para coger el nombre introducido en el TextField y asignarlo a la propiedad con el Property Wrapper @AppStorage.

Primero vamos hacerlo con el Property Wrapper @State:

struct ContentView: View {
    
    @State var name: String = ""
    
    var body: some View {
        Form {
            TextField("Username", text: $name)
            HStack {
                Spacer()
                Button("Guardar") {
                    // TODO:
                }
                .padding()
                Spacer()
            }
        }
    }
}
Código Property Wrappr State en SwiftUI

Aquí el estado se guarda en memoria y si cerramos la app y la volvemos abrir, nuestro TextField está vacío. Tenemos que conseguir recuperar esta información.
Ahora lo que vamos hacer es crear otra propiedad con @AppStorage, el user introducirá un nombre en el TextField y al pulsar el Button de guardar se asignará el contenido del TextField a una nueva propiedad, que es esta que vamos a crear:

@AppStorage("appStorageName") var appStorageName: String = ""

Property Wrapper AppStorage en SwiftUI

Con esta propiedad vamos a persistir el contenido del TextField. Y por lo tanto si cerramos la app y la volvemos abrir podemos recuperar este valor. Fíjate que al usar AppStorage le hemos dado un nombre, esto es así para poder identificar este valor, le tenemos que dar un key por si en otra parte de nuestra aplicación queremos volver a acceder.
Pues vamos a asignar el contenido de la propiedad name a la propiedad appStorageName, cuando el Button sea pulsado:

struct ContentView: View {
    
    @State var name: String = ""
    @AppStorage("appStorageName") var appStorageName: String = ""
    
    var body: some View {
        Form {
            TextField("Username", text: $name)
            HStack {
                Spacer()
                Button(appStorageName.isEmpty ? "Guardar" : "Actualizar") {
                    appStorageName = name
                }
                .padding()
                Spacer()
            }
        }
    }
}
Código SwiftUI usando Property Wrapper @AppStorage

Si ejecutamos la app y le damos a guardar, vemos que el TextField está vacío. El name se ha guardado, pero lo que no hemos hecho ha sido darle el valor guardado y asignarselo al TextField para que lo muestre, esto lo podemos hacer en el .onAppear

struct ContentView: View {
    
    @State var name: String = ""
    @AppStorage("appStorageName") var appStorageName: String = ""
    
    var body: some View {
        Form {
            TextField("Username", text: $name)
            HStack {
                Spacer()
                Button(appStorageName.isEmpty ? "Guardar" : "Actualizar") {
                    appStorageName = name
                }
                .padding()
                Spacer()
            }
        }
        .onAppear {
            name = appStorageName
        }
    }
}
Código SwiftUI con modificador .onAppear

Ahora si estamos escribiendo en nuestro campo TextEditor y cerramos la app y la volvemos a abrir, el estado se recupera.

Hoy lo que hemos visto ha sido a ver un pequeño ejemplo de cómo almacenar información entre ejecuciones de nuestra app, una manera es usar AppStorage pero no es la única.

Hasta aquí el post de hoy, gracias por leernos! 🤓
👉👉 SUSCRÍBETE al CANAL de youtube
Si tienes preguntas no dudes en contactar con nosotros a través de Twitter

SwiftUI desde cero