contacts
TableView 구성
private lazy var tableView = UITableView(frame: .zero, style: .grouped).then {
$0.dataSource = self
$0.delegate = self
$0.estimatedRowHeight = 100
$0.register(ThumbnailTVC.self, forCellReuseIdentifier: ThumbnailTVC.identifier)
if #available(iOS 15.0, *) {
$0.sectionHeaderTopPadding = 0
}
}
Swift
복사
•
dataSource, delegate때문에 tableView는 lazy 속성을 사용해야 합니다.
→ lazy 속성은 뷰가 완벽 완성이 되고 난 후에 나중에 UI, Property 속성을 만들어줍니다. delegate, dataSource의 경우에는 뷰가 cycle를 한 번 돌고나서야 self로 지정할 수 있기 때문에 lazy 속성을 tableview에 사용했습니다.
•
estimatedRowHeight : 이름 그대로 추정하는 높이값입니다. 높이를 제대로 지정하지 않았을 때 추정하는 높이값을 지정해줍니다.
→ TableView의 heightForRowAt메서드가 return하는 값이 UITableView.automaticDimension일 때 사용합니다.(설정해둔 레이아웃에 따라서 높이가 바뀔 때 사용)
•
register : 코드로 TableView를 구성한다면 register를 꼭 해주어야 합니다. register로 cell를 등록해주지 않으면 해당 셀은 display되지 않습니다.
•
sectionHeaderTopPadding : 해당 property는 각각의 section의 TopPadding를 관리해줍니다. iOS 15.0으로 오면서 테이블뷰의 section 사이의 간격이 생겼습니다. 그 간격을 없애주기 위해서 값을 0으로 지정해줬습니다.
CollectionView 구성
private lazy var channelCollectionView = UICollectionView(frame: .zero, collectionViewLayout: channelLayout).then {
$0.dataSource = self
$0.delegate = self
$0.showsHorizontalScrollIndicator = false
$0.register(ChannelCVC.self, forCellWithReuseIdentifier: ChannelCVC.identifier)
}
private let channelLayout = UICollectionViewFlowLayout().then {
$0.scrollDirection = .horizontal
}
Swift
복사
UICollectionView는 TableView와는 다르게 style를 지정해줘야 합니다. channelCollectionView의 FlowLayoutStyle를 가지고 있는 channelLayout를 적용해줘야만 원하는대로 컬렉션뷰가 움직입니다.
•
showsHorizontalScrollIndicator : 이름 그대로 Horizontal 방향의 scroll indicator를 보여줄지 말지 설정합니다.
// MARK: - UICollectionViewDelegateFlowLayout
extension HomeHeaderView: UICollectionViewDelegateFlowLayout {
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
switch collectionView {
case channelCollectionView:
return CGSize(width: 72, height: 104)
case toggleCollectionView:
return CGSize(width: calculateCellWidth(index: indexPath.item), height: 32)
default:
return .zero
}
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
return 0
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
switch collectionView {
case toggleCollectionView:
return 9
default:
return 0
}
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
switch collectionView {
case toggleCollectionView:
return UIEdgeInsets(top: 8, left: 13, bottom: 8, right: 13)
default:
return UIEdgeInsets.zero
}
}
}
Swift
복사
•
sizeForItemAt : 아이템의 사이즈를 지정합니다. 첫번째 case처럼 완전히 정해진 값을 가지는 셀도 있지만 두번째 case처럼 item마다 다른 값을 가지는 셀도 있습니다.
•
minimumLineSpacingForSectionAt, minimumInteritemSpacingForSectionAt : 해당 메서드는 컬렉션뷰의 scroll방향이 어디냐에 따라서 달라집니다.
→ horizontal : minimumInteritemSpacingForSectionAt이 셀 사이 간격이 됩니다.
→ vertical : minimumLineSpacingForSectionAt이 셀 사이 간격이 됩니다.
•
insetForSectionAt : 셀 묶음과 컬렉션뷰 사이의 inset를 줍니다. 꽉 맞게 만들때에는 UIEdgeInsets.zero를 사용하면 편리합니다.