Yet another material bottom bar library for Android

GIF

Design Credits

All design and inspiration credits goes to Ranjit.

Usage

• Create your tabs.xml under your res/xml/ folder

<?xml version="1.0" encoding="utf-8"?>
<tabs>
    <tab
        drawable="@drawable/ic_home_black_24dp"
        text="@string/home" />

    <tab
        drawable="@drawable/ic_search_black_24dp"
        text="@string/search" />

    <tab
        drawable="@drawable/ic_shopping_basket_black_24dp"
        text="@string/bag" />

    <tab
        drawable="@drawable/ic_favorite_black_24dp"
        text="@string/favorite" />

    <tab
        drawable="@drawable/ic_account_circle_black_24dp"
        text="@string/profile" />
</tabs>

• Add bottom bar to your layout

<com.iammert.library.readablebottombar.ReadableBottomBar
    android:layout_width="match_parent"
    android:layout_height="56dp"
    app:rbb_tabs="@xml/tabs"/>

• Add listeners

bottomBar.setOnItemSelectListener { index ->
    // show the page for index
}

bottomBar.setOnItemReselectListener { index ->
    // the current tab was tapped again, e.g. scroll to top
}

• Set index at runtime

bottomBar.selectItem(index)
bottomBar.selectItem(index, animate = false)

• Swap the tabs at runtime

bottomBar.setTabs(R.xml.tabs_logged_in)

• Show badges

bottomBar.setBadge(index, 3)  // shows "3", counts above 99 show "99+"
bottomBar.showBadge(index)    // shows a dot
bottomBar.removeBadge(index)

• Read the current index

val index = bottomBar.selectedIndex

The selected index is saved and restored automatically across configuration changes, as long as the bar has an android:id.

Tab text can be a string resource (recommended) or a literal string.

• Customize if you need. Colors that are not set follow the theme: the background uses android:colorBackground, the indicator colorPrimary, and text and icons android:textColorPrimary.

<com.iammert.library.readablebottombar.ReadableBottomBar
    android:layout_width="match_parent"
    android:layout_height="56dp"
    app:rbb_tabs="@xml/tabs"
    app:rbb_textColor=""
    app:rbb_indicatorHeight=""
    app:rbb_indicatorColor=""
    app:rbb_indicatorCornerRadius=""
    app:rbb_indicatorPosition="top or bottom"
    app:rbb_initialIndex=""
    app:rbb_backgroundColor=""
    app:rbb_textSize=""
    app:rbb_textAppearance="@style/TextAppearance.MaterialComponents.Caption"
    app:rbb_iconColor=""
    app:rbb_animationDuration="300"
    app:rbb_badgeColor=""
    app:rbb_badgeTextColor=""
    app:rbb_activeItemType="text or icon"/>

Setup

Requires minSdk 21 and AndroidX.

// settings.gradle
dependencyResolutionManagement {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

dependencies {
    implementation 'com.github.iammert:ReadableBottomBar:1.1.0'
}

License

Copyright 2019 Mert Şimşek

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.