iOS & Swift 공부 - Navigation Item

김영채 (Kevin)·2021년 2월 18일
2

iOS & Swift

목록 보기
80/107


Navigation Item → Navigation Bar 의 콘텐츠를 표시하는 "객체"다.

  • View Controller 가 전환될 때마다 Navigation Bar 는 하나의 " 공동 객체 " 지만, Navigation Item 은 각각의 View Controller 가 가지고 있는 Property 이다.
  • 보통 Navigation Bar 에서 보여지는 중앙 타이틀, 좌측 바 버튼, 우측 바 버튼 등이 Navigation Item 의 프로퍼티다. **

주요 프로퍼티

  • title : 내비게이션바에 표시되는 내비게이션 아이템의 제목. 기본값은 nil입니다.

     var title: String? { get set }
  • backBarButtonItem : 내비게이션바에서 뒤로 버튼이 필요할 때 사용할 바 버튼 항목.

     var backBarButtonItem: UIBarButtonItem? { get set }
  • hidesBackButton : 뒤로 버튼이 숨겨져 있는지를 결정하는 부울 값.

    var hidesBackButton: Bool { get set }

주요 메서드

  • setHidesBackButton(_:animated:) : 뒤로 버튼이 숨겨져 있는지를 설정하고, 전환 애니메이션 효과 적용

    func setHidesBackButton(_ hidesBackButton: Bool, animated: Bool)

내비게이션 아이템 커스터마이징

좌측 바 버튼, 우측 바 버튼 아이템의 경우 타입은 UIBarButtonItem 이다. 그리고 상황에 따라서 Custom View를 넣어서 구현할 수도 있다.

프로퍼티

  • titleView : 중앙 타이틀 영역의 뷰

     var titleView: UIView? { get set }
    
    // Tip : 중앙 타이틀 영역에 뷰를 상속받은 (UILabel, UIView, UIImageView 등등) 클래스들을 표현할 수 있습니다.
  • leftBarButtonItems : 좌측 아이템 영역의 UIBarButtonItem의 바 버튼 아이템 배열

     var leftBarButtonItems: [UIBarButtonItem]? { get set }
  • leftBarButtonItem : 좌측 아이템 영역의 UIBarButtonItem 중에 가장 좌측 바 버튼 아이템

     var leftBarButtonItem: UIBarButtonItem? { get set }
  • rightBarButtonItems : 우측 아이템 영역의 UIBarButtonItem의 바 버튼 아이템 배열

     var rightBarButtonItems: [UIBarButtonItem]? { get set }
  • rightBarButtonItem : 우측 아이템 영역의 UIBarButtonItem 중에 가증 우측 바 버튼 아이템

    var rightBarButtonItem: UIBarButtonItem? { get set }

메서드

  • setLeftBarButtonItems(_:animated:) : 좌측 아이템 영역에 UIBarButtonItem 타입의 객체들을 순차적으로 설정하고 애니메이션 효과를 적용

     func setLeftBarButtonItems(_ items: [UIBarButtonItem]?, animated: Bool)
  • setLeftBarButton(_:animated:) : 좌측 아이템 영역에 UIBarButtonItem 타입의 객체를 설정하고 애니메이션 효과를 적용

     func setLeftBarButton(_ item: UIBarButtonItem?, animated: Bool)
  • setRightBarButtonItems(_:animated:) : 우측 내비게이션 아이템 영역에 UIBarButtonItem 타입의 객채들을 순차적으로 설정하고 애니메이션 효과를 적용

     func setRightBarButtonItems(_ items: [UIBarButtonItem]?, animated: Bool)
  • setRightBarButton(_:animated:) : 우측 아이템 영역에 UIBarButtonItem 타입의 객체를 설정하고 애니메이션 효과를 적용

     func setRightBarButton(_ item: UIBarButtonItem?, animated: Bool)

Bar Button Item


UIToolBar / UINavigationBar (backBarButtonItem, leftBarButtonItem, rightBarButtonItem 등) 에 배치할 수 있는 특수한 버튼 = Bar Button Item

  • 제목이나 이미지 보여주기 가능
  • 아니면 UIBarButtonItem.SystemItem 열거형에 정의된 여러 스타일 중 하나 선택 역시 가능

Tip : iOS 11에서는 UIBarButtonItem을 오토레이아웃 제약 없이 내비게이션 아이템으로 추가하면 바 버튼 아이템의 프레임이 예상치 못한 크기로 나올 수 있습니다. 이럴 땐 UIBarButtonItem 객체에 적절한 오토레이아웃 제약을 추가한 후 내비게이션 아이템으로 설정하면 설정한 제약에 따라 알맞은 크기로 볼 수 있습니다.

주요 프로퍼티

  • title : 아이템에 표시되는 제목.
var title: String? { get set }

image : 아이템에 표시되는 이미지.

 var image: UIImage? { get set }
  • style : 아이템의 스타일.

     var style: UIBarButtonItem.Style { get set }
  • width : 아이템의 너비 값.

     var width: CGFloat { get set }
  • tintColor : 아이템에 적용할 색상

     var tintColor: UIColor? { get set }

주요 상수

  • UIBarButtonItem.Style : 아이템 스타일 정의.
  • UIBarButtonItem.SystemItem : 바 버튼 아이템에 대한 시스템 제공 스타일.

추가 Notes:


  • Storyboard 에서 UIToolBar 추가하는 방법

→ Navigation Controller 를 누른 다음에 Attributes Inspector 에서 ToolBar 를 눌러주면 임베디드 되어있는 모든 View Controller에 아래처럼 ToolBar 가 생김.

→ 이 ToolBar 에 Bar Button Item 을 올릴 수가 있다.

위 내용은 "https://www.boostcourse.org/mo326/lecture/16903" 을 참고하여 공부한 내용을 개인적으로 정리하였습니다.

profile
맛있는 iOS 프로그래밍

0개의 댓글