안녕하세요! 갱입니다 🫡
오늘은 제가 이번 주 업무 중에 CollectionView에 데이터가 없으면 emptyView를 넣어주는 작업을 하던 중 어떻게 넣어야 하는게 좋을까 고민하던 중 구글링을 하다보니…
backgroundView 를 주는 방법이 있더라고여 … 그래서 한번 적용해보는 방법을 알아보고자 합니다…
기본 뷰 만들기
우선 저는 테이블뷰로 예를 들어서 하겠습니다 (CollectionView도 방법은 똑같음)
이러한 화면을 만들면
요러한 0~9까지 그려주는 화면이 나올거에요
우리는 근데 가정을 하는거죠
서버에서 데이터가 오는데 없을 수 있는거 잖아?
그렇다면 우리는 데이터가 없을 때 배경화면만 떨렁 보여줄 수 없으니
데이터가 없을 때를 위한 화면을 만들어줘야겠죠?
EmptyView 만들기
extension을 이용하여 emptyView를 그려주는 코드를 작성해봅시다
- 데이터가 없을 때 그려줄 화면인 setEmptyView 메소드
- emptyView를 넣은 후 다시 지워줄 restore 메소드를 구현해보았습니다
이런식으로 만든 후
tableView numberOfRowsInSection 메소드에서 적용해주면 됩니다
저는 예를 들기 위해 50% 확률로 count가 0인 경우로 해주었습니다
그러고 이제 데이터가 없다면?
요런식으로 나오는걸 확인하실 수 있습니다
만약 section이 여러개라면?
저는 이러한 방법을 찾고도 이용하지 못했습니다 ㅜ
왜냐하면 넣고자하는 collectionView는 section이 2개고 0번 섹션은 무조건 보이는 상태여서
저런 방식을 사용한다면 0번 섹션이 backgroundView를 가리더라고여…
그래서 제가 생각한 방식은
1. EmptyView 만들기
2. numberOfItemsInSection 수정
이런 식로 viewModel.list.count가 0이라면 return 1을 해줍니다
3. cellForItemAt 수정
count가 0이라면 셀에 emptyView 를 넣어주기
4. sizeForItemAt 수정
마지막으로 요렇게 사이즈도 조정해주었습니다
그러니까 잘되더라고여…
혹시라도 사이드이펙트가 발생하여 이슈가 생긴다면
요 포스팅 밑에 문제 및 솔루션을 작성해두겠습니다!
