How to set notification count for Android BottomNavigationView?

Question

I am using

to set BottomNavigationView in my android app. My question is

Answer 1

First you need to add app:actionLayout in menu file's item where you want to show badge of your BottomNavigationView like this

<item
    android:id="@+id/navigation_chat"
    app:actionLayout="@layout/unread_message_layout"
    android:icon="@drawable/selector_bottom_navigation_chat"
    android:title=""
    app:showAsAction="always" />

where unread_message_layout is the layout which has badge something like below

Here is the XML of that layout

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

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/tvUnreadChats"
        android:layout_width="@dimen/_15sdp"
        android:layout_height="@dimen/_15sdp"
        android:layout_gravity="top|center_horizontal"
        android:layout_marginLeft="@dimen/_5sdp"
        android:background="@drawable/red_circle"
        android:gravity="center"
        android:textColor="@android:color/white"
        android:textSize="@dimen/_7sdp"
        android:visibility="visible"
        tools:text="5" />
</FrameLayout>

and in your activity where BottomNavigationView is available, add this to show badges

var mbottomNavigationMenuView = binding.bottomNavigationView.getChildAt(0) as BottomNavigationMenuView
var chatBadge = LayoutInflater.from(this).inflate(R.layout.unread_message_layout,
                mbottomNavigationMenuView, false)
var itemView = mbottomNavigationMenuView.getChildAt(2) as BottomNavigationItemView

val tvUnreadChats = chatBadge.findViewById(R.id.tvUnreadChats) as TextView
tvUnreadChats.text = "1"//String that you want to show in badge
itemView.addView(chatBadge)

Here getChildAt(2) is third item in my BottomNavigationView

Answer 2

Create a layout with one Textview like below.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">

    <TextView
        android:id="@+id/notification_badge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        android:layout_marginBottom="30dp"
        android:layout_marginLeft="20dp"
        android:layout_marginStart="20dp"
        android:background="@drawable/circlebackground" // Circle background view
        android:padding="3dp"
        android:textColor="@color/black"
        android:textSize="10sp"
        tools:text="9+" />

</FrameLayout>

After initializing the BottomNavgationView, you have to inflate the layout and select the index of View item and set the count.

    BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_navigation);
    BottomNavigationMenuView bottomNavigationMenuView =
            (BottomNavigationMenuView) bottomNavigationView.getChildAt(0);
    View v = bottomNavigationMenuView.getChildAt(1);
    BottomNavigationItemView itemView = (BottomNavigationItemView) v;

    View badge = LayoutInflater.from(this)
            .inflate(R.layout.homescreen_count, bottomNavigationMenuView, false);
    TextView tv = badge.findViewById(R.id.notification_badge);
    tv.setText("22+");
    itemView.addView(badge);

Answer 3

It's simple. You just write this:

bottomNav.getOrCreateBadge(R.id.navigation_announcement).number = 5

Happy coding!

Answer 4

Just made your custom own bottom bar from horizontal recyclerview, and the class as view and you can have everything at the bottom bar. dont forget Spacing decorator & menu parser if needed. Can sent you my solution if You want.