[swift] IGListKit에서 셀의 사이즈 제약 조건 설정하는 방법

15 Nov 2023

swift

IGListKit은 UICollectionView에 대한 데이터 소스 및 레이아웃 관리를 담당하는 유용한 프레임워크입니다. IGListKit을 사용하여 셀의 사이즈 제약 조건을 설정하는 방법에 대해 알아보겠습니다.

IGListKit에서 셀의 사이즈 제약 조건을 설정하려면 UICollectionViewCell의 클래스를 작성하고, 해당 클래스에 제약 조건을 추가해야 합니다. 이를 위해서 UICollectionViewDelegateFlowLayout을 구현해야 합니다.

class MyCollectionViewCell: UICollectionViewCell {
    // 셀 내부의 UI 요소들을 선언해주세요.
    let titleLabel = UILabel()
    // ...

    override init(frame: CGRect) {
        super.init(frame: frame)
        
        // 셀의 UI 요소들을 초기화하고 제약 조건을 설정해주세요.
        
        // titleLabel 제약 조건 설정 예시
        titleLabel.translatesAutoresizingMaskIntoConstraints = false
        contentView.addSubview(titleLabel)
        titleLabel.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
        titleLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).isActive = true
        titleLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).isActive = true
        titleLabel.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

위 코드에서는 MyCollectionViewCell 클래스를 작성하고, titleLabel을 예시로 제약 조건을 설정하였습니다. titleLabel의 넓이와 높이는 콘텐츠 뷰(contentView)와 같게 설정되도록 제약 조건을 추가하였습니다.

이제 UICollectionViewDelegateFlowLayout을 구현하기 위해 UICollectionViewDelegateFlowLayout 프로토콜을 채택하고, 해당 프로토콜의 메서드에서 셀의 사이즈를 설정합니다.

extension ViewController: UICollectionViewDelegateFlowLayout {
    // 셀의 크기를 설정하는 메서드
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        // 해당 indexPath의 셀의 크기를 반환해주세요.
        return CGSize(width: 100, height: 100)  // 원하는 셀의 크기로 설정해주세요.
    }
}

위 코드에서는 ViewController 클래스에서 UICollectionViewDelegateFlowLayout을 구현하고, sizeForItemAt 메서드에서 각 indexPath별로 셀의 크기를 반환하도록 설정하였습니다.

이제 이렇게 작성한 MyCollectionViewCell 클래스와 UICollectionViewDelegateFlowLayout을 사용하여 IGListKit에서 셀의 사이즈 제약 조건을 설정할 수 있습니다.

참고 자료: