.onDisappear: Funktionsweise und Verwendung in SwiftUI

Was ist .onDisappear?

.onDisappear ist ein View-Modifikator in SwiftUI, der einen Void-Closure nimmt und ausführt, wenn die View aus der Hierarchie entfernt wird. Zusammen mit .onAppear bildet es den vollständigen Lebenszyklus eines Bildschirms: Erscheinen — Arbeiten — Verschwinden. Apple führte onDisappear zusammen mit SwiftUI in iOS 13 als Analogon zu viewDidDisappear aus UIKit ein.

Syntaktisch ist .onDisappear identisch mit onAppear: Es modifiziert jede View und fügt einen Closure an, der vom SwiftUI-Renderer aufgerufen wird, wenn die View entfernt wird. Im Gegensatz zu UIKit, wo viewDidDisappear erst nach Abschluss der Übergangsanimation ausgelöst wird, kann onDisappear in SwiftUI vor dem Ende der Animation aufgerufen werden — in dem Moment, in dem die View zum Entfernen markiert wird.

onDisappear Syntax

Basis-Syntax von onDisappear ist genauso prägnant wie die von onAppear. Der Modifikator nimmt keine zusätzlichen Parameter entgegen — nur den Closure, der synchron im Hauptthread ausgeführt wird.

struct DetailView: View {
    var body: some View {
        Text("Detail Screen")
            .onDisappear {
                print("DetailView vom Bildschirm verschwunden")
            }
    }
}

Wie .onDisappear funktioniert

Aufrufmechanismus von onDisappear ist das Gegenteil von onAppear: Kind-Elemente erhalten zuerst onDisappear, dann das Eltern-Element. Diese Child-First-Regel stellt sicher, dass Kind-Ressourcen freigegeben werden, bevor die Eltern-Ressourcen freigegeben werden. Wenn ein Kind-Element von Eltern-Daten abhängt, muss es ohne den Eltern-Kontext korrekt beendet werden können.

SwiftUI ruft onDisappear auf, wenn die View aus dem Rendergraphen entfernt wird. Auslöser sind: Pop aus NavigationStack, TabView-Wechsel, modales Schließen (sheet/fullScreenCover) oder eine bedingt gerenderte View (if/switch). In List und ScrollView wird onDisappear aufgerufen, wenn eine Zelle über den Prefetch-Puffer hinaus scrollt.

Child-First-Aufrufreihenfolge

Child-First-Reihenfolge bedeutet, dass bei drei Kind-Views in einem VStack onDisappear zuerst für jedes Kind in umgekehrter Reihenfolge aufgerufen wird, dann für das Eltern-Element. Dies ist für die korrekte Bereinigung entscheidend: Kind-Timer werden abgebrochen, bevor das Eltern-ViewModel gemeinsame Ressourcen freigibt.

struct ParentView: View {
    var body: some View {
        VStack {
            ChildView(id: "A")
            ChildView(id: "B")
        }
        .onDisappear {
            print("Parent onDisappear — zuletzt")
        }
    }
}

struct ChildView: View {
    let id: String
    var body: some View {
        Text("Child \(id)")
            .onDisappear {
                print("Child \(id) onDisappear")
            }
    }
}

Konsolenausgabe: Child B onDisappear, Child A onDisappear, Parent onDisappear — zuletzt. Die umgekehrte Reihenfolge im Vergleich zu onAppear gewährleistet eine korrekte Bereinigungskette.

Wann .onDisappear aufgerufen wird

Aufrufszenarien von onDisappear hängen vom Container-Typ ab. Im NavigationStack wird onDisappear bei pop-to-root, normalem pop-back oder Schließen des Bildschirms durch Wischen (interactivePopGestureRecognizer) ausgelöst. Im TabView löst das Wechseln von Tabs onDisappear für den versteckten und onAppear für den angezeigten Tab aus — beide Modifikatoren werden fast gleichzeitig ausgelöst.

In Sheet und fullScreenCover wird onDisappear beim programmatischen Schließen (über @Environment(\.dismiss)) oder durch eine Wisch-Geste nach unten aufgerufen. Ein wichtiges Detail: Wenn ein Sheet geöffnet wurde, der Benutzer jedoch die App gewechselt hat, wird onDisappear erst beim tatsächlichen Schließen aufgerufen.

.onDisappear Beispiele

Hauptanwendungsfälle von onDisappear sind Ressourcenbereinigung, Zustandsspeicherung und Tracking. Im Gegensatz zu onAppear werden onDisappear-Aufgaben beim Verlassen ausgeführt und benötigen keine Duplikatsprüfung, da die View nur einmal verschwindet.

Zustand speichern und Timer abbrechen

Zustand speichern in onDisappear ist besonders nützlich für Formulare, bei denen Daten beim Verlassen des Bildschirms gespeichert werden müssen. Timer und Combine-Abonnements werden in onDisappear abgebrochen, um Lecks beim Zurückkehren zum Bildschirm zu vermeiden.

