CODEWITHSUNDEEP
androidfloating-action-buttonbottomnavigationview
Serg
Serg

Reputation: 77

How to set position floatingactionbutton abave bottom bar

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

Upvotes: 0

Views: 496

Answers (2)

Ubaid Ullah Shoukat
Ubaid Ullah Shoukat

Reputation: 1

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 :)

Upvotes: 0

Atul Yadav
Atul Yadav

Reputation: 174

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.

Upvotes: 1

Related Questions