A simple & curved & material bottom navigation for Android written in Kotlin with ♥ .

Related tags

Navigation Bar android library material bottomnavigationview curved navigaion
Overview

Meow Bottom Navigation

A simple & curved & material bottom navigation for Android written in Kotlin with ♥ .

Download

Update your build.gradle (project path) like below :

buildscript {
    repositories {
        jcenter()
    }
}

Update your build.gradle (module path) like below :

dependencies {
  implementation 'com.etebarian:meow-bottom-navigation:1.3.1'
}

Use androidx by adding this lines to gradle.properties. If you want more info, just google AndroidX.

android.useAndroidX=true
android.enableJetifier=true

If you want to add this library to a JAVA Project, you must add kotlin library to build.gradle.

dependencies {
    implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:1.3.61"
}

😍 Donate & Support

We are developing this framework in open source community without financial planning but the maintenance & preparing updates at periodic times is Time-consuming. If you like this project and you want to give us peace of mind, you can support us by clicking this button :

Usage

Add Meow Bottom Navigation in you layout xml file.

"> 
<meow.meowbottomnavigation.MeowBottomNavigation
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Add menu items in code.

val bottomNavigation = findView(R.id.bottomNavigation)
bottomNavigation.add(MeowBottomNavigation.Model(1, R.drawable.ic_home))
bottomNavigation.add(MeowBottomNavigation.Model(2, R.drawable.ic_explore))
bottomNavigation.add(MeowBottomNavigation.Model(3, R.drawable.ic_message))

Add vectorDrawables.useSupportLibrary = true to your build.gradle inside defaultConfig{ ... } to use vector drawable icons.

Customization

"> 
<com.etebarian.meowbottomnavigation.MeowBottomNavigation
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:mbn_circleColor="#ffffff"
    app:mbn_backgroundBottomColor="#ffffff"
    app:mbn_countBackgroundColor="#ff6f00"
    app:mbn_countTextColor="#ffffff"
    app:mbn_countTypeface="fonts/SourceSansPro-Regular.ttf"
    app:mbn_defaultIconColor="#90a4ae"
    app:mbn_rippleColor="#2f424242"
    app:mbn_selectedIconColor="#3c415e"
    app:mbn_shadowColor="#1f212121"
    app:mbn_hasAnimation="true"    
/>
  • You can change this properties in Kotlin/Java Realtime ⌚ .

Listeners

Use setOnShowListener() function to access when a cell has been shown.

bottomNavigation.setOnShowListener {
    // YOUR CODES
}

Use setOnClickMenuListener() function to access when a cell has been clicked.

bottomNavigation.setOnClickMenuListener {
    // YOUR CODES
}

If you are Java Developer, use this examples :

bottomNavigation.setOnClickMenuListener(new Function1<MeowBottomNavigation.Model, Unit>() {
            @Override
            public Unit invoke(MeowBottomNavigation.Model model) {
                // YOUR CODES
                return null;
            }
        });

bottomNavigation.setOnShowListener(new Function1<MeowBottomNavigation.Model, Unit>() {
            @Override
            public Unit invoke(MeowBottomNavigation.Model model) {
                // YOUR CODES
                return null;
            }
        });

Counter Badge

Set counter badge on a specific cell by setCount(Int,String).

bottomNavigation.setCount(CELL_ID, YOUR_STRING)

Clear counter badge on a specific cell by clearCount(Int).

bottomNavigation.clearCount(CELL_ID)

Clear all counter badges on a specific cell by clearCount(Int).

bottomNavigation.clearAllCounts(TAB_ID)

Set Default CELL

Use this function :

