PricingLoginStart free
Swift Academy · Lekcja

LazyVGrid i LazyHGrid

Budowanie responsywnych układów siatkowych z kolumnami GridItem stałymi, elastycznymi i adaptacyjnymi.

Lekcja 2 z 412 kroki

LazyVGrid i LazyHGrid to bezpłatna lekcja Swift Academy na CoddyKit. To lekcja 2 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Swift Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Swift Academy zawiera 4 lekcji w sumie.

Wprowadzenie

`LazyVGrid` i `LazyHGrid` udostępniają układy siatki z konfigurowalnymi definicjami kolumn lub wierszy za pomocą `GridItem`. Doskonale nadają się do galerii, katalogów i układów kart.

Typy GridItem

• `.fixed(size)` — stały rozmiar w pikselach • `.flexible(min:max:)` — wypełnia dostępną przestrzeń • `.adaptive(minimum:maximum:)` — tworzy tyle kolumn, ile się mieści

Podstawowy LazyVGrid

```swift let columns = [GridItem(.adaptive(minimum: 100))] LazyVGrid(columns: columns, spacing: 16) { ForEach(items) { item in ItemCard(item: item) } } ```

Stałe kolumny

```swift let cols = Array(repeating: GridItem(.fixed(120)), count: 3) LazyVGrid(columns: cols) { ForEach(0..<12) { i in Color.blue.frame(height:80) } } ```

Mieszane typy GridItem

```swift let cols = [GridItem(.flexible(minimum:80)), GridItem(.fixed(100))] ``` Łącz typy, aby tworzyć układy w stylu Pinteresta.

LazyHGrid

```swift let rows = [GridItem(.fixed(60)), GridItem(.fixed(60))] ScrollView(.horizontal) { LazyHGrid(rows: rows, spacing: 8) { ForEach(tags) { tag in TagView(tag: tag) } } } ```

Wyrównanie i odstępy

```swift LazyVGrid(columns: columns, alignment: .leading, spacing: 12) { ... } ```

Nagłówki sekcji w siatce

```swift LazyVGrid(columns: columns, pinnedViews: .sectionHeaders) { Section(header: Text("Section 1").font(.headline)) { ForEach(items1) { ItemView($0) } } } ```

Wybór między adaptive a fixed

• `.adaptive` — najlepsze rozwiązanie dla siatek zdjęć i dynamicznej zawartości • `.fixed` — gdy potrzebna jest dokładna kontrola • `.flexible` — wypełnia przestrzeń równomiernie, podobnie jak kolumna flexboxa w CSS

Wydajność leniwego ładowania

Prefiks `Lazy` oznacza, że renderowane są tylko widoczne komórki — ma to kluczowe znaczenie w przypadku długich list. Bez mechanizmu leniwego wszystkie elementy są tworzone z wyprzedzeniem.

Szybkie sprawdzenie

Który typ `GridItem` tworzy tyle kolumn, ile może zmieścić się przy minimalnej szerokości?
Odpowiedz w interaktywnej lekcji

Podsumowanie

Najważniejsze informacje: • `LazyVGrid(columns:)` / `LazyHGrid(rows:)` służą do tworzenia układów siatkowych • `GridItem(.fixed)`, `.flexible()`, `.adaptive(minimum:)` • `pinnedViews: .sectionHeaders` służy do tworzenia przyklejonych nagłówków • Lazy = renderowane są tylko widoczne komórki • `.adaptive` to najprostszy wybór w przypadku responsywnych siatek Następny temat: Spacer, padding i frame.
Bezpłatny start

Ucz się Swift dzięki korepetycjom AI — za darmo

Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.

Kursy
122
Lekcje
409
Zacznij naukę bezpłatnieWyświetl pełny kurs

Często zadawane pytania

Czy lekcja „LazyVGrid i LazyHGrid” jest bezpłatna?

Tak — pełny tekst „LazyVGrid i LazyHGrid” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Swift Academy, przejdź na CoddyKit PRO. Kurs Swift Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „LazyVGrid i LazyHGrid”?

Budowanie responsywnych układów siatkowych z kolumnami GridItem stałymi, elastycznymi i adaptacyjnymi. Ćwiczysz Swift Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć Swift Academy?

Nie wymagamy żadnego doświadczenia. Swift Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 4.

Ile czasu zajmuje lekcja „LazyVGrid i LazyHGrid”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji Swift Academy?

Tak. Każda lekcja Swift Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Podstawy VStack, HStack i ZStack
  2. LazyVGrid i LazyHGrid
  3. Modyfikatory Spacer, Padding i Frame
  4. GeometryReader dla układów adaptacyjnych
← Powrót do Swift Academy