[Kotlin] 하단 내비게이션 뷰 구현

호우·2022년 7월 27일
0

코틀린

목록 보기
4/8

이번 포스팅에서는 하단 내비게이션 뷰를 구현하고, 하단 버튼들을 눌렀을 때 작동되는 코드까지를 다룬다.

bottom_menu.xml

하단에 구성될 메뉴를 세팅한다. bottom_menu.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:title="Home"
        android:enabled="true"
        android:id="@+id/menu_home"
        android:icon="@drawable/ic_launcher_foreground"/>
    <item
        android:title="list"
        android:enabled="true"
        android:id="@+id/menu_list"
        android:icon="@drawable/ic_launcher_foreground" />
    <item
        android:title="search"
        android:enabled="true"
        android:id="@+id/menu_search"
        android:icon="@drawable/ic_launcher_foreground" />
    <item
        android:title="community"
        android:enabled="true"
        android:id="@+id/menu_community"
        android:icon="@drawable/ic_launcher_foreground" />
    <item
        android:title="mymenu"
        android:enabled="true"
        android:id="@+id/mymenu"
        android:icon="@drawable/ic_launcher_foreground" />
</menu>

메인 레이아웃에 넣을 bottomnavigationView를 넣는다.

activity_main.xml

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="#40E0D0"
            app:menu="@menu/bottom_menu" />
override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
        
        initNavigationBar()
}

하단 네비게이션 뷰를 눌렀을 때 작동되는 코드는 다음과 같다.
bottom_menu.xml에서 세팅했던 id를 매칭시켜서 해당 메뉴를 눌렀을 때 매칭되는 Fragment를 띄워준다.

fun initNavigationBar(){
        binding.bottomView.run{
            setOnItemSelectedListener {item->
                when(item.itemId){
                    R.id.menu_home -> {
                        changeFragment(firstFragment)
                        true
                    }
                    R.id.menu_list ->{
                        changeFragment(SecondFragment)
                        true
                    }
                    R.id.menu_community ->{
                        changeFragment(ThirdFragment)
                        true
                    }
                    R.id.menu_search ->{
                        changeFragment(FourthFragment)
                        true
                    }
                    R.id.mymenu -> {
                        changeFragment(FifthFragment)
                        true
                    }
                    else -> true
                }
            }
        }
    }

	//프래그먼트 전환 위한 함수. 버튼을 눌렀을 때 해당 프래그먼트로 전달.
    fun changeFragment(fragment: Fragment){
        supportFragmentManager.beginTransaction().replace(R.id.mainFrame, fragment).commit()
    }
profile
뉴비 프로그래머

0개의 댓글