[iOS] TableViewCell에서 layoutMarginsGuide 사용

테이블뷰의 Custom Cell을 설정할 때 처음에 제약조건을 ContentView에만 맞췄다.

private func configureCellConstraint() {
    NSLayoutConstraint.activate([
        contentStackView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
        contentStackView.topAnchor.constraint(equalTo: contentView.topAnchor),
        contentStackView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
        contentStackView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor)
    ])
}

그랬더니 이렇게 왼쪽에 딱 붙어있는 리스트가 되었다. 이를 seperate line에 맞춰주기 위해 layoutMarginGuide를 사용했다.

private func configureCellConstraint() {
    NSLayoutConstraint.activate([
        contentStackView.leadingAnchor.constraint(equalTo: contentView.layoutMarginsGuide.leadingAnchor),
        contentStackView.topAnchor.constraint(equalTo: contentView.layoutMarginsGuide.topAnchor),
        contentStackView.trailingAnchor.constraint(equalTo: contentView.layoutMarginsGuide.trailingAnchor),
        contentStackView.bottomAnchor.constraint(equalTo: contentView.layoutMarginsGuide.bottomAnchor)
    ])
}

짜잔~ 그러면 이렇게 마진이 생긴다!

그런데 이때 주의할 점이 있다.

현재 이 코드에서는 StackView를 사용하여 한 셀을 구현했다.

이때 contentView에 addSubView를 해주지 않고 cell에 addSubView를 해주면 title이 겹쳐지며 보이지 않는 문제가 생긴다.

private func configureCellSubviews() {
    addSubview(contentStackView)
}

마진을 ContentView로 주면서 contentView에 대해 위치를 잡아주었기 때문에 contentView에 추가시켜 주어야 한다.

private func configureCellSubviews() {
    contentView.addSubview(contentStackView)
}

 

 

☘️ Cell과 ContentView의 차이는?

contentView

cell