How to set position floatingactionbutton abave bottom bar

userveW61 0
Viewed 28

I have activity with FloatingActionButton and BottomNavigationView. I want FloatingActionButton have position above BottomNavigationView. but no matter what I do, it is always with BottomNavigationView like on img

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity2">

    <fragment
        android:id="@+id/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        app:defaultNavHost="true"
        app:navGraph="@navigation/mobile_navigation" />


    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:layout_margin="16dp"
        
        android:src="@drawable/ic_baseline_addchart_24" />

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/yu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom">

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_bar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"

            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:menu="@menu/bottom_menu" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

enter image description here

floating-action-button bottomnavigationview android
2 Answers

Place FAB button inside the constraint layout and then set the property

 app:layout_constraintTop_toBottomOf="@id/fab"

to your Navigation View and

    app:layout_constraintBottom_toTopOf="@id/bottom_bar"
    android:layout_margin="16dp"

In this way the FAB button will always stay on top of navigation view.

Atul Yadav0

here you go just replace it with your floatbutton tag

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_marginBottom="70dp"
    android:layout_marginEnd="16dp"
    android:src="@drawable/ic_baseline_addchart_24" />

the bottom navigation is almost 56dp height so what we did is we added 70dp to marginBottom to lift it above the navigation and it will stay there always, you can change that value as your likings :)

Ubaid Ullah Shoukat0
Related