底层揭秘：Android BottomNavigationView 探索其使用与源码

2023-12-25 12:51:00

揭开 BottomNavigationView 的神秘面纱

在 Android 开发中，BottomNavigationView 扮演着至关重要的角色，为用户提供便捷的应用程序导航。它位于屏幕底部，允许用户轻松地在不同页面或功能之间切换。虽然 BottomNavigationView 具有强大的功能，但深入了解其内部机制有助于我们充分发挥其潜力。

使用 BottomNavigationView

配置菜单项

配置 BottomNavigationView 的第一步是为其定义菜单项。这可以通过 XML 布局文件中的 menu 资源完成：

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/menu_home"
        android:icon="@drawable/ic_home"
        android:title="Home" />
    <item
        android:id="@+id/menu_search"
        android:icon="@drawable/ic_search"
        android:title="Search" />
    <item
        android:id="@+id/menu_profile"
        android:icon="@drawable/ic_profile"
        android:title="Profile" />
</menu>

添加到 Activity 布局

将 BottomNavigationView 添加到 Activity 布局也非常简单，只需使用以下代码：

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- ...其他布局元素 -->

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:menu="@menu/bottom_navigation" />
</FrameLayout>

处理点击事件

当用户点击 BottomNavigationView 中的菜单项时，系统会触发一个事件。我们可以通过实现 BottomNavigationView.OnNavigationItemSelectedListener 接口来处理此事件：

class MainActivity : AppCompatActivity(), BottomNavigationView.OnNavigationItemSelectedListener {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val bottomNavigationView = findViewById<BottomNavigationView>(R.id.bottom_navigation)
        bottomNavigationView.setOnNavigationItemSelectedListener(this)
    }

    override fun onNavigationItemSelected(item: MenuItem): Boolean {
        when (item.itemId) {
            R.id.menu_home -> {
                // 处理 Home 菜单项的点击事件
                return true
            }
            R.id.menu_search -> {
                // 处理 Search 菜单项的点击事件
                return true
            }
            R.id.menu_profile -> {
                // 处理 Profile 菜单项的点击事件
                return true
            }
        }
        return false
    }
}