[iOS] CompositionalLayout을 한번 사용해보자 #1

안녕하세요 이놈 저놈 그놈의 노움입니다.

 

최근에 개인 프로젝트로 진행중에 복잡한 홈 화면 개발에 고민했던 점, 어려운 부분, 새롭게 알게된 내용을 정리하는 목적으로 글을 작성하게 되었습니다.

 

따라서 이 글은 저 개인의 학습을 최우선 목적으로 함을 미리 알립니다 혹시나 CompositionalLayout을 배우려고 들어오셨다면 빨리 도망가시길 바랍니다.

 

우선 제가 고민했던 부분은 아래와 같은 다양한 화면 구성을 가지고 있는 앱을 어떻게 만들어야 하는지에 대해서 입니다.

 

App Store

 

위와 같은 화면을 개발하기 위해서는 위 아래 스크롤, 좌우 스크롤이 가능한 스크롤 뷰와 각각의 그룹에 들어가는 이미지, 택스트, 버튼을 배치해야 됩니다.

 

그래서 CollectionView를 사용해야겠다 라는 생각을 하게 되었습니다.

왜 CollectionView를 사용하냐? 간단한 화면을 구현하는데 tableView를 사용하는것이 좋습니다 하지만 테이블 뷰의 경우 한개의 그룹 안에 하나의 셀만이 사용이 가능한 반면 CollectionView에서는 한개의 그룹 안에 다수의 셀을 사용 가능한 장점이 있습니다.

 

UICollectionView | Apple Developer Documentation

UICollectionView | Apple Developer Documentation

 

collectionView를 간단하게 설명하자면

tableView와 마찬가지로 UIScrollView을 상속받고 있기 때문에 스크롤이 가능합니다.

@MainActor
class UICollectionView : UIScrollView

또한 하나의 그룹에 다수의 셀이 사용될 수 있기 때문에 사용하기 다양한 레이아웃 또는 복잡한 데이터 표현하는데 장점을 가지고 있습니다.

그리고 마지막으로 iOS 13부터 추가된 Composional Layout을 사용할 수 있습니다.

 

다시 프로젝트 구상으로 돌아가서 메인 홈 화면을 3개로 나눠서 각각 따로 구현 하고자 했습니다.

 

 

처음 프로젝트 구상시 하나의 화면에 3개의 CollectionView를 추가하고 이를 tableView안에 넣을 계획을 짜게 되었는데 너무 과한 작업이 된다는것을 작업 중간에 깨달음을 얻었습니다…

 

그러던 중 CollectionView에 Composional Layout이라고 하는 CollectionViewLayout의 하나의 종류를 알게 되어 이번 프로젝트에 적용을 시켜야겠다라고 생각하게 되었습니다.