Comment gérer ses données avec SwiftUI

La gestion efficace des données est un élément clé pour le succès de toute application iOS.

Avec Swift, nous disposons de nombreuses options pour stocker et manipuler les données. Et grâce à SwiftUI, la gestion des données devient encore plus simple et efficace ! En effet, SwiftUI utilise une approche déclarative qui permet de mettre à jour automatiquement les parties de l’interface utilisateur concernées lorsque les données changent. Ces mises à jour se font à la suite d’une action de l’utilisateur ou d’un événement externe.

Cela nous permet donc de nous concentrer sur la logique de notre application plutôt que sur la mise à jour manuelle de l’interface.

Dans cet article, nous allons explorer les bases de la gestion des données avec SwiftUI.

@State

@State est une propriété que nous ajoutons devant la déclaration d’une variable. Elle indique que le changement de valeur de la variable va entraîner une modification des données de l’application.

struct ContentView: View {
    struct ToggleState {
        var isOn: Bool = false
    }

    @State private var toggleState = ToggleState()
    
    var body: some View {
        Toggle("Toggle 1", isOn: $toggleState.isOn)
    }
}

Par exemple, ici nous créons un « bouton toggle », qui pourra être soit on, soit off.

L’attribut @State signifie que la valeur de toggleState peut être modifiée dans la vue, et que la vue est automatiquement rafraîchie chaque fois que toggleState change.

La vue contient simplement un Toggle qui affiche le texte « Toggle 1 » et est lié à la variable isOn de toggleState à l’aide de la syntaxe $toggleState.isOn. Cela signifie que lorsque l’utilisateur active ou désactive le Toggle, la variable isOn est mise à jour automatiquement.

On pourrait imaginer par la suite un changement de couleur du texte en fonction de la valeur de isOn.

Attention, on ne peut utiliser @State qu’avec des structures ! Dès lors qu’on utilise une classe, l’application crashe.

Souviens toi, une structure est un type de valeur. C’est à dire que la valeur, lorsqu’elle a été copiée dans une nouvelle variable, ne pourra pas changer. Elle sera unique et comme « recréée » à chaque changement d’état.

struct ToggleState {
    var isOn: Bool = false
}

Le gros inconvénient de @State est qu’elle est uniquement disponible dans sa propre vue.

• @StateObject

@StateObject permet de gérer l’état d’un objet à long terme dans une vue. Cette propriété ne nécessite pas que l’objet soit passé à l’extérieur de la vue, et n’est pas destiné à être partagé avec d’autres vues.

Lorsqu’une vue utilise StateObject, SwiftUI crée automatiquement une instance de cet objet et la stocke dans la mémoire à long terme pour la durée de vie de la vue. La vue peut ensuite utiliser l’objet pour stocker et gérer son propre état.

class UserSettings: ObservableObject {
    @Published var isDarkModeEnabled = false
}

struct ContentView: View {
    @StateObject var userSettings = UserSettings()

    var body: some View {
        Toggle("Dark Mode", isOn: $userSettings.isDarkModeEnabled)
    }
}

Ici, la vue La vue peut utiliser userSettings pour stocker et gérer l’état de la préférence de l’utilisateur.

@Binding

@Binding nous permet de partager la valeur d’une variable à travers différentes vues. Cela permet de partager l’état entre plusieurs vues et de garantir que les modifications apportées à l’état sont reflétées dans toutes les vues concernées.

struct ParentView: View {
    @State private var isOn = false
    
    var body: some View {
        ChildView(isOn: $isOn)
    }
}

struct ChildView: View {
    @Binding var isOn: Bool
    
    var body: some View {
        Toggle("Toggle", isOn: $isOn)
    }
}

La syntaxe $isOn crée une liaison entre isOn dans ParentView et isOn dans ChildView.

Lorsque l’utilisateur active ou désactive le Toggle dans ChildView, la valeur de isOn est mise à jour dans ParentView, ce qui entraîne une mise à jour automatique de l’interface utilisateur dans les deux vues.

La valeur d’une variable dans une vue est directement liée à la valeur d’une variable dans une autre vue.

@EnvironmentObject & @Observed Object

• @EnvironmentObject est conçu pour que les types de référence soient partagés entre de nombreuses vues.

C’est à dire que si tu as besoin de faire transiter des informations d’une vue à l’autre, tu peux l’utiliser. Elle est très utile quand tu as besoin de passer beaucoup de données dans ton application. Comme ça, il n’y a aucun risque de désynchroniser les différentes parties de ton application.

Lorsqu’une vue utilise @EnvironmentObject, SwiftUI recherche automatiquement l’objet dans l’environnement de la vue parente la plus proche qui en a une instance et l’utilise.

• @ObservedObject surveille les modifications d’un objet au sein de sa vue.

Cela signifie que la propriété ObservedObject doit être initialisée à l’intérieur de la vue, et que la vue elle-même est responsable de la gestion de cet objet. Cela permet à la vue de rester synchronisée avec les changements dans l’objet observable.

class DataModel: ObservableObject {
    @Published var name = "Pomme"
    @Published var isEnabled = false
}

struct MyView: View {
    @StateObject private var model = DataModel()

    var body: some View {
        Text(model.name)
        MySubView(model: model)
    }
}

struct MySubView: View {
    @ObservedObject var model: DataModel // Surveille les modifications de DataModel

    var body: some View {
        Toggle("Enabled", isOn: $model.isEnabled)
    }
}

Pour résumer

• @State: à utiliser pour les propriétés simples qui appartiennent à une seule vue.
• @StateObject : à utiliser une fois pour chaque objet observable que tu utilises, là où il est créé.
• @ObservedObject : à utiliser pour les propriétés complexes qui peuvent appartenir à plusieurs vues.
• @EnvironmentObject : à utiliser pour les propriétés créées ailleurs dans l’application comme que les données partagées.

---

Je suis sûre que tu n’en as pas eu assez alors voilà un peu de documentation officielle sur l’ObservedObject ou l’EnvironmentObject. Je sais, c’est un peu barbant mais ça aide à comprendre !