iyOmSd/Title: SwiftUI

[SwiftUI] 네비게이션 바 숨기기

냄수 2021. 12. 18. 22:05
반응형

잘 작동하고 있던 기능이 

SwiftUI가 업데이트되면서 어떤 부분이 변경되서 그런가 적용되지 않게되는 이슈가 생겨서

수정하면서 글을 적어보려고해요

 

위와같은 그림에 네비게이션바를 보면 어색한게 보이죠??

네 당연히 의도한게아니에요...

저부분도 딤처리된 뷰로 가려야하는데 저부분만 더 앞에 있게 되더라구여

그래서 원래 네비게이션바를 숨기는 로직을 적용했었는데

작동하지않아서 위 그림처럼 저런현상이 서비스에 노출되고 있었어요 ㅠ

 

네비게이션바을 숨기는 방법으로는

1.네비게이션바를 히든처리한다

2.뷰로 네비게이션을 덮는다

이렇게 있겠죠

 

2번인 경우엔 뷰로 덮어지지않았어요 위처럼 네비게이션바가 뷰보다 항상 위에 있게되더라구요

뷰로 네비게이션을 덮기보단 화면으로 덮어야해요 fullScreenCover를 이용해서 아예덮어야하는데

이걸 사용하면 밑에서 올라오는게 보여서 좀 어색하다고 생각했어요

그래서 이 방법은 사용하지않았어요

 

현재 구현한 방법은 1번에요

@State의 값이 변하면 뷰를 다시 랜더링하기 때문에

변수를 .navigationBarHidden()에 넣어서 사용했었는데

잘되던게 동작하지 않게 되버린...

 

네비게이션쪽을 수정하다가 또 발견한 이슈로는

deprecated 함수가 생겼다는것... 이거떄문인가?

해서 변경해봤어요

toolbar를 이용해서 네비게이션 바아이템을 만들어라~ 이얘기구요

 

결론부터 말씀드리자면

네. 아무런 해결이 되지않았어요

 

.toolbar {
    ToolbarItem(placement: .navigationBarLeading) {
            Button(action: {
                presentationMode.wrappedValue.dismiss()
            }, label: {
                NavigationItemView(name: "ic_arrow_left_24")
            }
    }

placement에 navigationBarLeading속성으로 해주면 왼쪽아이템이 생성되서 사용할 수 있어요

 

이 툴바아이템 구현을 보아하니...

컨텐츠가 @ViewBuilder네요?!!?

그렇다면 조건문에의해서 hidden처리를 할 수도 있겠다 싶었어요

기존에 네비게이션을 숨김목적으로 사용하는 변수를 그대로 여기에 사용한다면?!

 

.toolbar {
    ToolbarItem(placement: .navigationBarLeading) {
        if !isNaviBarHidden {
                Button(action: {
                    presentationMode.wrappedValue.dismiss()
                }, label: {
                    NavigationItemView(name: "ic_arrow_left_24")
                }
            }
    }

잘 동작하는걸 볼 수 있죠!

 

 

의식의흐름대로 글을쓰다보니 정신없을거같네요 ㅎㅎ

정리!! 하자면

 

navigationItems()를 이용해서 네비게이션 아이템을 구현하지말고

toobar를 이용해서 네비게이션 아이템을 구현

 

네비게이션아이탬을 숨기는 로직은 ToolbarItem를 이용

ToolbarItem의 컨텐츠가 @ViewBuilder니깐

숨겨야할 기능이 있다면 숨김처리할 변수를 넣어서 구현

 

반응형