UICollectionViewCell mở rộng/thu gọn với kích thước nội tại

Question

Tôi có chế độ xem bộ sưu tập với bố cục luồng tùy chỉnh và nhiều ô khác nhau có chiều cao khác nhau. Chiều rộng của chế độ xem bộ sưu tập thay đổi khi xoay thiết bị, do đó chiều rộng của ô phải thay đổi tương ứng. Để làm việc này, tôi đã thực hiện phương thức "sizeForItemAtIndex" và trả về các kích thước khác nhau tùy thuộc vào định hướng giao diện hiện tại. Hầu hết các ô không thay đổi chiều cao của chúng, tuy nhiên, có một ô mà tôi muốn mở rộng và thu gọn bất cứ khi nào người dùng chạm vào nó. Bạn có thể giả định rằng ô chỉ có một UILabel với một hoặc nhiều dòng văn bản. Khi ô xuất hiện lần đầu tiên, số dòng được đặt thành 1 và khi người dùng chạm vào ô, số dòng được đặt thành 0 và ở đây ô sẽ sử dụng kích thước nội tại của nhãn để thay đổi chiều cao tự động . Làm thế nào tôi có thể đạt được hiệu ứng này? Dưới đây là một ví dụ về những gì nó sẽ giống như thế:

Answer 1

Thực hiện theo các bước sau:

1). Tạo một biến boolean tên isExpanded để quản lý mở rộng/thu hẹp

2.) Thêm một mục tiêu và hành động để nút được hiển thị nhiều hơn

[yourCellName.btnShowMore addTarget:self action:@selector(ShowMoreButtonClicked) forControlEvents:UIControlEventTouchUpInside]; 

3.) Trong sizeForItemAtIndexPath để quản lý chiều cao, thêm:

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath 
{ 

if (isExpanded && indexPath.row == 0) { 
     return CGSizeMake(CGRectGetWidth(self.view.frame), calculated height for the expanded cell); 
    } 
    return CGSizeMake(CGRectGetWidth(self.view.frame), default height); 
} 

4.) Sau đó, trong phương pháp ShowMoreButtonClicked

- (void)ShowMoreButtonClicked{ 
    if (isExpanded) { 
     isExpanded = FALSE; 
     [collection_viewCus reloadItemsAtIndexPaths:@[[NSIndexPath indexPathForRow:0 inSection:0]]]; 

    } 
    else { 
     isExpanded = TRUE; 
     [collection_viewCus reloadItemsAtIndexPaths:@[[NSIndexPath indexPathForRow:0 inSection:0]]]; 
    }} 

5.) Thêm dòng này trong cellForItemAtIndexPath bạn

[yourCellName layoutIfNeeded]; 

6.) Xây dựng & chạy

Answer 2

Câu trả lời trước là tốt, nhưng nếu bạn muốn có một số hình ảnh động bạn cần phải làm điều này ba bước:

1.Không xác định bộ sưu tập của bạnViewLayout

self.collectionView.collectionViewLayout.invalidateLayout() 

2.Road lại indexPath hoặc tất cả dữ liệu bên trong khối performBatchUpdates

collectionView.performBatchUpdates({ 
      self.collectionView.reload(at: DESIRED_INDEXPATH) 
     }, completion: nil) 

3.Return những tầm cao mới tính theo phương pháp sizeForItemAtIndexpath đại biểu