Working with Android Bottom Navigation Bar

 
更多

Android navigation architecture components provide a Bottom Navigation Bar, which is a widely used UI component in modern Android applications. Bottom Navigation Bars offer a convenient way to switch between different sections or screens of an app and provide a consistent user interface.

In this blog post, we will explore how to work with the Android Bottom Navigation Bar using Kotlin and Java in Android development.

What is a Bottom Navigation Bar?

A Bottom Navigation Bar is a UI component that is typically placed at the bottom of an app screen. It consists of multiple items, usually represented by icons or text, that allow users to navigate between different sections of the app.

The Bottom Navigation Bar commonly follows the Material Design guidelines and provides a fixed number of visible items, usually up to five. Each item is associated with a destination or screen within the app.

Creating a Bottom Navigation Bar

To create a Bottom Navigation Bar in your Android app, follow these steps:

  1. Open your project in Android Studio.
  2. Open the layout file where you want to add the Bottom Navigation Bar.
  3. Add the following code to your layout file:
<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:menu="@menu/bottom_navigation_menu" />
  1. Create a new resource file called bottom_navigation_menu.xml under the res/menu directory.
  2. Add the following code to bottom_navigation_menu.xml:
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/ic_home"
        android:title="Home" />
    <item
        android:id="@+id/navigation_dashboard"
        android:icon="@drawable/ic_dashboard"
        android:title="Dashboard" />
    <item
        android:id="@+id/navigation_notifications"
        android:icon="@drawable/ic_notifications"
        android:title="Notifications" />
    <item
        android:id="@+id/navigation_profile"
        android:icon="@drawable/ic_profile"
        android:title="Profile" />
</menu>
  1. In your activity or fragment, retrieve the Bottom Navigation View using its ID and set up a listener to handle item selections:
val bottomNavigationView: BottomNavigationView = findViewById(R.id.bottom_navigation)
bottomNavigationView.setOnNavigationItemSelectedListener { item ->
    when (item.itemId) {
        R.id.navigation_home -> {
            // Handle home item selection
            true
        }
        R.id.navigation_dashboard -> {
            // Handle dashboard item selection
            true
        }
        R.id.navigation_notifications -> {
            // Handle notifications item selection
            true
        }
        R.id.navigation_profile -> {
            // Handle profile item selection
            true
        }
        else -> false
    }
}

Handling Item Selections

When an item in the Bottom Navigation Bar is selected, the listener you set up will be triggered. Inside the listener, you can handle the respective item selection and perform the necessary actions, such as switching fragments or updating the UI.

Make sure to return true from the respective when branch to indicate that the item selection has been handled.

Customization and Styling

You can easily customize the appearance of the Bottom Navigation Bar to match your app’s design. The app:menu attribute in the layout file specifies the menu resource file that defines the items and their properties.

You can also customize the icons and text styles of the items, add badges to indicate notifications, and change colors using styles and themes.

Conclusion

The Android Bottom Navigation Bar is a versatile UI component that helps provide a seamless navigation experience in your Android app. By following the steps outlined in this blog post, you can easily integrate a Bottom Navigation Bar into your app and customize it according to your needs.

Explore the Android documentation for more details on working with the Bottom Navigation Bar, including advanced features like dynamic item addition and shifting modes.

Happy app development!

打赏

本文固定链接: https://www.cxy163.net/archives/8815 | 绝缘体

该日志由 绝缘体.. 于 2019年04月26日 发表在 未分类 分类下, 你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站或博客。
原创文章转载请注明: Working with Android Bottom Navigation Bar | 绝缘体
关键字: , , , ,

Working with Android Bottom Navigation Bar:等您坐沙发呢!

发表评论


快捷键:Ctrl+Enter