# SmoothBottomBar: Android bottom navigation with a View and a Jetpack Compose composable in the same library

> SmoothBottomBar is a Kotlin Android library that ships an animated bottom navigation bar as both a classic XML View and a Jetpack Compose composable. Both forms require API 32 or above and share the same pill-style active indicator design.

**ibrahimsn98/SmoothBottomBar** — A lightweight Android material bottom navigation bar library

- Repository: https://github.com/ibrahimsn98/SmoothBottomBar
- Stars: 2,063 · Forks: 256
- Language: Kotlin
- License: MIT
- Published: 2026-10-11 · Updated: 2026-10-11 · Language: en
- Canonical page: https://hysenlabs.com/projects/ibrahimsn98-smoothbottombar

## A bar delivered in two forms, with the same design in both

SmoothBottomBar gives Android developers two ways to add an animated bottom navigation bar. One is a classic XML View that reads navigation items from a menu resource file. The other is a fully Compose-native composable that the author describes as functionally equivalent to the View version. Both forms live in the same repository: the View implementation is under lib/ and the Compose implementation is under compose/.

Visual design credit goes to Alejandro Ausejo's Dribbble shot of a Navigation Menu Animation, and the README names him specifically. What differentiates SmoothBottomBar from a plain BottomNavigationView is the pill indicator that slides between items on selection and the badge dot that attaches to any item with hasBadge set to true. The pill transition speed is controlled by itemAnimDurationMillis, which defaults to 200 in the Compose API.

## API 32 is the minimum, and a Java dependency note contains a placeholder version

The repository badge reads API 32+, setting Android 12L as the minimum supported version. Devices running Android 11 or earlier are outside the supported range, and the README documents no way to lower that floor.

For projects without Kotlin, the README includes a note: adding org.jetbrains.kotlin:kotlin-stdlib:$kotlinVersion may be necessary, since this is a Kotlin library. The line uses $kotlinVersion as a Gradle variable placeholder rather than an actual version number. Nothing in the README supplies the value, so a Java project adopting SmoothBottomBar must determine the appropriate Kotlin stdlib version from the library's own build configuration. This note is easy to miss because it appears inline below the listener code rather than in a dedicated setup section.

## Getting the library from Jitpack, with a full sample in app/

SmoothBottomBar is distributed through Jitpack, and the Jitpack badge in the README links to jitpack.io/#ibrahimsn98/SmoothBottomBar. The latest tagged version is 2.0.1, published on 2026-08-16, which followed 2.0.0 two days earlier on 2026-08-14. Version 1.8.0 was the preceding significant tag, from 2026-01-28. A CHANGELOG.md at the repository root tracks what changed across the v2 line, and the last push was on 2026-08-19.

The README does not show the Gradle lines for adding Jitpack to a project or declaring the dependency artifact. Both steps are standard for any Jitpack-hosted library, and the Jitpack page at jitpack.io/#ibrahimsn98/SmoothBottomBar carries the exact lines to copy. A working sample application lives under app/ for confirming integration behavior after setup, and the Compose-specific wiring is in app/src/main/java/me/ibrahimsn/app/ComposeMainActivity.kt.

## The Compose composable requires the caller to own selectedIndex and supply a selection callback

The Compose version is described as a controlled component. Ownership of selectedIndex sits with the caller, not with the composable itself. Two callbacks handle user interaction: onItemSelected fires when the user taps a different item, and onItemReselected fires when the user taps the already-active item. In the parameter table, items, selectedIndex and onItemSelected each show no default (required), while onItemReselected defaults to an empty lambda and is therefore optional.

```kotlin
val items = listOf(
    SmoothBarItem(icon = painterResource(R.drawable.ic_dashboard_white_24dp), label = "Dashboard"),
    SmoothBarItem(icon = painterResource(R.drawable.ic_store_white_24dp), label = "Store", hasBadge = true),
    SmoothBarItem(icon = painterResource(R.drawable.ic_person_outline_white_24dp), label = "Profile"),
)

var selectedIndex by remember { mutableStateOf(0) }

SmoothBottomBar(
    items = items,
    selectedIndex = selectedIndex,
    onItemSelected = { selectedIndex = it },
    modifier = Modifier.fillMaxWidth().height(76.dp),
    backgroundColor = Color(0xFF432FBF),
)
```

The indicator pill color defaults to Color(0x2DFFFFFF). A separate iconBackgroundColor parameter draws a circle behind inactive icons and defaults to Color.Transparent, making it invisible until explicitly set.

## The View implementation reads from a menu XML and supports two listener patterns

For the View form, navigation items come from a standard Android menu XML file in res/menu/. Each item needs an android:id, an android:title and an android:icon. The SmoothBottomBar view in the layout file references that menu through app:menu:

