{"id":15623162,"url":"https://github.com/akshay2211/bubbletabbar","last_synced_at":"2025-05-16T00:06:12.310Z","repository":{"id":35094280,"uuid":"203377762","full_name":"akshay2211/BubbleTabBar","owner":"akshay2211","description":"BubbleTabBar is a bottom navigation bar with customizable bubble-like tabs","archived":false,"fork":false,"pushed_at":"2023-01-24T07:38:11.000Z","size":18621,"stargazers_count":755,"open_issues_count":0,"forks_count":70,"subscribers_count":12,"default_branch":"master","last_synced_at":"2025-05-16T00:05:24.520Z","etag":null,"topics":["android","android-library","android-ui","hacktoberfest","hacktoberfest2022","kotlin","navigation","navigationbar","tabbar","uiview"],"latest_commit_sha":null,"homepage":"https://github.com/akshay2211/BubbleTabBar","language":"Kotlin","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/akshay2211.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":"akshay2211","patreon":null,"open_collective":"akshay-sharma","ko_fi":"akshay2211","tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2019-08-20T13:04:04.000Z","updated_at":"2025-05-10T19:11:43.000Z","dependencies_parsed_at":"2023-02-13T19:02:52.003Z","dependency_job_id":null,"html_url":"https://github.com/akshay2211/BubbleTabBar","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akshay2211%2FBubbleTabBar","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akshay2211%2FBubbleTabBar/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akshay2211%2FBubbleTabBar/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akshay2211%2FBubbleTabBar/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/akshay2211","download_url":"https://codeload.github.com/akshay2211/BubbleTabBar/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254442854,"owners_count":22071878,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","android-library","android-ui","hacktoberfest","hacktoberfest2022","kotlin","navigation","navigationbar","tabbar","uiview"],"created_at":"2024-10-03T09:56:33.572Z","updated_at":"2025-05-16T00:06:12.275Z","avatar_url":"https://github.com/akshay2211.png","language":"Kotlin","funding_links":["https://github.com/sponsors/akshay2211","https://opencollective.com/akshay-sharma","https://ko-fi.com/akshay2211","https://www.paypal.me/akshay2211"],"categories":[],"sub_categories":[],"readme":"![](media/animation.gif)\n\n# BubbleTabBar\n\nBubbleTabBar is bottom navigation bar with customizable bubble like tabs\n\n[![Android Weekly](https://img.shields.io/badge/Featured%20in%20androidweekly.net-Issue%20%23474-blue.svg?style=flat-square)](https://androidweekly.net/issues/issue-474)\n[![Google Dev Library](https://img.shields.io/badge/Google%20Dev%20Library-BubbleTabBar-brightgreen.svg?style=flat-square)](https://devlibrary.withgoogle.com/products/android/repos/akshay2211-BubbleTabBar)\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/a3f9c05f456b45f1a1e332b3cf668de8)](https://app.codacy.com/gh/akshay2211/BubbleTabBar?utm_source=github.com\u0026utm_medium=referral\u0026utm_content=akshay2211/BubbleTabBar\u0026utm_campaign=Badge_Grade)\n[![BubbleTabBar](https://www.appbrain.com/stats/libraries/shield/bubbletabbar.svg)](https://www.appbrain.com/stats/libraries/details/bubbletabbar/bubbletabbar)\n[![](https://img.shields.io/badge/Android%20Arsenal-BubbleTabBar-blue.svg?style=flat-square)](https://android-arsenal.com/details/1/7841)\n[![](https://img.shields.io/badge/Awesome%20Android-BubbleTabBar-green.svg?style=flat-square)](https://android.libhunt.com/bubbletabbar-alternatives)\n[![](https://img.shields.io/badge/API-16%2B-orange.svg?style=flat-square)](https://android-arsenal.com/api?level=21)\n[![](https://img.shields.io/badge/Google%20Dev%20Libray-BubbleTabBar-red.svg?style=flat-square)](https://devlibrary.withgoogle.com/products/android/repos/akshay2211-BubbleTabBar)\n\n![](media/media-600.gif)\n\n## Usage\n \n```xml\n    \u003cio.ak1.BubbleTabBar\n               android:id=\"@+id/bubbleTabBar\"\n               android:layout_width=\"match_parent\"\n               android:layout_height=\"wrap_content\"\n               android:background=\"#FFF\"\n               android:elevation=\"16dp\"\n               android:padding=\"7dp\"\n               app:bubbletab_menuResource=\"@menu/list\"\n               app:bubbletab_custom_font=\"@font/opensans\"\n               app:bubbletab_disabled_icon_color=\"@color/colorPrimaryDark\"\n               app:bubbletab_horizontal_padding=\"20dp\"\n               app:bubbletab_icon_size=\"20dp\"\n               app:bubbletab_title_size=\"16sp\"\n               app:bubbletab_icon_padding=\"5sp\"\n               app:bubbletab_vertical_padding=\"10dp\"\n               app:bubbletab_tab_corner_radius=\"25dp\"\u003e\n       \u003c/io.ak1.BubbleTabBar\u003e\n```\nor just use\n```xml\n    \u003cio.ak1.BubbleTabBar\n               android:id=\"@+id/bubbleTabBar\"\n               android:layout_width=\"match_parent\"\n               android:layout_height=\"wrap_content\"\n               android:padding=\"7dp\"\n               app:bubbletab_menuResource=\"@menu/list\"\u003e\n       \u003c/io.ak1.BubbleTabBar\u003e\n```\nInflate menu list\n```xml\n\u003cmenu xmlns:android=\"http://schemas.android.com/apk/res/android\"\u003e\n    \u003citem\n        android:id=\"@+id/home\"\n        android:icon=\"@drawable/ic_grid\"\n        android:title=\"Home\"\n        android:checked=\"true\"\n        android:color=\"@color/home\"/\u003e\n\n    \u003citem\n        android:id=\"@+id/log\"\n        android:icon=\"@drawable/ic_clock\"\n        android:title=\"Logger\"\n        android:color=\"@color/logger\"/\u003e\n\u003c/menu\u003e\n            \n```\n\nAdd onclick listener \n\n```kotlin\n   bubbleTabBar.addBubbLeListener(object : OnBubbleClickListener{\n               override fun onBubbleClick(id: Int) {\n                   \n               }\n           })\n```\n### Connect with components like [ViewPager](https://github.com/akshay2211/BubbleTabBar/blob/master/README.md#setup-viewpager-to-bubbletabbar), [ViewPager2](https://github.com/akshay2211/BubbleTabBar#setup-viewpager2-to-bubbletabbar) and [NavController](https://github.com/akshay2211/BubbleTabBar#setup-navcontroller-to-bubbletabbar)\n#### Setup ViewPager to BubbleTabBar\n\n```kotlin\n\n    viewPager.addOnPageChangeListener(object : ViewPager.OnPageChangeListener {\n            override fun onPageScrolled(\n                position: Int,\n                positionOffset: Float,\n                positionOffsetPixels: Int\n            ) {\n\n            }\n\n            override fun onPageSelected(position: Int) {\n                bubbleTabBar.setSelected(position, false)\n            }\n\n            override fun onPageScrollStateChanged(state: Int) {\n            }\n        })\n   \n```\n\n#### Setup ViewPager2 to BubbleTabBar\n\n```kotlin\n\n    viewPager2.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {\n                               override fun onPageSelected(position: Int) {\n                                   super.onPageSelected(position)\n                                   bubbleTabBar.setSelected(position)\n                               }\n                           })\n\n```\n\n#### Setup NavController to BubbleTabBar\n\n*onNavDestinationSelected* can be found in [here](https://github.com/akshay2211/BubbleTabBar/blob/cad8bdc3b634410c4d76c99853016e955f9fac70/app/src/main/java/com/fxn/bubbletabbarapp/utils/Helper.kt#L36)\n\n```kotlin\n\n    bubbleTabBar.addBubbleListener { id -\u003e\n                bubbleTabBar.onNavDestinationSelected(id, navController)\n            }\n    navController.addOnDestinationChangedListener { _, destination, _ -\u003e\n                setSelectedWithId(destination.id, false)\n            }\n\n```\n\n### Java Implementation\nfor [Java-Implementation](https://github.com/akshay2211/BubbleTabBar/wiki/Java-Implementation)\n\n## Credits\nThanks to [Ariana](https://github.com/akshay2211/Ariana) for transition in sample\n\n## Download\n\n include in app level build.gradle\n ```groovy\n        repositories {\n          mavenCentral()\n        }\n ```\n```groovy\n        implementation  'io.ak1:bubbletabbar:1.0.8'\n```\nor Maven:\n```xml\n        \u003cdependency\u003e\n            \u003cgroupId\u003eio.ak1\u003c/groupId\u003e\n            \u003cartifactId\u003ebubbletabbar\u003c/artifactId\u003e\n            \u003cversion\u003e1.0.8\u003c/version\u003e\n            \u003ctype\u003epom\u003c/type\u003e\n        \u003c/dependency\u003e\n```\nor ivy:\n```xml\n        \u003cdependency org='io.ak1' name='bubbletabbar' rev='1.0.8'\u003e\n            \u003cartifact name='bubbletabbar' ext='pom' \u003e\u003c/artifact\u003e\n        \u003c/dependency\u003e\n```\n\n## License\nLicensed under the Apache License, Version 2.0, [click here for the full license](/LICENSE).\n\n## Author \u0026 support\nThis project was created by [Akshay Sharma](https://akshay2211.github.io/).\n\n\u003e If you appreciate my work, consider buying me a cup of :coffee: to keep me recharged :metal: by [PayPal](https://www.paypal.me/akshay2211)\n\n\u003e I love using my work and I'm available for contract work. Freelancing helps to maintain and keep [my open source projects](https://github.com/akshay2211/) up to date!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fakshay2211%2Fbubbletabbar","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fakshay2211%2Fbubbletabbar","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fakshay2211%2Fbubbletabbar/lists"}