Trang chủ

Bố cục

Cuộc thương lượng giữa cha và con

Bố cục trong SwiftUI là một cuộc thương lượng ba bước, nắm được nó thì câu hỏi “sao cái này lại sai kích thước?” mới có lời giải.

  1. View cha đề nghị một kích thước cho view con.
  2. View con tự chọn kích thước của mình, và có quyền phớt lờ đề nghị đó.
  3. View cha đặt con vào chỗ, chứ không có quyền đổi kích thước của nó.

Điểm thứ ba mới là chỗ gây bất ngờ. View cha không ép được kích thước lên con; nó chỉ đề nghị. Text lấy đúng bề rộng nội dung cần, Image lấy kích thước tự nhiên của nó, còn Rectangle thì lấy hết những gì được mời.

HStack {
    Text("Nhãn")
    Spacer()
    Image(systemName: "chevron.right")
}
.frame(width: 200)

frame không đổi kích thước của HStack — nó chèn vào một view mới, view này đề nghị 200 điểm cho stack rồi căn giữa bất cứ kích thước nào stack đã tự chọn.

Thứ tự modifier không phải chuyện trang trí

Text("Xin chào").padding().background(.blue)   // màu xanh phủ cả phần đệm
Text("Xin chào").background(.blue).padding()   // màu xanh dừng ở chữ

Mỗi modifier bọc quanh view đứng trước nó, nên đọc chuỗi từ phải sang trái sẽ biết thứ gì thật sự hiện trên màn hình.

Đây là chương mẫu. Phần nội dung đầy đủ vẫn đang được viết.