```xml
<me.ibrahimsn.smoothbottombar.SmoothBottomBar
    android:id="@+id/bottomBar"
    android:layout_width="match_parent"
    android:layout_height="70dp"
    app:backgroundColor="@color/colorPrimary"
    app:badgeColor="@color/colorBadge"
    app:menu="@menu/menu_bottom"/>
```

Two listener styles are available. A Kotlin lambda property:

```kotlin
bottomBar.onItemSelected = {
    status.text = "Item $it selected"
}
```

Alternatively, an interface listener where onItemSelect returns a Boolean, giving the caller a chance to intercept the tap:

```kotlin
bottomBar.setOnItemSelectedListener(object: OnItemSelectedListener {
    override fun onItemSelect(pos: Int): Boolean {
        status.text = "Item $pos selected"
        return true
    }
})
```

A matching reselect interface exists for the case where the user taps the active item again.

## Navigation Component integration requires menu item IDs to match Fragment destination IDs

SmoothBottomBar supports integration with the Android Jetpack Navigation Component, and the key constraint is that each item in the menu XML must carry the same android:id as its corresponding Fragment destination in the Navigation Graph. When those IDs align, the Navigation Component takes over the fragment transaction handling entirely, which the README describes as working best when using fragments rather than activities.

Setup follows two steps described in the README: first add the Navigation Component dependency and construct a Navigation Graph with the correct destination IDs, then ensure every menu item's android:id matches a destination. The Compose version uses navigation-compose, and the full wiring example is in ComposeMainActivity.kt. The View version integration section stops at the ID-matching requirement without showing a NavController binding example, which means the rest of the setup follows standard Navigation Component documentation rather than anything specific to this library.

## When native BottomNavigationView is the better choice

Material Components for Android's BottomNavigationView supports API levels below 32 and wires to NavController without requiring menu item IDs to match fragment destination IDs. For any project targeting devices on Android 11 or earlier, BottomNavigationView is the direct alternative, since SmoothBottomBar's documented floor of API 32 leaves no supported path to those versions.

The sliding pill indicator is the central visual reason to prefer SmoothBottomBar over the system component. Without that specific animation in a design specification, the third-party dependency is hard to justify when BottomNavigationView already handles selection state, icons, labels and badge counts. Teams using Material Design 3 in Compose have access to the NavigationBar composable, which includes an indicator highlight and badge support natively, removing the main advantage SmoothBottomBar brings to a Compose project.

## Conclusion

SmoothBottomBar suits Android projects targeting API 32 or above that want a bottom navigation bar with a sliding pill indicator and optional badge dots. Use the Compose composable when your app uses navigation-compose; use the View version when working with fragments and the Jetpack Navigation Component. Java projects face an extra setup step because the README's dependency note for kotlin-stdlib uses $kotlinVersion, a placeholder variable, without supplying the actual version number. Before integrating, open the sample in app/ and verify the indicator animation matches your design spec, and confirm your minimum SDK is 32 or higher.

## FAQ

### How do I install SmoothBottomBar?

SmoothBottomBar is distributed through Jitpack. Add the Jitpack repository to your build configuration and declare the dependency using the version shown on jitpack.io/#ibrahimsn98/SmoothBottomBar. Version 2.0.1 is the current release.

### Does SmoothBottomBar support Jetpack Compose?

Yes. The repository includes a fully Compose-native SmoothBottomBar composable that the author describes as functionally equivalent to the View version. The Compose version is a controlled component where the caller owns selectedIndex.

### What is the minimum Android API level for SmoothBottomBar?

The README badge specifies API 32+, which corresponds to Android 12L. Devices running Android 11 or earlier are not supported.

### Can I use SmoothBottomBar with the Jetpack Navigation Component?

Yes, but each item in your menu XML must have the same android:id as the corresponding Fragment destination in your Navigation Graph. The README describes this as working best with fragments.

### Does SmoothBottomBar support badge dots on navigation items?

Yes. Any SmoothBarItem can be given hasBadge set to true, which shows a dot. The dot's color is controlled by itemBadgeColor, which defaults to Color.Red, and its size by itemBadgeRadius, which defaults to 4.dp.

## Sources

- [ibrahimsn98/SmoothBottomBar on GitHub](https://github.com/ibrahimsn98/SmoothBottomBar)
- [Issues](https://github.com/ibrahimsn98/SmoothBottomBar/issues)
- [License: MIT](https://github.com/ibrahimsn98/SmoothBottomBar/blob/master/LICENSE)
- [README](https://github.com/ibrahimsn98/SmoothBottomBar/blob/master/README.md)
- [Releases](https://github.com/ibrahimsn98/SmoothBottomBar/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/ibrahimsn98-smoothbottombar
