ios] 코드로 UITabBarController의 탭에 UICollectionViewController를 선언하고 콜렉션뷰 설정하기(테이블뷰처럼)
class FeedController: UICollectionViewController- UITabBarController에 선언되어있는 FeedController은 UICollectionViewController이다 이 상태로 런을 하면 'NSInvalidArgumentException', reason: 'UICollectionView must be initialized with a non-nil layout parameter'같은 에러가 나타난다 UICollectionView는 Nil이 아닌 레이아웃 매개 변수로 초기화해야 하기때문.
let layout = UICollectionViewFlowLayout()
let feed = templateNavigationController(unselectedImage: imageLiteral(resourceName: "home_unselected"), selectedImage: imageLiteral(resourceName: "home_selected"), rootViewController: FeedController(collectionViewLayout: layout))
이렇게 rootViewController을 선언하는 부분에 (collectionViewLayout: layout)으로 UICollectionViewFlowLayout으로 레이아웃 매개 변수 초기화를 해준다.
FeedController 에서
func configureUI(){
view.backgroundColor = .white
}
whte로 백그라운드를 설정했었다.
하지만 실행을하면 배경이 검은색으로 보인다. 그 이유는 FeedController가 뷰컨트롤에서 UICollectionViewController으로 변했기 때문에
func configureUI(){
collectionView.backgroundColor = .white
}
view가 아닌 collectionView의 백그라운드로 설정을 바꾸고 런을하면
흰색으로 적용된 모습을 볼 수 있다.
이제 콜렉션뷰를 기본 설정하기위해
extension FeedController: UICollectionViewDataSource{
}
UICollectionViewDataSource을 extension하여 설정을 하려했다 하지만 class FeedController: UICollectionViewController
선언한 UICollectionViewController이 UICollectionViewDataSource이미 포함이 되어있어 extension 할 때UICollectionViewDataSource을 따로 적어 줄 필요가 없다
extension FeedController{
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 5
}
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuserIdentifier, for: indexPath)
cell.backgroundColor = .red
return cell
}
}
func configureUI(){
collectionView.backgroundColor = .white
collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: reuserIdentifier)
}
register을 통해 콜렉션뷰를 선언해주고 cellForItemAt과 numberOfItemsInSection으로 섹션의 수와 셀을 설정해줬다.
이제 collectionView를 테이블뷰처럼 바꿔주는일을 해야한다.
extension FeedController: UICollectionViewDelegateFlowLayout{
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
return CGSize(width: view.frame.width, height: 250)
}
}
UICollectionViewDelegateFlowLayout을 extension해서 가로의 길이를 view.frame.width 뷰의 width크기만큼으로 늘리고 세로를 250으로 설정해줬다.
코드를 통해 콜렉션뷰를 테이블뷰처럼 설정완료!