BottomAppBar 와 BottomNavigationBar의 차이점

박동규·2023년 11월 24일
0

Widgets

목록 보기
17/18

Scaffold 위젯에서 사용하는 BottomAppBarBottomNavigationBar는 Flutter UI에서 하단 탐색 옵션을 제공하는데, 이 두 위젯은 각각 다른 목적과 기능을 가지고 있습니다. 여기서 주요 차이점들을 살펴보겠습니다.

BottomAppBar

  1. 유연성: BottomAppBar는 매우 유연한 위젯으로, 사용자가 원하는 대로 맞춤 설정이 가능합니다. 예를 들어, 플로팅 액션 버튼(FAB)을 중앙에 배치하거나, 여러 개의 버튼, 텍스트, 이미지 등을 포함시킬 수 있습니다.
  2. FAB 통합: BottomAppBarFloatingActionButton과 통합되어 사용될 수 있습니다. FloatingActionButtonBottomAppBar의 중앙에 배치하는 '노치'라고 불리는 디자인을 쉽게 구현할 수 있습니다.
  3. 맞춤 디자인: 개발자는 BottomAppBar의 형태와 스타일을 자유롭게 디자인할 수 있어, 더 독창적이고 다양한 UI 디자인을 구현할 수 있습니다.

BottomNavigationBar

  1. 표준 탐색: BottomNavigationBar는 주로 앱의 주요 탐색 옵션을 제공하는 데 사용됩니다. 일반적으로 2~5개의 아이템(탭)을 가지며, 각 탭을 통해 사용자는 앱의 다른 부분으로 쉽게 이동할 수 있습니다.
  2. 간단한 사용법: BottomNavigationBarBottomAppBar에 비해 사용법이 간단합니다. items 속성에 BottomNavigationBarItem의 리스트를 제공하여 각 탭을 정의하면 됩니다.
  3. 형태의 제한: BottomNavigationBar는 상대적으로 형태와 스타일의 변경이 제한적입니다. 기본적으로 제공되는 탭 스타일링을 주로 사용하게 됩니다.

결론적으로,

  • BottomAppBar를 사용하면 더 많은 사용자 정의와 유연성을 가진 하단 앱 바를 구현할 수 있습니다. 특히, 플로팅 액션 버튼과의 통합 디자인이 필요할 때 적합합니다.
  • BottomNavigationBar는 앱의 주 탐색을 위한 표준적이고 간편한 방법을 제공합니다. 여러 탭을 통한 간단한 UI를 구현할 때 이상적입니다.

각각의 선택은 앱의 디자인 요구 사항과 사용자 경험을 고려하여 결정되어야 합니다.

profile
내가 원하는 것을 만들자

0개의 댓글