Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

How to Implement SuperBottomBar in Android App?

  • Last Updated : 23 Apr, 2021

In this article, we are going to implement bottom navigation like there in Spotify. We all have come across apps that have a Bottom Navigation Bar. Some popular examples include Instagram, Snapchat, etc. In this article, let’s learn how to implement an easy stylish SuperBottomBar functional Bottom Navigation Bar in the Android app. For Creating a Basic Bottom Navigation bar refer to Bottom Navigation Bar in Android

Step by Step Implementation

Step 1: Create a New Project

Attention reader! Don’t stop learning now. Get hold of all the important Java Foundation and Collections concepts with the Fundamentals of Java and Java Collections Course at a student-friendly price and become industry ready. To complete your preparation from learning a language to DS Algo and many more,  please refer Complete Interview Preparation Course.

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.

Step 2: Add dependency and JitPack Repository

Navigate to the Gradle Scripts > build.gradle(Module:app) and add the below dependency in the dependencies section.   

implementation ‘com.github.ertugrulkaragoz:SuperBottomBar:0.4’

Add the JitPack repository to your build file. Add it to your root build.gradle at the end of repositories inside the allprojects{ } section.

allprojects {

 repositories {


   maven { url “” }



After adding this dependency sync your project and now we will move towards its implementation.  

Step 3: Working with the menu file

Refer to How to Create Menu Folder & Menu File in Android Studio and create a menu file. Below is the code for the menu.xml file.


<?xml version="1.0" encoding="utf-8"?>
        android:title="Home" />
        android:title="Chat" />
        android:title="Search" />
        android:title="Book" />
        android:title="Profile" />

Step 4: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. 


<?xml version="1.0" encoding="utf-8"?>
        app:sbb_menu="@menu/menu" />

Step 5: Working with the file

Go to the file and refer to the following code. Below is the code for the file. Comments are added inside the code to understand the code in more detail. We have just set a listener to the BottomBar.


import android.os.Bundle;
import android.widget.Toast;
import me.ertugrul.lib.OnItemSelectedListener;
import me.ertugrul.lib.SuperBottomBar;
public class MainActivity extends AppCompatActivity {
    SuperBottomBar botttomBar;
    protected void onCreate(Bundle savedInstanceState) {
        // initialise the layout
        botttomBar = findViewById(;
        // when we click on any item the show the toast message as selected
        botttomBar.setOnItemSelectListener(new OnItemSelectedListener() {
            public void onItemSelect(int i) {
                Toast.makeText(MainActivity.this, "Selected", Toast.LENGTH_LONG).show();


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!