Spacer ו-ZStack
חלק מהיחידה מבוא ל-SwiftUI במסלול ה-Swift של Coddy. שיעור 12 מתוך 50.
רכיב Spacer תופס את כל המקום הפנוי בערימה. בתוך HStack, הוא דוחף את התצוגות שלפניו שמאלה ואת התצוגות שאחריו ימינה:
HStack {
Text("Total")
Spacer()
Text("$12.50")
}בתוך VStack, Spacer מרחיב את המרווח בין התצוגות אנכית.
ZStack מציב תצוגות זו על גבי זו. התצוגה הראשונה נמצאת מאחור, וכל תצוגה שאחריה מונחת מעליה:
ZStack {
Color.blue
Text("On top")
.foregroundStyle(.white)
}כשמשתמשים ב־Color.blue כתצוגה, היא ממלאת את כל השטח שניתן לה, ולכן כאן היא הופכת לרקע כחול מאחורי הטקסט.
אתגר
קלגרום לשורת הסכום להשתרע על כל הרוחב: הוסף Spacer בין Total ל־$12.50 כדי שהמחיר יידחף לקצה הימני.
נסו בעצמכם
import SwiftUI
@main
struct CoddyApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}השיעור הזה כולל חידון קצר. התחילו את השיעור כדי לענות עליו ולעקוב אחרי ההתקדמות.
כל השיעורים ביחידה מבוא ל-SwiftUI
תרגלו בעצמכם: SwiftUI אונליין