Hug, Fill và Fixed là gì?
Còn gọi: cách co giãn trong Figma, hug contents, fill container, fixed width figma, hug và fill figma
Hug, Fill và Fixed là ba chế độ quyết định kích thước của frame hoặc phần tử trong Auto layout: ôm sát nội dung, lấp đầy khung cha, hoặc giữ cố định.
Hiểu kỹ hơn
Hug contents: khung co giãn theo nội dung bên trong, ví dụ nút dài ra khi chữ dài hơn. Fill container: phần tử giãn ra chiếm hết chỗ còn trống trong khung cha theo chiều đó, ví dụ ô nhập liệu chiếm toàn bộ chiều ngang form. Fixed: giữ đúng kích thước bạn nhập, không đổi theo nội dung hay khung cha. Mỗi chiều rộng và cao chọn riêng, nên có thể có nút Fill chiều ngang nhưng Hug chiều dọc. Đây là nền tảng để thiết kế responsive trong Figma và tương ứng với width auto, flex 1 hay width cố định trong CSS. Lỗi hay gặp: để mọi thứ Fixed, khi đổi chữ hay kích thước màn hình thì bố cục vỡ; hãy tập thói quen chọn Hug hoặc Fill trước, Fixed sau.