bottomNavigation.show(CELL_ID)
Comments
  • added solution to use in java project.

    added solution to use in java project.

    Capture i got error and i cannot resolve getId() error

    I use 1.8 java in gradle still lamda function got error compileOptions { sourceCompatibility = '1.8' targetCompatibility = '1.8' }

    can you give this bottom navigation code in java language too.

    enhancement 
    opened by lingesh10 12
  • keyboard does not open, when i using this library

    keyboard does not open, when i using this library

    Hello guys, I am using this library in an activity and show fragment on a frame layout when user click on any button of bottom navigation. when user want to type anything in any editText, keyboard does not open by showing this message in logcat: 2020-02-06 07:38:20.352 3650-3650/com.tivasoft.myorder W/IInputConnectionWrapper: getTextAfterCursor on inactive InputConnection and keyboard closed.

    bug 
    opened by rezaghahremani77 10
  • Caused by: android.view.InflateException: Binary XML file line #14: Binary XML file line #14: Error inflating class com.etebarian.meowbottomnavigation.MeowBottomNavigation

    Caused by: android.view.InflateException: Binary XML file line #14: Binary XML file line #14: Error inflating class com.etebarian.meowbottomnavigation.MeowBottomNavigation

    java.lang.RuntimeException: Unable to start activity ComponentInfo{com.alialfayed.facerecognition/com.alialfayed.facerecognition.view.activity.HomeActivity}: android.view.InflateException: Binary XML file line #14: Binary XML file line #14: Error inflating class com.etebarian.meowbottomnavigation.MeowBottomNavigation at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2817) at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2892) at android.app.ActivityThread.-wrap11(Unknown Source:0) at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1593) at android.os.Handler.dispatchMessage(Handler.java:105) at android.os.Looper.loop(Looper.java:164) at android.app.ActivityThread.main(ActivityThread.java:6541) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.Zygote$MethodAndArgsCaller.run(Zygote.java:240) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:767) Caused by: android.view.InflateException: Binary XML file line #14: Binary XML file line #14: Error inflating class com.etebarian.meowbottomnavigation.MeowBottomNavigation Caused by: android.view.InflateException: Binary XML file line #14: Error inflating class com.etebarian.meowbottomnavigation.MeowBottomNavigation

    bug 
    opened by alfayedoficial 7
  • Keypad closes as soon as editText is focused in fragment

    Keypad closes as soon as editText is focused in fragment

    UI & animations are damn good in this library. Coming to the issue, I'm calling a fragment when one of the menu items are clicked and Keypad keeps closes as soon as editText is focused in that fragment. I checked it many a times but, result is same. Can you help me in fixing this please?

    opened by rahulas 7
  • From Kotlin to Java

    From Kotlin to Java

    Please, upload a full source of java for this project. Many of us who code in java can't understand the kotlin code, there is not enough source to convert kotlin to java. The ByteCode are also so confusing. Please, update it for java also.

    opened by rakibhasan1030 5
  • How to use it in Java?

    How to use it in Java?

    Actually I haven't used kotlin till yet and doesn't ever wanna bother but, you did such a great job so I wanna implement it in my existing project.

    Wann to know how to add nav menu items in java and call it from Java code.

    Thanx in Advance

    opened by b7ca6q 4
  • Selected button background

    Selected button background

    Hello Hamidreza. I'm using your awesome BottomNavigation. Now, I want to set background color for selected button. Is this possible? Can you help me on this?

    tnx (:

    enhancement 
    opened by arbalali 4
  • Programmatically hide button

    Programmatically hide button

    I'm trying this bottom navbar and it's beautiful, but it doesn't have the possibility to handle hiding of opened button programmatically ( example: add fragment to stack and press back to return main page)

    opened by federicocossetta 4
  • Inverted U-shaped Curve

    Inverted U-shaped Curve

    Hi. Thank you for your awesome library. I was wondering that is there some sort of attribute or hack or something like that to achieve an inverted U-shaped curve. Something like this: Untitled

    opened by mohammadzzz 3
  • consider migrating to jitpack or maven central

    consider migrating to jitpack or maven central

    @oneHamidreza jCenter is currently deprecated and artifacts can only be downloaded till 2022-02-01, consider migrating to jitpack or maven central. more info here

    opened by yamin8000 2
  • The first page doesn't show any thing

    The first page doesn't show any thing

    opened by alikazemiinfo 1
  • 1.3.1 dont show icons correctly

    1.3.1 dont show icons correctly

    Version 1.2.0

    class - import com.etebarian.meowbottomnavigation.MeowBottomNavigation xml - <com.etebarian.meowbottomnavigation.MeowBottomNavigation

    Captura

    Version 1.3.1 class change to - import meow.bottomnavigation.MeowBottomNavigation xml change to - <meow.bottomnavigation.MeowBottomNavigation And result change to (red arrow is mine, if you dont see the icon)

    2

    any idea?

    opened by Irthael 2
Releases(v1.3.1)
Owner
Hamidreza Etebarian
I am android developer from 2011 and worked in 30+ projects.
Hamidreza Etebarian
GitHub http://etebarian.com
New style for app design simple bottom navigation with side navigation drawer UI made in Jetpack Compose.😉😎

BottomNavWithSideDrawer New style for app design simple bottom navigtaion with side navigation drawer UI made in Jetpack Compose. ?? ?? (Navigation Co

Arvind Meshram 5 Nov 24, 2022
Navigation Drawer Bottom Navigation View

LIVE #019 - Toolbar, Navigation Drawer e BottomNavigationView com Navigation Com

Kaique Ocanha 6 Jun 15, 2022
A library that you can use for bottom navigation bar. Written with Jetpack Compose

FancyBottomNavigationBar A library that you can use for bottom navigation bar. W

Alperen Çevlik 3 Jul 27, 2022
BubbleTabBar is bottom navigation bar with customizable bubble like tabs

BubbleTabBar BubbleTabBar is bottom navigation bar with customizable bubble like tabs Usage <com.fxn.BubbleTabBar android:id="@+id/

Akshay sharma 576 Dec 30, 2022
Implementing bottom navigation in jetpack compose

Compose-Bottom-Navigation Implementing bottom navigation in jetpack compose Add the Navigation dependency Open the app's build file, found at app/buil

Steve Chacha 5 Dec 26, 2021
Jetpack Compose BottomDrawerScaffold (Material Bottom Drawer)

BottomDrawerScaffold Current Compose Version: 1.0.2 Compose BottomDrawerScaffold which implements the Material Bottom Drawer https://material.io/compo

Alexander Karkossa 8 Dec 28, 2022
[ACTIVE] Simple Stack, a backstack library / navigation framework for simpler navigation and state management (for fragments, views, or whatevers).

Simple Stack Why do I want this? To make navigation to another screen as simple as backstack.goTo(SomeScreen()), and going back as simple as backstack

Gabor Varadi 1.3k Jan 2, 2023
Alligator is a modern Android navigation library that will help to organize your navigation code in clean and testable way.

Alligator Alligator is a modern Android navigation library that will help to organize your navigation code in clean and testable way. Features Any app

Artur Artikov 290 Dec 9, 2022
Android multi-module navigation built on top of Jetpack Navigation Compose

MultiNavCompose Android library for multi-module navigation built on top of Jetpack Navigation Compose. The goal of this library is to simplify the se

Jeziel Lago 21 Dec 10, 2022
DSC Moi University session on using Navigation components to simplify creating navigation flow in our apps to use best practices recommended by the Google Android Team

Navigation Components Navigate between destination using safe args How to use the navigation graph and editor How send data between destinations Demo

Breens Mbaka 6 Feb 3, 2022
Navigation Component: THE BEST WAY to create navigation flows for your app

LIVE #017 - Navigation Component: A MELHOR FORMA de criar fluxos de navegação para o seu app! Código fonte do projeto criado na live #017, ensinando c

Kaique Ocanha 4 Jun 15, 2022
Animated Tab Bar is an awesome navigation extension that you can use to add cool, animated and fully customizable tab navigation in your apps

Animated Tab Bar is an awesome navigation extension that you can use to add cool, animated and fully customizable tab navigation in your apps. The extension provides handy methods and properties to change the behaviour as well as the appearance of the navigation bar.

Zain Ul Hassan 4 Nov 30, 2022
Okuki is a simple, hierarchical navigation bus and back stack for Android, with optional Rx bindings, and Toothpick DI integration.

Okuki A simple, hierarchical navigation bus and back stack for Android, with optional Rx bindings, and Toothpick integration for automatic dependency-

Cain Wong 143 Nov 25, 2022
A simple navigation library for Android 🗺️

Enro ??️ A simple navigation library for Android "The novices’ eyes followed the wriggling path up from the well as it swept a great meandering arc ar

Isaac Udy 216 Dec 16, 2022
A simple, highly customizable compose navigation component for Android & Desktop platform.

介绍 一个简单并提供高度扩展功能的 Compose 导航组件，同时支持 Android 和 Desktop 平台。 常用功能 使用 下载 // Android implementation("io.github.succlz123:compose-screen-android:0.0.1") //

Ning 15 Nov 24, 2022
A simple Floating Action Button that shows an anchored Navigation View

Floating Navigation View A simple Floating Action Button that shows an anchored Navigation View and was inspired by Menu Material Fixed created by Tom

André Mion 1.3k Dec 29, 2022
A Simple App to implement Navigation Architecture Component.

Android Navigation codelab Content: https://codelabs.developers.google.com/codelabs/android-navigation/ License Copyright 2018 The Android Open Source

Gilbert Ngeno 0 Nov 5, 2021
A small and simple, yet fully fledged and customizable navigation library for Jetpack Compose

A small and simple, yet fully fledged and customizable navigation library for Jetpack Compose

Vitali Olshevski 290 Dec 29, 2022
🎉 [Android Library] A light-weight library to easily make beautiful Navigation Bar with ton of 🎨 customization option.

Bubble Navigation ?? A light-weight library to easily make beautiful Navigation Bars with a ton of ?? customization options. Demos FloatingTopBarActiv

Gaurav Kumar 1.7k Dec 31, 2022