Bottom AppBar with custom shaped FloatingActionButton in Android Java

Question

This is My Floating Action Button How to set fabmargin using custom fab. I was creating an android app based on an UI design But this bottom appbar with custom fab is difficult.

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:backgroundTint="@color/white"
        app:borderWidth="0dp"
        app:layout_anchor="@id/bottom_app_bar" />

    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottom_app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:fabAlignmentMode="end"
        app:fabCradleMargin="1dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_menu" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Themes.xml

@style/FabShapeStyle1

<style name="FabShapeStyle1" parent="ShapeAppearance.MaterialComponents.SmallComponent">
    <item name="cornerSize">20%</item>
</style>

enter code here
enter code here

Answer 1

if you are using latest material design dependency which supports material 3 then apply this property in fab button

currently this is latest dependency of material

implementation 'com.google.android.material:material:1.7.0'

       app:shapeAppearanceOverlay="@style/Widget.Material3.FloatingActionButton.Primary"

now your Fab button code look like this

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:backgroundTint="@color/white"
    app:shapeAppearanceOverlay="@style/Widget.Material3.FloatingActionButton.Primary"
    app:borderWidth="0dp"
    app:layout_anchor="@id/bottom_app_bar" />