Property Wrapper SceneStorage en SwiftUI
Property Wrapper SceneStorage en SwiftUI

@SCENESTORAGE en SWIFTUI en Español

SceneStorage en SwiftUI 2.0 es otro Property Wrapper para guardar el estado de nuestras pantallas. Nos sirve para recuperar el estado de nuestras pantallas si la app ha sido cerrada y dar sensación de continuidad al user, sin tener que volver a añadir toda la información que había.

SwiftBeta

Tabla de contenido


👇 SÍGUEME PARA APRENDER SWIFTUI, SWIFT, XCODE, etc 👇
Aprende SwiftUI desde cero Property Wrapper SceneStorage
Aprende SwiftUI desde cero Property Wrapper SceneStorage

SceneStorage en SwiftUI es otro Property Wrapper para guardar el estado de nuestras pantallas, ¿esto qué significa? imagina que estás rellenando un formulario y puede que lo dejes a medias, por que te llaman, minimizas la app, etc y al estar la app en background el sistema cierre tu app para liberar recursos y usarlos en otra app. Si volvemos abrir la app, esta información del formulario ha desaparecido y debes rellenarla de nuevo. Con SceneStorage podemos recuperar esta información y dejarlo por donde estaba, dando una sensación de continuidad al user dentro de la app.

SceneStorage es muy parecido al Property Wrapper AppStorage pero en este caso por debajo no usa la clase UserDefaults,utiliza otro sistema al que no podemos acceder. Y al usar SceneStorage solo sirve para guardar el estado de una escena, es decir, cada escena tiene su storage, no se puede compartir entre varias escenas.

Si el user cierra la app el Property Wrapper SceneStorage no persiste su valor, lo destruye. Al final del video veremos cómo probar correctamente este Property Wrapper para saber que funciona.

SceneStorage en código

Vamos a crear un formulario simulando que queremos publicar un Tweet, dentro de este formulario habrá un TextEditor, un Toggle y un Button.

  • En el TextEditor escribiremos nuestro Tweet.
  • El Toggle nos servirá para guardar la preferencia del usuario de publicar a la mejor hora ese Tweet.
  • Y el Button servirá para simular que envíamos el Tweet.

Toda esta información la recuperaremos cuando iniciemos la app. Parece complicado pero es muy fácil

Lo primero que vamos hacer es crear las 2 propiedades que usaremos para escribir el tweet, vamos hacerlo con lo que hemos visto hasta ahora:

struct ContentView: View {
    
    @State private var tweet: String = ""
    @State private var togglePublishBestHour: Bool = false
    
    var body: some View {
        Form {
            TextEditor(text: $tweet)
                .frame(width: 300, height: 200)
            Toggle("Publicar a la mejor hora", isOn: $togglePublishBestHour)
                .padding()
            HStack {
                Spacer()
                Button(togglePublishBestHour ? "Publicar a la mejor hora 🍀" : "Publicar Ahora 🐥") {
                    print("Publicando...")
                }
                .padding()
                Spacer()
            }
        }
    }
}
Código SwiftUI con Property Wrapper State

Aquí el estado se guarda en memoria. Si cerramos la app y la volvemos a abrir nuestro TextEditor está vacío. Ahora lo que debemos hacer es cambiar el Property Wrapper @State por @SceneStorage:

@SceneStorage("tweet") var tweet: String = ""
@SceneStorage("toggle_publish_best_hour") var togglePublishBestHour: Bool = false

Al usar el SceneStorage debemos especificar una key, un nombre que identifique al dato que queremos guardar. En nuestro caso he escogido tweet y toggle_publish_best_hour

Todo el código quedaría de la siguiente manera:

struct ContentView: View {
    
    @SceneStorage("tweet") var tweet: String = ""
    @SceneStorage("toggle_publish_best_hour") var togglePublishBestHour: Bool = false
    
    var body: some View {
        Form {
            TextEditor(text: $tweet)
                .frame(width: 300, height: 200)
            Toggle("Publicar a la mejor hora", isOn: $togglePublishBestHour)
                .padding()
            HStack {
                Spacer()
                Button(togglePublishBestHour ? "Publicar a la mejor hora" : "Publicar Ahora") {
                    print("Publicando...")
                }
                .padding()
                Spacer()
            }
        }
    }
}
Código SwiftUI con SceneStorage

Ahora si estamos escribiendo nuestro tweet y minimizamos la app y simulamos que el sistema la cierrar. Al volverla abrir el estado se recupera.