[트러블 슈팅] UICollectionView Cell Autolayout 충돌

⚠️ 문제: UICollectionView 스크롤 시 콘솔에 warning 출력

 

UICollectionView로 구현한 List Layout 섹션을 스크롤하니 위와 같은 경고가 콘솔에 출력되었습니다.

 

❗️ 원인: ListCell의 Height 충돌

내용을 읽어보니 리스트 레이아웃의 셀로 사용하고 있는 ListCell의 height가 충돌하고 있는 것으로 보입니다.

    private func setLayout() {
		...
        
        contentView.snp.makeConstraints{
            $0.directionalEdges.equalToSuperview()
            $0.height.equalTo(60)
        }
        
        ...
    }

 

위는 ListCell의 레이아웃 설정 코드입니다.

과제의 요구사항에 따라 contentView의 height를 60으로 제한하고 있습니다.

또한 top.bottom.left.right 제약 모두 equalToSuperView()로 주고 있습니다.

 

그러나 오토레이아웃을 아래의 제약 사항(equalToSuperView)에 맞추면 높이가 52가 되어버리기때문에 첫 줄의 제약사항인 높이 60과 충돌이 발생하게 되었습니다.

 

✅ 해결: Autolayout 제약 수정

	func setLayout() {
    	...
        
        contentView.snp.makeConstraints {
            $0.top.horizontalEdges.equalToSuperView() // bottom 제약 삭제
            $0.height.equalTo(60)
        }
        
        ...
    }

 

contentView의 bottom 제약을 삭제하여 equalToSuperView로 인한 높이의 제약이 생기지 않도록 하였습니다.

$0.height.equalTo(60)이 존재하므로 bottom 제약을 주지 않아도 오토레이아웃은 셀이 끝나는 위치를 알고 있습니다.

 

 

문제없이 작동하는 것을 확인하였습니다.