Đây là một kỹ thuật trong iOS, sử dụng auto layout để các Table View Cell tự động điều chỉnh kích thước của chính mình phù hợp với nội dung bên trong nó. Lúc này mỗi cell sẽ có chiều cao khác nhau tùy theo nội dung bên trong nó.
1. Tạo UITableView
Đầu tiên mình sẽ tạo một UTableView trong Main.storyboard:
Và một CustomTableViewCell with XIB:
Tiến hành cấu hình UITableView:
2. Thiết kế CustomTableViewCell
Trong CustomTableViewCell mình sẽ thêm một Label để hiển thị nội dung và ánh xạ Label vào CustomTableViewCell:
Chúng ta sửa lại hàm tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) một chút để hiển thị nộ dung cho TableView:
Bây giờ tableview đã hiển thị nội dung nhưng do chưa cấu hình Self-sizing nên cell sẽ có chiều cao bằng nhau và nội dung không hiển thị hết do quá dài:
3. Cấu hình Self-sizing
Để cấu hình Self-sizing chúng ta quay lại hàm setupTb() và thêm 2 dòng code sau:
Quay lại CustomTableViewCell.xib và auto layout cho label. Đây là bước quan trọng nhất vì làm không đúng cell sẽ không hiển thị.
Chúng ta cần thêm leading, top, trailing và bottom constraint cho UILabel, từ các constraint này, cộng với kích thước nội tại của subview, iOS sẽ tính được ra kích thước cần thiết của Table View Cell.
Ở đây Cell của mình chỉ có một Label nếu Cell phức tạp có nhiều Subview các bạn cần auto layout cho đúng để hệ thống có thể tính ra height của Cell, đặc biệt lúc nào cũng phải có constraint top và bottom.
Để UILabel có thể tự động xuống dòng mình cần set Lines number và Line break cho nó:
Và đây là kết quả:
Bây giờ mỗi Cell đã có chiều cao khác nhau tùy thuộc vào nội dung của cell.
Cám ơn các bạn đã theo dõi bài viết. Các bạn có thể tham khảo Source code ở đây: https://github.com/laptrinh0kho/SelfSizingTableViewCells
