https://developer.apple.com/documentation/uikit/uinavigationbar
"Navigational controls that display in a bar along the top of the screen, usually in conjunction with a navigation controller."
보통의 경우 네비게이션 컨트롤러와 함께 스크린 상단에 따라 바에서 표시되는 네비게이션의 컨트롤입니다.
Declaration
@MainActor class UINavigationBar : UIViewOverview
UINavigationBar 객체는 스크린의 계층구조 내부에서 네비게이션 기능을 하는 버튼을 포함하고 있으며, 보통 윈도우의 상단에 표시되는 바입니다. 주요 컴포넌트는 왼쪽(돌아가기) 버튼, 중앙에 있는 제목, 선택적 오른쪽 버튼입니다. 네비게이션 바는 독립적 객체로 사용할 수 있으며, 네비게이션 컨트롤래 객체와 함께 사용할 수도 있습니다.
네비게이션바는 네비게이션 컨트롤러 내부에서 가장 흔하게 사용됩니다. UINavigationController 객체는 관련 네비게이션바를 생성, 표시 관리하며, 네비게이션바에서 표시되는 컨텐트를 컨트롤하기 위해 추가하는 뷰 컨트롤러의 특성을 사용합니다.
네비게이션 컨트롤러를 사용할 떄 네비게이션바를 제어하려면 아래 단계가 요구됩니다.
- 인터페이스 빌더 혹은 코드에서 네비게이션 컨트롤러를 생성합니다.
UINavigationController객체에서navigationBar속성을 사용해 네비게이션바의 모양을 설정합니다.- 네비게이션 컨트롤러의 스택에 넣은 각
UIViewController에서title및navigationItem속성을 설정해 네비게이션바의 컨텐트를 제어합니다.
네비게이션 컨트롤러 사용 없이 독립적인 네비게이션바를 사용할 수도 있습니다. 인터페이스에 네비게이션바를 추가하려면 아래 단계가 요구됩니다.
- 인터페이스에서 네비게이션바의 위치를 제어하기 위해 오토 레이아웃을 설정합니다.
- 초기 제목을 제공하기 위해 루트 네비게이션 아이템을 생성합니다.
- 네비게이션바에 대한 사용자 상호작용을 처리하기 위해 딜리게이트 객체를 설정합니다.
- 네비게이션바의 모양을 커스터마이징합니다.
- 계층구조의 스크린을 통해 사용자가 네비게이션을 사용할 때 관련 네비게이션 아이템을 푸시 및 팝할 수 있도록 앱을 설정합니다.
Use a Navigation Bar with a Navigation Controller
컨텐트의 다른 스크린 사이에서 네비게이션을 관리하기 위해 네비게이션 컨트롤러를 사용하는 경우 네비게이션 컨트롤러는 자동으로 네비게이션바를 생성하고, 적합한 시점에 네비게이션 아이템을 푸시 및 팝합니다.
뷰 컨트롤러의 스택을 네비게이션으로 작업할 때, 모델 객체를 네비게이션바에 제공하기 위해서 UIViewController의 navigationItem 속성을 사용합니다. 기본값 네비게이션 아이템은 뷰 컨트롤러의 제목을 사용하지만, 네비게이션바의 컨텐트를 완전히 통제할 수 있도록 UIViewController 서브클래스에서 navigationItem을 오버라이드할 수 있습니다.
네비게이션 컨트롤러는 스스로를 네비게이션바 객체의 딜리게이트로 할당합니다. 그러므로 네비게이션 컨트롤러를 사용할 때 상응하는 네비게이션바로 커스텀 딜리게이트 객체를 할당하지 않아야 합니다.
네비게이션 컨트롤러에 연결된 네비게이션바에 접근하려면 UINavigationController에서 navigationBar 속성을 사용할 수 있습니다. 네비게이션바의 모양을 커스터마이징하는 자세한 방법은 Customize the Appearance of a Navigation Bar에서 확인할 수 있습니다.
Customize the Appearance of a Navigation Bar는 아래 내용에 나옵니다.
네비게이션 컨트롤러에 대한 정보는 UINavigationController를 보시기 바랍니다.
UINavigationController
https://developer.apple.com/documentation/uikit/uinavigationcontroller
https://velog.io/@panther222128/UINavigationController
Add Content to a Standalone Navigation Bar
대부분의 시나리오에서 네비게이션바는 네비게이션 컨트롤러의 부분으로 사용하게 될 것입니다. 그러나 네비게이션바 UI를 원하는 방식으로 사용할 상황이 있을 수 있으며, 컨텐트 네비게이션에 대한 고유한 접근으로 구현하길 원할 수도 있습니다. 이와 같은 상황에서 독립 네비게이션바를 사용할 수 있습니다.
네비게이션바를 독립 객체로 사용하는 경우 컨텐트를 제공해야 합니다. 다른 타입의 뷰와 다르게 네비게이션바에 직접 하위뷰를 추가할 수 없습니다. 대신 버튼 혹은 표시하고자 하는 커스텀 뷰를 구체화하기 위해 네비게이션 아이템(UINavigationItem 클래스의 인스턴스)을 사용할 수 있습니다. 네비게이션 아이템은 네비게이션바의 왼쪽, 오른쪽, 중앙으로 뷰를 구체화하기 위한 속성을 갖고 있으며, 커스텀 프롬프트 스트링을 구체화하기 위한 속성도 갖고 있습니다.
네비게이션바는 UINavigationItem 객체의 스택을 관리합니다. 스택은 대부분 네비게이션 컨트롤러를 지원하기 위해 존재하지만, 고유한 커스텀 네비게이션 인터페이스 구현을 위해 사용할 수도 있습니다. 스택에 있는 가장 상단의 아이템은 컨텐츠가 네비게이션바에 의해 현재 표시되고 있는 네비게이션 아이템을 나타냅니다. pushItem(_:animated:) 메소드를 사용해서 스택에 새 네비게이션 아이템을 푸시할 수 있고, popItem(animated:) 메소드를 사용해서 스택에 있는 아이템을 팝할 수 있습니다. 이와 같은 변경은 사용자의 이점을 위해 애니메이션 처리될 수 있습니다.
아이템 푸시 및 팝과 더불어 아이템 속성 혹은 setItems(_:animated:) 메소들르 사용해서 직접 스택의 컨텐츠를 설정할 수 있습니다. 이 메소드는 launch 시점에 인터페이스를 이전 상태로 복구하거나 한 번에 하나 이상의 네비게이션 아이템을 푸시, 팝하기 위해 사용할 수 있습니다. 아래 그림은 네비게이션 아이템의 스택 관리에 책임이 있는 UINavigationBar API의 일부를 보여주고 있습니다.
네비게이션바를 독립 객체로 사용하는 경우 딜리게이트 속성에 커스텀 딜리게이트 객체를 할당해야 하며, 해당 객체를 네비게이션바로부터 오는 메시지를 인터셉트하기 위해 사용해야 합니다. 딜리게이트 객체는 UINavigationBarDelegate 프로토콜을 채택해야 합니다. 딜리게이트 노티키페이션은 네비게이션 아이템이 스택으로부터 푸시 혹은 팝되는 시점을 추적할 수 잇도록 해줍니다. 앱 UI의 나머지 부분을 업데이트하기 위해 이와 같은 노티피케이션을 사용할 수 있습니다.
네비게이션 아이템 생성에 대한 더 많은 정보는 UINavigationItem을 보시기 바랍니다. 딜리게이트 객체 구현에 대한 더 많은 정보는 UINavigationBarDelegate를 보시기 바랍니다.
UINavigationItem
https://developer.apple.com/documentation/uikit/uinavigationitem
https://velog.io/@panther222128/UINavigationItem
UINavigationBarDelegate
https://developer.apple.com/documentation/uikit/uinavigationbardelegate
https://velog.io/@panther222128/UINavigationBarDelegate
Customize the Appearance of a Navigation Bar
네비게이션바는 두 가지 표준 스타일을 갖고 있으며, 어두운 텍스트에 흰색 혹은 밝은 텍스트에 검정색입니다. 스타일을 선택하려면 barStyle 속성을 사용하시기 바랍니다. 다른 네비게이션 바 모양 속성을 만드는 모든 변경사항은 바 스타일로부터 추론되는 것을 오버라이드할 수 있습니다.
네비게이션바는 기본값으로 투명도를 갖습니다. 즉 네비게이션바의 배경 색상은 반투명입니다. isTranslucent 속성을 false로 설정해서 네비게이션바를 불투명하게 만들 수 있습니다.
barTintColor 속성을 사용해서 네비게이션바 배경에 대한 커스텀 틴트 색상을 구체화할 수 있습니다. 이 속성을 설정하는 것은 바 스타일로부터 추론된 기본값 색상을 오버라이드합니다. 모든 UIView 서브클래스처럼 tintColor 속성을 사용해서 버튼, 이미지, 제목을 포함한 네비게이션바 내부에 있는 상호작용 요소의 색상을 제어할 수 있습니다.
titleTextAttributes 속성은 바의 제목 텍스트 표시를 위한 특성을 구체화합니다. 텍스트 특성 딕셔너리에 있는 font, foregroundColor, shadow 키를 사용해서 제목에 대한 폰트, 텍스트 색상, 텍스트 그림자 색상, 텍스트 그림자 오프셋을 구체화할 수 있습니다. 스트링 형식지정 특성의 경우 Character Attributes를 보시기 바랍니다.
제목의 수직 위치를 조정하려면 setTitleVerticalPositionAdjustment(_:for:) 메소드를 사용할 수 있습니다. 이 메소드는 UIBarMetrics 열거형으로 나타나는 바 높이에 의존적인 조정을 구체화할 수 있도록 해줍니다. 아래 그림은 커스텀 틴트 색상, 제목 텍스트 특성, 바 틴트 색상을 갖는 네비게이션바를 보여주고 있습니다.
네비게이션바의 모양 전반에 완전한 커스터마이징을 허용하려면 추가적으로 커스텀 백그라운드와 그림자 이미지를 제공할 수 있습니다. 커스텀 백그라운드 이미지를 제공하려면 적합한 바 위치 및 metrics 값에 UIImage 객체를 제공하면서 setBackgroundImage(_:for:barMetrics:) 메소드를 사용해야 합니다. 바 위치 인수에 UIBarPosition을 사용해서 윈도우의 하단 혹은 상단 중 어느 곳에 이미지를 사용할 것인지 구체화할 수 있으며, 상단에 나타나는 경우 상태바 아래에 위로 확장할 것인지를 구체화할 수 있습니다. 유사하게 compact 혹은 기본값 바 metrics로 이미지가 사용될 것인지를 구체화할 수 있고, 프롬프트를 가질 것인지 아닌지를 구체화할 수 있으며, 이는 바 metrics 인수에 UIBarMetrics 값을 제공함으로써 구현할 수 있습니다.
그림자를 추가하려면 shadowImage 속성에 크기 조절이 가능한 UIImage를 제공하시기 바랍니다. 커스텀 그림자 이미지를 사용하려면 구체화된 커스텀 백그라운드 이미지를 가질 필요가 있습니다. 아래 그림은 바 위치 값이 UIBarPosition.topAttached이고 바 metrics 값이 UIBarMetrics.default이며, setBackgroundImage(_:for:barMetrics:)를 사용해서 제공된 커스텀 백그라운드 이미지를 갖는 네비게이션 바를 보여주고 있습니다. 커스텀 이미지는 shadowImage 속성에 제공될 수 있습니다.
네비게이션바 커스터마이징의 예시는 Customizing Your App’s Navigation Bar를 보시기 바랍니다.
Customizing Your App’s Navigation Bar
https://developer.apple.com/documentation/uikit/uinavigationcontroller/customizing_your_app_s_navigation_bar
Customize a Navigation Bar with Interface Builder
아래 테이블은 인터페이스 빌더에 있는 특성 인스펙터에서 네비게이션바에 대해 설정할 수 있는 핵심 특성을 리스트로 보여주고 있습니다.
| Attribute | Description |
|---|---|
| Style | 네비게이션바에 적용하기 위한 UI 바 스타일을 구체화할 수 있습니다. 바 스타일은 제목 색상 및 바 틴트 색상을 제어하지만, 해당 특성들에 값을 제공해서 오버라이드할 수 있습니다. 네비게이션바를 반투명하게 만드려면 Translucent를 선택해야 합니다. barStyle과 isTranslucent 속성을 사용해서 런타임 시점에서 이와 같은 값에 접근할 수 있습니다. |
| Bar Tint | 네비게이션바의 틴트 색상을 제어할 수 있습니다. Style 특성에서 암시되는 값을 오버라이드합니다. Translucent 특성이 선택되면, 바 틴트 색상은 자동으로 반투명해집니다. barTintColor 속성을 사용해서 런타임 시점에서 이와 같은 값에 접근할 수 있습니다. |
| Shadow Image | 네비게이션바 아래에 그림자로 사용되는 이미지를 나타냅니다. 이 이미지는 바의 넓이를 일치시키기 위해 수평으로 확장됩니다. shadowImage 속성을 사용해서 런타임 시점에서 이와 같은 값에 접근할 수 있습니다. |
| Back Image | 뒤로가기 버튼의 leading edge에 나타나는 이미지를 구체화합니다. 이 특성은 Back Mask 특성을 갖는 조합으로 사용되어야 합니다. backIndicatorImage 속성을 사용해서 런타임 시점에서 이와 같은 값에 접근할 수 있습니다. |
| Back Mask | Back Image 특성에 연결된 마스크를 구체화합니다. 전환 애니메이션 처리가 진행되는 동안 뒤로가기 버튼의 모양을 제어하기 위해 사용되며, Back Image 특성과 함께 사용되어야 합니다. backIndicatorTransitionMaskImage 속성을 사용해서 런타임 시점에서 이와 같은 값에 접근할 수 있습니다. |
아래 테이블은 네비게이션바의 제목 모양에 영향을 미치는 인터페이스 빌더 특성을 리스트로 보여주고 있습니다.
| Attribute | Description |
|---|---|
| Title Font | 네비게이션바의 중앙에서 제목을 렌더링하기 위해 사용되는 폰트입니다. 딕셔너리에서 font 키에 대응하는 저장된 값으로 런타임 시점에 titleTextAttributes 속성에 있는 이 값에 접근할 수 있습니다. |
| Title Color | 네비게이션바 제목을 렌더링하기 위해 사용되는 색상입니다. 딕셔너리에서 foregroundColor 키에 대응하는 저장된 값으로 런타임 시점에 titleTextAttributes 속성에 있는 이 값에 접근할 수 있습니다. |
| Title Shadow | 네비게이션바의 제목을 렌더링할 때 사용되는 그림자의 색상 및 오프셋을 구체화할 수 있습니다. shadow 키를 사용해서 [titleTextAttributes] 속성에 있는 딕셔너리를 사용해 런타임 시점에 이 값에 접근할 수 있습니다. |
Internationalize a Navigation Bar
네비게이션바를 internationalize하려면 네비게이션 아이템 모델 객체의 표시된 스트링 속성 각각에 로컬화된 스트링을 구체화해야 합니다.
인터페이스를 internationalize하는 것에 대한 더 많은 정보는 Internationalization and Localization Guide를 보시기 바랍니다.
Internationalization and Localization Guide
https://developer.apple.com/library/archive/documentation/MacOSX/Conceptual/BPInternational/Introduction/Introduction.html#//apple_ref/doc/uid/10000171i
Make a Navation Bar Accessible
네비게이션바는 기본값으로 접근 가능한 상태입니다. 네비게이션바에 대한 기본값 접근성 특성은 사용자 상호작용 활성화입니다.
iOS 기기에서 보이스오버가 활성화된 상태이면, 사용자가 계층구조에 있는 새로운 뷰를 네비게이션 동작한 후 보이스오버는 네비게이션바의 제목을 읽으며, 왼쪽 바 버튼 아이템의 이름을 읽습니다. 사용자가 네비게이션바에서 요소를 탭하는 경우 보이스오버는 요소의 이름 및 타입을 읽습니다. 예를 들어 "General back button", "Keyboard heading", "Edit button"입니다.
인터페이스를 접근 가능하게 만드는 것에 대한 일반적인 정보는 Accessibility Programming Guide for iOS를 보시기 바랍니다.
Accessibility Programming Guide for iOS
https://developer.apple.com/library/archive/documentation/UserExperience/Conceptual/iPhoneAccessibility/Introduction/Introduction.html#//apple_ref/doc/uid/TP40008785
Topics
Customizing the Bar's Appearance
Legacy Customizations
네비게이션바 객체에서 직접 모양 정보를 커스터마이징합니다.
https://developer.apple.com/documentation/uikit/uinavigationbar/legacy_customizations
https://velog.io/@panther222128/Legacy-Customizations
See Also
Bars
UIBarItem
스크린 하단에 나타나는 바에 추가할 수 있는 아이템의 추상 슈퍼클래스입니다.
https://developer.apple.com/documentation/uikit/uibaritem
https://velog.io/@panther222128/UIBarItem
UIBarButtonItem
툴바 혹은 탭바에 놓이는 특수한 버튼입니다.
https://developer.apple.com/documentation/uikit/uibarbuttonitem
https://velog.io/@panther222128/UIBarButtonItem
UIBarButtonItemGroup
아이패드에 나타나는 키보드 위의 숏컷 바에 있는 바 버튼 아이템의 집합입니다.
https://developer.apple.com/documentation/uikit/uibarbuttonitemgroup
https://velog.io/@panther222128/UIBarButtonItemGroup
UISearchBar
사용자로부터 검색 관련 정보를 받기 위한 특수한 뷰입니다.
https://developer.apple.com/documentation/uikit/uisearchbar
https://velog.io/@panther222128/UISearchBar
UIToolbar
인터페이스의 하단 edge를 따라 하나 혹은 하나 이상의 버튼을 표시하는 컨트롤입니다.
https://developer.apple.com/documentation/uikit/uitoolbar
https://velog.io/@panther222128/UIToolbar
UITabBar
앱에서 다른 하위작업, 뷰, 모드 사이를 선택할 수 있도록 탭바에 있는 하나 혹은 하나 이상의 버튼을 표시하는 컨트롤입니다.
https://developer.apple.com/documentation/uikit/uitabbar
https://velog.io/@panther222128/UITabBar
UITabBarItem
탭바에서 아이템을 나타내는 객체입니다.
https://developer.apple.com/documentation/uikit/uitabbaritem
https://velog.io/@panther222128/UITabBarItem