struct FormView: View {
    @State private var draftText = ""
    @State private var timer: Timer?
    
    var body: some View {
        TextField("Enter text", text: $draftText)
            .onAppear {
                timer = Timer.scheduledTimer(withTimeInterval: 60, repeats: true) { _ in
                    saveDraft()
                }
            }
            .onDisappear {
                timer?.invalidate()
                timer = nil
                saveDraft()
            }
    }
    
    private func saveDraft() {
        UserDefaults.standard.set(draftText, forKey: "draft")
    }
}

Timer-Abbruch in onDisappear verhindert die Codeausführung, nachdem der Bildschirm bereits geschlossen wurde. Ohne Abbruch könnte der Timer versuchen, @State zu aktualisieren, das nicht mehr zur aktuellen View gehört, was eine Laufzeitwarnung verursacht.

Bildschirmzeit-Tracking

Verweildauer auf einem Bildschirm ist ein klassisches Tracking-Szenario. Zeit in onAppear erfassen, Differenz in onDisappear berechnen und ein Analyse-Ereignis mit der Sitzungsdauer senden.

struct TrackedView: View {
    @State private var appearTime: Date?
    
    var body: some View {
        Text("Tracked Screen")
            .onAppear {
                appearTime = Date()
                Analytics.shared.logEvent("screen_view", params: ["screen": "TrackedView"])
            }
            .onDisappear {
                if let start = appearTime {
                    let duration = Date().timeIntervalSince(start)
                    Analytics.shared.logEvent("screen_close", params: [
                        "screen": "TrackedView",
                        "duration_ms": Int(duration * 1000)
                    ])
                }
            }
    }
}

.onDisappear vs .onAppear — Unterschiede

Der Hauptunterschied zwischen onDisappear und onAppear ist die Aufrufreihenfolge und die Ausführungsgarantie. onAppear wird beim Hinzufügen einer View zur Hierarchie aufgerufen und kann bei Neuerstellung erneut aufgerufen werden. onDisappear wird beim Entfernen aufgerufen und ist nur bei normalem Schließen garantiert, nicht bei Abstürzen.

Laut WWDC 2024 empfiehlt Apple, onDisappear als Bereinigungspunkt zu betrachten, nicht als Daten-Commit-Punkt. Kritische Daten (Zahlungen, Registrierungen) sollten in Echtzeit gespeichert werden, nicht beim Verschwinden der View, da onDisappear beim Minimieren der App nicht garantiert ist.

Empfehlung: Verwenden Sie onDisappear nur für nicht-kritische Bereinigung und Tracking. Verwenden Sie für Datenpersistenz scenePhase oder applicationWillTerminate-Benachrichtigungen im AppDelegate.

Typische Anwendungsszenarien

Szenario 1: YouTube-ähnliche Wiedergabe. Auf dem Videodetail-Bildschirm speichert onDisappear die Wiedergabeposition in UserDefaults. Beim erneuten Öffnen stellt onAppear die Position aus UserDefaults wieder her, was ein nahtloses Seherlebnis schafft.

Szenario 2: Combine-Abonnement kündigen. Wenn ein ViewModel Combine-Publisher verwendet, kündigt onDisappear das Abonnement über cancellable?.cancel(). Dies verhindert UI-Aktualisierungen nach dem Verlassen des Bildschirms, was besonders für Listen mit Paginierung und Suchanfragen wichtig ist.

Szenario 3: WebSocket schließen. In Apps mit Echtzeitverbindungen (Messenger, Kurs-Feeds) schließt onDisappear die WebSocket-Verbindung, um Akku und Datenvolumen zu sparen. Die erneute Verbindung erfolgt in onAppear bei der Rückkehr zum Bildschirm.

WebSocket in onDisappear schließen

WebSocket ist eine typische Ressource, die beim Verlassen des Bildschirms geschlossen werden muss. Im folgenden Beispiel trennt onDisappear die Socket-Verbindung und onAppear stellt sie wieder her, was für Apps mit mehreren Bildschirmen erhebliche Dateneinsparungen bietet.

struct ChatView: View {
    @StateObject private var socket = WebSocketManager()
    
    var body: some View {
        ChatListView(messages: socket.messages)
            .onAppear {
                socket.connect()
            }
            .onDisappear {
                socket.disconnect()
            }
    }
}

Wichtig: Beim Wechseln zwischen TabView-Tabs werden onDisappear des aktuellen und onAppear des nächsten Tabs fast gleichzeitig ausgelöst. Für WebSocket kann dies einen Trennungs-Wiederherstellungs-Zyklus verursachen, der unnötige Last erzeugt. Die Lösung ist die Verwendung einer Verzögerung oder die Prüfung, ob der Socket auf dem nächsten Bildschirm benötigt wird.