오늘 부로 팀프로젝트 앱 구현을 본격적으로 시작했다.
BottomNavigationScaffold를 구현하다가 문득 궁금함이 생겼다.
오늘은 그 궁금증을 해결해봐야겠다.

🔎 BottomNavigationBar

먼저, 이름만 보면 가장 잘 어울릴 것 같은 이놈이다.
요놈은 Material 2에서 사용되었던 Scaffold의 속성이다.
물론 지금도 있지만, 하위 호환성을 위해 google측에서 남겨둔 상황이다.

Icon과 Text의 단순한 구조로 이루어져 있으며, 세로 폭이 좁아 컨텐츠 영역을 더 많이 확보할 수 있다는 장점이 있다.
하지만, M3 테마 설정이 잘 먹지 않는 버그나 제약 조건이 많다.
오늘 같은 경우에도 Theme 설정 내, BackgroundColor가 적용되지 않아 NavigationBar로 변경했다.

BottomNavigationItem을 나열해 사용한다.

🔎 NavigationBar

NavigationBar는 M3에서 가장 권장되는 하단 네비게이션바 위젯이다.
BottomNavigationBar를 대체하기 위해 만들어졌으며, 선택(isSeleted)된 아이콘 뒤에 자동으로 가로 알약모양으로 표시된다.

기본 높이가 80px로 BottomNavigationBar에 비하면 차이가 날 정도로 높게 설계되었다.
google 측에서는 이를 두고 엄지손가락으로 조작하기 편하게 하기 위함이라고 밝혔다.
당연히 세로 폭이 작은 디바이스에서는 불편함이 생길 수 있다.

🔎 BottomAppBar

BottomAppBar는 위의 두 위젯과 다르게 특정 동작을 강조할 때 사용한다.
단순한 네비게이션 위젯이 아니라, 다른 하위 위젯을 자유롭게 배치할 수 있는 컨테이너에 가까운 성격을 가지고 있다.
보통 Floating Action Button과 조합하여 사용하며, FAB가 NavigationBar를 침범하는 노치(Notched) 효과를 줄 수 있다.

디자인 자유도가 매우 높다는 장점이 있지만, 탭 구조를 만들려면 복잡한 부분이 있다.
destinations 속성에 NavigationDestination이라는 Item을 나열해주면 된다.

🔎 TapBar

TapBar는 화면 상단이나 하단에 사용되며, 여러 카테고리나 메뉴를 전환할 때 사용되는 막대 형태의 위젯이다.
TapBarView와 함께 사용되며 탭을 누르면 화면이 전환되며, 좌우로 스와이프를 통해서도 화면을 전환할 수 있다.

Tap 전환을 위해서는 반드시 Controller가 필요하지만, 디자인 자유도가 가장 높다.