Facilitates cross-platform app development with shared code for UI, leveraging Compose Multiplatform. Supports platform-specific customizations, including SwiftUI integration for iOS.
CMP Bottom Bar is a Compose Multiplatform library containing a shared bottom-bar model and several visual styles. It targets Android, iOS, desktop, and WebAssembly.
| Module | Purpose |
|---|---|
coreBottomBar | Shared item models, listeners, indicator configuration, and helpers |
basicBottomBar | Horizontal and vertical basic bottom bars |
tinyGlideBottomBar | Animated bar with expandable sub-items |
aztopiaBottomBar | Animated circular Aztopia style |
expandableBottomBar | Contextual control dock that expands from compact navigation into tool panels |
gooeyBottomBar | Gooey/blurred bottom-bar experiment |
figmaBottomBar | Compact grouped toolbar inspired by Figma |
galleryBottomBar | Scrollable artwork dock with an expanding selected item |
Style modules depend on coreBottomBar; the demo app brings the styles together.
The development API keeps immutable item configuration separate from composable state:
This API is a breaking change intended for the next 0.5.x release line.
Every style accepts the shared visibility state and animation configuration:
val visibilityState = rememberBottomBarVisibilityState()
BasicBottomBar(
items = items,
visibilityState = visibilityState,
visibilityConfig = BottomBarVisibilityConfig(
animation = BottomBarVisibilityAnimation.FADE_SLIDE,
),
)
visibilityState.hide()
visibilityState.show()
visibilityState.toggle()
Available animations are NONE, FADE, SLIDE, SCALE, FADE_SLIDE, and SCALE_SLIDE. Duration, slide distance, and scale are configurable in core.
The Basic style exposes state explicitly and supports horizontal or vertical placement:
val state = rememberBasicBarState(initialSelectedIndex = 0)
BasicBottomBar(
items = items,
state = state,
config = BasicBarConfig(position = BasicBarPosition.HorizontalBottom),
) { item, index ->
// `index` is null for an optional start or end action.
}
BasicBarState.select(null) clears selection. Item interaction modes are respected, including toggle and non-selecting actions. Empty item lists render safely.
The currently configured Maven Central artifacts are:
implementation("io.github.mejdi14:cmp-bottombar-core:0.4.3")
implementation("io.github.mejdi14:cmp-bottombar-basic:0.4.3")
implementation("io.github.mejdi14:cmp-bottombar-tinyGlide:0.4.3")
implementation("io.github.mejdi14:cmp-bottombar-aztopia:0.4.3")
expandableBottomBar and gooeyBottomBar are included as local experimental modules and are not currently configured for publication.
The figmaBottomBar style is independently implemented and inspired by the toolbar interface of Figma. Figma is a trademark of Figma, Inc. This project is not affiliated with or endorsed by Figma.
The expandable style keeps navigation and contextual controls in one animated surface. Consumers provide the item labels, icons, and panel content while the library handles selection, expansion, hover state, panel switching, visibility, and animated sizing.
val state = rememberExpandableBarState()
ExpandableBottomBar(
items = tools,
state = state,
label = Tool::label,
iconContent = { tool, visualState ->
ToolIcon(tool, visualState.contentColor)
},
panelContent = { tool, _ ->
ToolControls(tool)
},
)
The Gallery Spotlight demo uses the Lorelei avatar style by Lisa Wischofsky through DiceBear. Lorelei is licensed under CC0 1.0.
The Reveal style keeps the group centered while the hovered or selected item expands. Hover is transient for desktop and web, while tap selection keeps the same interaction available on touch devices.
val state = rememberRevealBarState()
RevealBottomBar(
items = destinations,
state = state,
label = Destination::label,
hasBadge = { _, index -> index == 0 },
) { destination, visualState ->
DestinationIcon(destination, visualState.contentColor)
}
The development toolchain currently uses:
Use JDK 17 or 21, then run:
./gradlew :composeApp:assembleDebug
./gradlew :composeApp:run
./gradlew :composeApp:wasmJsBrowserDevelopmentRun
On macOS, open iosApp/iosApp.xcodeproj to run the iOS demo.
Supported Apple targets are iOS ARM64 devices and Apple Silicon simulators. The obsolete Apple x86_64 target was removed because current Compose Multiplatform releases no longer publish it.
Compose Multiplatform 1.12 requires API 37 and the AGP 9 Android-KMP architecture. That upgrade is intentionally deferred until the Android application can be extracted from the shared multiplatform module.
Publishing is handled by .github/workflows/publish.yml. Maven Central credentials and the GPG private key must remain in GitHub Actions secrets; they must never be added to gradle.properties or committed files.
Licensed under the Apache License 2.0. See LICENSE.
revealBottomBar | Compact command dock that expands icons into labels |
composeApp | Multiplatform demo application |
iosApp | SwiftUI host for the iOS demo |
BottomBarItem contains only visuals shared by selectable items.BottomBarInteraction defines whether an item is enabled and whether selection should select, toggle, or remain unchanged.BottomBarClickListener<T> and BottomBarHoverListener<T> provide typed callbacks without unsafe casts or empty listener objects.BottomBarItemGroup<T> keeps reusable group boundaries separate from style-specific divider rendering.BottomBarVisibilityState controls every style through show(), hide(), and toggle().Surfaced from shared tags and platforms — no rankings paid for.