CurvedBottomNavigation
This a material design implementation of the bottomnavigation but with fab anchored on the view just like the BottomAppBar that was introduced recently by Google's Material Design Team.
Install / Use
/learn @NkoroiEric/CurvedBottomNavigationREADME
CurvedBottomNavigation
This a material design implementation of the bottomnavigation but with fab anchored on the view just like the BottomAppBar that was introduced recently by Google's Material Design Team.
Usage
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity">
<androidx.core.widget.NestedScrollView android:layout_width="match_parent"
android:id="@+id/nested"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:text="@string/cat_curvedbottombar_lorem_ipsum"
android:layout_height="wrap_content"/>
</androidx.core.widget.NestedScrollView>
<com.scaleup.admin.library.curvedbottomnavigation.CurvedBottomBar android:layout_width="match_parent"
android:id="@+id/bar"
app:curvedHideOnScroll="true"
app:curvedBackgroundTint="@android:color/white"
android:layout_gravity="bottom"
app:menu="@menu/navigation"
app:labelVisibilityMode="labeled"
app:curvedFabCradleMargin="8dp"
android:layout_height="wrap_content"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton android:layout_width="wrap_content"
app:layout_anchor="@id/bar"
android:id="@+id/fab"
android:layout_height="wrap_content"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
I recommend using app:curvedBackgroundTint="@android:color/white" because theming is buggy and also use Material design theme the lib requires it.
Related Skills
clearshot
Structured screenshot analysis for UI implementation and critique. Analyzes every UI screenshot with a 5×5 spatial grid, full element inventory, and design system extraction — facts and taste together, every time. Escalates to full implementation blueprint when building. Trigger on any digital interface image file (png, jpg, gif, webp — websites, apps, dashboards, mockups, wireframes) or commands like 'analyse this screenshot,' 'rebuild this,' 'match this design,' 'clone this.' Skip for non-UI images (photos, memes, charts) unless the user explicitly wants to build a UI from them. Does NOT trigger on HTML source code, CSS, SVGs, or any code pasted as text.
openpencil
2.0kThe world's first open-source AI-native vector design tool and the first to feature concurrent Agent Teams. Design-as-Code. Turn prompts into UI directly on the live canvas. A modern alternative to Pencil.
HappyColorBlend
HappyColorBlendVibe Project Guidelines Project Overview HappyColorBlendVibe is a Figma plugin for color palette generation with advanced tint/shade blending capabilities. It allows designers to
Flyaro-waffle-app
Waffle Delight - Full Stack MERN Application Rules & Documentation Project Overview A comprehensive waffle delivery application built with MERN stack featuring premium UI/UX, admin management, a
