TabBar 컨트롤러 구현

권승용(Eric)·2025년 1월 15일

TIL

목록 보기
32/38

UITabBarController 구현

  • 해당 클래스는 보통 그대로 사용되지만, 서브클래스될 수도 있다.
  • 탭바 컨트롤러 인터페이스의 각 탭은 커스텀 뷰컨과 연관되어 있다.
  • 유저가 특정한 탭을 선택하면 탭바 컨트롤러는 대응하는 뷰컨의 루트뷰를 표시한다.
    • 사용자 탭은 항상 탭의 루트 뷰를 표시한다.
  • 탭바 컨트롤러의 탭바 뷰에 직접적으로 접근해선 안 된다.
  • 탭바 컨트롤러의 탭들을 설정하기 위해 각 탭의 루트 뷰를 제공하는 뷰컨을 viewControllers 속성에 할당함
  • 뷰컨을 지정하는 순서에 따라 뷰컨이 탭 표시줄에 나타나는 순서가 결정됨
  • 처음에 어떤 뷰컨을 선택했는지 나타내기 위해 selectedViewController 속성에 값 할당하기
    • selectedIndex 속성으로 배열 인덱스로 뷰컨 선택할 수도 있음
  • 탭바 컨트롤러의 뷰(상속받은 view 속성)를 앱 윈도우에 임베드하면, 탭바 컨트롤러는 해당 뷰컨을 자동으로 선택하고 그 내용을 표시한다.
  • 탭바 아이템은 해당 뷰컨을 통해 구성된다.
  • 탭바 아이템을 뷰컨과 연결하려면 UITabBarItem 클래스의 새 인스턴스를 만들고 뷰컨에 맞게 구성한 다음 이를 뷰컨의 tabBarItem 속성에 할당한다.
  • 사용자가 탭바 인터페이스와 상호작용하면 탭바 컨트롤러 객체는 상호작요에 대한 알림을 델리게이트에 전송한다.
  • 탭바 컨트롤러의 view는 탭바 뷰와 커스텀 컨텐츠가 포함된 뷰의 컨테이너일 뿐.

First Approach

  • UITabBarController + 커스텀 탭바 이미지 사용

  • 탭바 높이가 적절하지 않음
    • tabBar frame 설정으로 조정 가능
  • 앱 실행 후 다크모드 변경 시 이미지는 변경되지 않음
    • 일반 이미지는 잘 변경되는데, 탭바아이템 이미지는 변경되지 않음
    • iOS 버그 로 생각됨
  • 스톱워치 이미지는 피그마 이미지에 문제가 있어 위치가 달라짐
  • 탭 시 원하는 애니메이션 넣기 어려움
    • (배경 원이 가운데서 커지며 나타나면 좋겠음)
  • 위 문제들 중 상당수는 해결 가능하지만, 원활한 다크모드 적용과 애니메이션 적용을 위해 커스텀 탭바 컨트롤러를 작성해볼 예정

Second Approach

  • UIStackView로 탭바 만들기
  • Custom Container VC 만들어 커스텀 탭바 컨트롤러 만들기
  • 컨테이너 뷰컨 개념
    • 컨테이너 뷰컨은 콘텐츠를 화면에 표시하는 방법과 컨텐츠를 분리해 더 나은 캡슐화를 촉진
      • 다른 뷰컨을 표시해 화면에 정렬하고 이들 사이의 탐색을 처리
      • 컨테이너 뷰컨은 하나 이상의 하위 뷰 컨트롤러의 뷰를 자체 뷰 계층구조에 통합해 복합적인 인터페이스를 관리
      • 각 자식 뷰컨은 계속해서 자체 뷰 계층구조를 관리하지만, 컨테이너는 해당 자식 루트 뷰의 위치와 크기를 관리
  • 인터페이스에 자식 뷰컨 추가하기
    1. 컨테이너 뷰컨의 addChild 메소드 호출해 포함 관계 구성
    2. 컨테이너의 뷰 계층구조에 하위 루트 뷰 추가
    3. 하위 루트 뷰의 크기와 위치를 설정하는 제약조건 추가
    4. 전환이 완료되었음을 알리기 위해 하위 뷰컨의 didMove(toParent) 메소드 호출
  • 컨텐트에서 자식 뷰컨 제거하기
    1. nil값을 사용해 willMove(toParent) 호출
    2. 하위 루트 뷰에 대한 제약조건을 비활성화하거나 제거
    3. 자식의 루트 뷰에서 removeFromSuperView() 호출해 뷰 계층구조에서 제거
    4. 자식의 removeFromParent() 호출해 컨테이너-자식 관계 종료
  • UIContainerViewConteroller?
    • 그런 건 없다. 컨테이너 뷰컨은 하나의 개념이며, 기존에 존재하는 클래스들을 이용해 커스텀 구현하면 된다.
profile
ios 개발자에용

0개의 댓글