[Android] BottomNavigationView 사용하기

제철맞은생선·2022년 12월 30일

ANDROID

목록 보기
7/12
post-thumbnail

카카오톡의 친구, 채팅, 뷰, 쇼핑과 더보기를 보여주는 화면과 같이 하단에 아이콘이 박혀있는 바 형태의 뷰를 BottomNavigationView라고 한다.

BottomNavigationView 설정 방법

1. 각 아이템 (친구, 채팅, 뷰 등)이 들어가는 Menu XML 파일 작성

  • checkable = "true" 가 선언되어있는 item이 디폴트
//menu.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
			xmlns:app="http://schemas.android.com/apk/res-auto">
	<item 
			android:id = "@+id/menu_main_btn_nav_item1"
			android:icon ="@drawable/ic_total_view_unselected"
			android:showAsAction = "always"
			android:enabled = "true"
			android:checkable ="true"
			android:title="아이템1"/>
	<item 
			android:id = "@+id/menu_main_btn_nav_item2"
			android:icon ="@drawable/ic_setting_view_unselected"
			android:showAsAction = "always"
			android:enabled = "true"
			android:title="아이템2"/>
</menu>

2. 바텀네비게이션이 들어기는 액티비티의 xml파일에 BottomNavigationView 추가, 항상 화면의 하단에 위치

3. 각 아이템을 클릭했을 때 나타나는 이벤트 설정

  • run으로 bottomNavigation 표시
  • setOnItemSelectedListener는 특정 아이템을 선택했을 때 행동을 정의
  • when은 코틀린의 switch문, 각 케이스마다 supportFragmentManager를 통해 원하는 fragment를 띄움
  • Listener의 마지막에 true를 반환
  • selectedItemId을 통해 처음에 띄울 화면을 명시적으로 정의
//MainActivity.kt
binding.mainBtmNav.run {
		setOnItemSelectedListener { item ->
				<!-- when = 코틀린에서의 switch ! -->
				when (item.itemId) {
						R.id.menu_main_btm_nav_item1 -> {
						supportFragmentManager
								.beginTransaction()
								.replace(R.id.main_frm, Item1Fragment())
								.commitAllowStateLoss()
						}
						R.id.menu_main_btm_nav_Item2 -> {
						supportFragmentManager
								.beginTransaction()
								.replace(R.id.main_frm, Item2Fragment())
								.commitAllowStateLoss()
						}
				}
				<!-- Listener의 반환값 ! -->
				true
		}
		<!-- 현재 선택된 아이템을 강제 설정 -> 초기설정 ! -->
		selectedItemId = R.id.menu_main_btn_nav_item1
}

기타 fragment 및 frameLayout은 기존의 방법과 동일 "참고"

0개의 댓글