Menu
Coddy logo textTech

Spacer i ZStack

Część sekcji Wprowadzenie do SwiftUI ścieżki Swift w Coddy. Lekcja 12 z 50.

Spacer zajmuje całą wolną przestrzeń w stosie. W HStack przesuwa widoki znajdujące się przed nim w lewo, a widoki znajdujące się za nim w prawo:

HStack {
    Text("Total")
    Spacer()
    Text("$12.50")
}

W elemencie VStack element Spacer rozsuwa widoki w pionie.

ZStack nakłada widoki jeden na drugi. Pierwszy widok znajduje się z tyłu, a każdy kolejny jest umieszczany na nim:

ZStack {
    Color.blue
    Text("On top")
        .foregroundStyle(.white)
}

Widok utworzony za pomocą Color.blue wypełnia całą przydzieloną mu przestrzeń, więc tutaj staje się niebieskim tłem za tekstem.

challenge icon

Wyzwanie

Łatwy

Rozciągnij wiersz z sumą na całą szerokość: dodaj Spacer między Total a $12.50, aby cena została przesunięta do prawej krawędzi.

Spróbuj swoich sił

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}
quiz iconSprawdź się

Ta lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.

Wszystkie lekcje w sekcji Wprowadzenie do SwiftUI

Poćwicz samodzielnie: Edytor online SwiftUI