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
تدرّب بنفسك: Playground لـ Swift