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.
Wyzwanie
ŁatwyRozcią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()
}
}
}Ta lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.
Wszystkie lekcje w sekcji Wprowadzenie do SwiftUI
10Projekt – Kawiarnia Coddy
Przegląd projektuEkrany napojów2Wyświetlanie treści
Widoki tekstoweLiczby w tekścieCzcionkiKolorySF SymbolsPodsumowanie — metka z ceną5Stan i przyciski
PrzyciskiWłaściwość @StateStan prawda lub fałszWidoki warunkowePodsumowanie — licznik punktów6Dane wejściowe użytkownika
Pole tekstowePrzełącznikPrzyciski krokowe i suwakSelektorPodsumowanie – formularz zamówieniaPoćwicz samodzielnie: Edytor online SwiftUI