[TIL / 25.02.17] 뷰 맨 앞으로 보내기

1. 오늘 진행한 작업

기존 사이드메뉴를 보여주다가 왜 Safe Area까지 뻗어나가지 않는지에 대해 물어보길래, 타 어플들도 찾아보면서 어떤지 보았는데 대다수가 Safe Area 영역까지 뻗어있는 것을 확인했다. 디자인 나온대로 구현하다가 safeArea를 뚫지 않는 게 당연하다고 생각하고 있었는데, 아니었다. 결론적으로, 이 뚫려있는 사이드메뉴를 구현하면서 기존엔 홈에서만 적용되어있던 사이드메뉴를 지난 포스트에서 올렸던 탭바가 들어가는 뷰에서도 적용해보았다.

 

---

 

2. 겪었던 문제와 해결

 

2.1

첫번째로 사이드메뉴가 자꾸 safeArea를 무시하지 못하는 상황이었는데, 제약조건으로도 safeAreaLayoutGuide.snp.topMargin으로 해보라는 의견도 있고 여러 의견 모두 시도해보았는데 되지 않고 있었다. 

 

이 문제는 view.insetsLayoutMarginsFromSafeArea = false를 써서 해결했다.

문제가 기존 파일들끼리 엮여있어 구조가 조금 복잡한데, 하위 뷰에만 적용되어 있는 채로 최상위에 적용하지 않으면 safeArea를 넘어갈 수 없다는 점. 뷰 계층에 대해 잘 알고 있어야 했다.

 

 

2.2

두번째로 기존 탭바가 들어있던 부분에 레이아웃 설정할 당시 sideMenuView 또한 서브뷰로 추가해주었는데 이런 구조가 나왔다.

 

해결하기 위해 서브뷰 추가하는 부분에 바로 bringSubviewToFront 메서드를 썼으나 적용되지 않았는데, 이 부분 또한 하단 코드의 bringSubviewToFront 제외한 부분을 그 뒤에 써주었기 때문에 맨 위로 올린 의미가 없어졌기 때문이었다. 이를 수정하기 위해, 최상위로 올리는 메서드를 하단 코드 마지막에 추가해 구조를 잡아주었다.

private func setupTabmanViewController() {
        addChild(tabmanVC)
        view.addSubview(tabmanVC.view)
        
        tabmanVC.view.snp.makeConstraints {
            $0.top.equalTo(tabBarContainer.snp.bottom)
            $0.leading.trailing.bottom.equalToSuperview()
        }
        
        tabmanVC.didMove(toParent: self)
        
        if let sideMenuIndex = view.subviews.firstIndex(of: sideMenuView) {
            view.bringSubviewToFront(sideMenuView)
        }
    }

 

어느 뷰를 뷰 스택 중 최상위로 올리고자 한다면 view.bringSubviewToFront(올리고자 하는 뷰) 메서드를 쓰면 된다.

 

그 외 유저에 대한 데이터 바인딩의 부분은 받아온 jwt 액세스 토큰을 JWTDecode 라이브러리를 사용하여 추출해 구현했다.

 

---

 

포스트로 다루기엔 애매한 부분이 많아 새로 배운 부분을 중점적으로 다루었다. 기존엔 addSubview로만 뷰를 구성하다가 최근 addChild같은 뷰컨트롤러를 추가하는 방법도 해보고 있는데, 이런 뷰나 뷰컨트롤러를 다루는 부분에 더 능숙해져야 커스텀 컴포넌트를 좀 더 세밀히 다룰 수 있다고 생각한다. 후에 실력이 지금보다 좋아질때쯤 탭바도 커스텀으로 구현해보고 싶다.