SwiftUI Academy · Lektion

LazyVStack och LazyHStack

Rendera stora innehållsmängder lazy för bättre prestanda.

Lektion 2 av 413 steg

LazyVStack och LazyHStack är en gratis lektion i SwiftUI Academy på CoddyKit. Detta är lektion 2 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för SwiftUI Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i SwiftUI Academy innehåller totalt 4 lektioner.

Problemet med eager

En vanlig VStack bygger alla barn på en gång. Med hundratals rader kan det eager-arbetet orsaka hack och slösa minne.

Möt LazyVStack

En LazyVStack skapar bara rader när de rullar in i vyn, vilket håller stora listor snabba och resurssnåla. ⚡

LazyVStack {
    ForEach(items) { item in
        Row(item)
    }
}

Lazy behöver rullning

Placera alltid en LazyVStack i en ScrollView, eftersom lazy-inläsning bara ger nytta när innehåll rullar utanför skärmen.

ScrollView {
    LazyVStack {
        ForEach(items) { Row($0) }
    }
}

Den horisontella motsvarigheten

En LazyHStack gör samma sak i sidled och passar perfekt för långa, svepbara rader med kort eller miniatyrbilder.

ScrollView(.horizontal) {
    LazyHStack {
        ForEach(photos) { Thumb($0) }
    }
}

Samma spacing-API

Lazy-stacks accepterar samma alternativ för spacing och justering som sina ivriga motsvarigheter, så layoutkoden ändras knappt.

LazyVStack(alignment: .leading, spacing: 12) {
    ForEach(items) { Row($0) }
}

Celler återanvänds

När rader lämnar skärmen kan en LazyVStack kasta bort dem, så minnesanvändningen förblir stabil även med tusentals objekt.

Lazy jämfört med List

En List är också lazy, men en LazyVStack ger dig frihet att utforma allt utan inbyggda avgränsare eller insets.

Fastnålade rubriker

Lazy-stacks stöder pinnedViews, så att sektionsrubriker kan ligga kvar högst upp när du rullar, som i en kontaktapp.

LazyVStack(pinnedViews: [.sectionHeaders]) {
    Section(header: Header()) {
        Rows()
    }
}

När du bör välja eager

För ett fåtal objekt är en vanlig VStack enklare. Välj lazy först när listan blir lång.

Titta på rullningen

Du ser inte nya LazyVStack-rader byggas, men Instruments visar att de skapas precis när de behövs medan du rullar.

Skala med trygghet

Med lazy-stacks kan du visa oändliga flöden, gallerier och tidslinjer utan att behöva oroa dig för prestandan. ✨

Snabb kontroll

Tänk på varför lazy-stacks finns.

Sammanfattning

Du fick lära känna LazyVStack och LazyHStack: stacks som skapar barn vid behov inuti en ScrollView för smidiga, stora layouter. 🎉

Gratis att börja

Lär dig Swift med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser
30
Lektioner
120

Vanliga frågor

Är lektionen ”LazyVStack och LazyHStack” gratis?

Ja – hela texten till ”LazyVStack och LazyHStack” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i SwiftUI Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i SwiftUI Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”LazyVStack och LazyHStack”?

Rendera stora innehållsmängder lazy för bättre prestanda. Ni övar på SwiftUI Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig SwiftUI Academy?

Du behöver inga förkunskaper. Utbildningen i SwiftUI Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 2 av 4.

Hur lång tid tar lektionen ”LazyVStack och LazyHStack”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här SwiftUI Academy-lektionen?

Ja. Varje SwiftUI Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

  1. Horisontell och vertikal ScrollView
  2. LazyVStack och LazyHStack
  3. Adaptiva rutnät med LazyVGrid
  4. ScrollView Reader och ankare
← Tillbaka till SwiftUI Academy