Asas Protokol Layout
Laksanakan sizeThatFits dan placeSubviews.
Asas Protokol Layout ialah pelajaran Swift Academy percuma di CoddyKit. Ini ialah pelajaran 1 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Swift Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Swift Academy merangkumi sejumlah 4 pelajaran.
Mengapa Susun Atur Tersuai?
SwiftUI disertakan dengan HStack, VStack dan ZStack, tetapi kadangkala Anda memerlukan logik penyusunan yang tidak dapat dinyatakan olehnya—menu jejari, susun atur aliran dan grid batu.
Protokol susun atur membolehkan Anda menulis logik itu sambil terus menggabungkannya dengan paparan SwiftUI biasa.
Protokol Susun Atur
Layout memerlukan dua kaedah: sizeThatFits (sebesar manakah saya?) dan placeSubviews (ke manakah setiap anak pergi?).
Anda mematuhi protokol ini dengan jenis nilai dan menggunakannya seperti mana-mana tindanan terbina dalam.
struct MyLayout: Layout {
func sizeThatFits(proposal: ProposedViewSize,
subviews: Subviews,
cache: inout ()) -> CGSize { .zero }
func placeSubviews(in bounds: CGRect,
proposal: ProposedViewSize,
subviews: Subviews,
cache: inout ()) { }
}Menggunakan Susun Atur Tersuai
Nilai Layout bertindak sebagai bekas. Anda menghantar paparan anak dalam penutupan belakangnya, sama seperti tindanan.
var body: some View {
MyLayout {
Text("One")
Text("Two")
Text("Three")
}
}ProposedViewSize
Induk mencadangkan saiz kepada susun atur Anda melalui ProposedViewSize. width dan height ialah pilihan: nil bermaksud "tidak ditentukan, pilih saiz ideal Anda".
Nilai khas .zero, .infinity dan .unspecified menguji saiz minimum, maksimum dan ideal.
func sizeThatFits(proposal: ProposedViewSize,
subviews: Subviews,
cache: inout ()) -> CGSize {
let width = proposal.width ?? 0
return CGSize(width: width, height: 44)
}sizeThatFits secara Terperinci
sizeThatFits mengembalikan saiz yang dikehendaki oleh susun atur Anda berdasarkan sesuatu cadangan. SwiftUI mungkin memanggilnya beberapa kali dengan cadangan berbeza untuk memahami keanjalan Anda.
func sizeThatFits(proposal: ProposedViewSize,
subviews: Subviews,
cache: inout ()) -> CGSize {
// Sum child ideal sizes for a simple horizontal stack
let sizes = subviews.map { $0.sizeThatFits(.unspecified) }
let w = sizes.reduce(0) { $0 + $1.width }
let h = sizes.map(\.height).max() ?? 0
return CGSize(width: w, height: h)
}Koleksi Subpaparan
Subviews ialah koleksi proksi untuk setiap anak. Setiap proksi menjawab sizeThatFits dan mendedahkan keutamaan susun atur serta nilai tersuai.
Anda tidak pernah melihat paparan sebenar—hanya proksi pengukuran ini.
for subview in subviews {
let size = subview.sizeThatFits(.unspecified)
print(size)
}placeSubviews
placeSubviews menetapkan kedudukan setiap anak di dalam segi empat tepat bounds yang diberikan kepada Anda.
Panggil place(at:anchor:proposal:) pada setiap proksi subpaparan.
func placeSubviews(in bounds: CGRect,
proposal: ProposedViewSize,
subviews: Subviews,
cache: inout ()) {
var x = bounds.minX
for subview in subviews {
let size = subview.sizeThatFits(.unspecified)
subview.place(at: CGPoint(x: x, y: bounds.midY),
anchor: .leading,
proposal: .unspecified)
x += size.width
}
}Penambat Semasa Meletakkan
Parameter anchor menyatakan titik anak yang diletakkan pada kedudukan yang Anda berikan. .topLeading meletakkan anak berdasarkan penjuru kiri atas; .center memusatkan anak pada titik itu.
subview.place(at: CGPoint(x: 0, y: 0),
anchor: .topLeading,
proposal: .unspecified)Sempadan Tidak Sentiasa Bermula pada Asal
Segi empat tepat bounds mungkin tidak bermula pada (0,0). Sentiasa letakkan kedudukan secara relatif kepada bounds.minX dan bounds.minY, bukan pada sifar mutlak.
let startX = bounds.minX // not 0
let startY = bounds.minYSusun Atur Jarak Sama Minimum
Dengan menggabungkan semuanya, berikut ialah susun atur yang meletakkan anak dari kiri ke kanan tanpa jarak. Kedua-dua kaedah kekal konsisten: saiz yang dilaporkan sepadan dengan peletakan.
struct SimpleHStack: Layout {
func sizeThatFits(proposal: ProposedViewSize, subviews: Subviews, cache: inout ()) -> CGSize {
let sizes = subviews.map { $0.sizeThatFits(.unspecified) }
return CGSize(width: sizes.reduce(0){ $0 + $1.width },
height: sizes.map(\.height).max() ?? 0)
}
func placeSubviews(in bounds: CGRect, proposal: ProposedViewSize, subviews: Subviews, cache: inout ()) {
var x = bounds.minX
for s in subviews {
let size = s.sizeThatFits(.unspecified)
s.place(at: CGPoint(x: x, y: bounds.minY), anchor: .topLeading, proposal: .unspecified)
x += size.width
}
}
}Konsistensi Tanggungjawab Anda
SwiftUI mempercayai bahawa kedua-dua kaedah Anda selaras. Jika placeSubviews menggunakan lebih banyak ruang daripada yang dilaporkan oleh sizeThatFits, anak mungkin terpotong atau bertindih.
Kekalkan pengiraan geometri yang sama antara kedua-dua kaedah.
Uji Cepat: Asas Susun Atur
Uji pemahaman Anda tentang protokol Layout.
Ringkasan: Asas Protokol Susun Atur
Protokol Layout menukarkan logik penyusunan tersuai menjadi bekas boleh guna semula. sizeThatFits melaporkan saiz Anda untuk ProposedViewSize, manakala placeSubviews meletakkan setiap proksi anak di dalam bounds menggunakan place(at:anchor:proposal:).
Cadangan membawa dimensi pilihan, sempadan mungkin tersesar daripada asal, dan kedua-dua kaedah mesti kekal konsisten dari segi geometri. Seterusnya, kita akan mengukur subpaparan dengan lebih mendalam.
Pelajari Swift dengan tutor kecerdasan buatan — percuma
Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.
- Kursus
- 122
- Pelajaran
- 409
Soalan Lazim
Adakah pelajaran “Asas Protokol Layout” percuma?
Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Swift Academy, termasuk “Asas Protokol Layout”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Swift Academy merangkumi sejumlah 4 pelajaran.
Apakah yang akan saya pelajari dalam “Asas Protokol Layout”?
Laksanakan sizeThatFits dan placeSubviews. Anda berlatih Swift Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.
Adakah saya memerlukan pengalaman untuk memulakan Swift Academy?
Tiada pengalaman terdahulu diperlukan. Pembelajaran Swift Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 1 daripada 4.
Berapa lamakah pelajaran “Asas Protokol Layout” diambil?
Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.
Bolehkah saya menulis dan menjalankan kod dalam pelajaran Swift Academy ini?
Ya. Setiap pelajaran Swift Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.
Semua pelajaran dalam kursus ini
- Asas Protokol Layout
- Mengukur Subpaparan
- Membina Susun Atur Aliran
- Cache Susun Atur dan Prestasi