Bottom Align Floating Action Button

Question

I want to align to bottom right my FAB.

I tried with android:gravity="bottom|right"
When I try android:layout_alignParentBottom="true" FAB disappears
When I try android:layout_alignBottom="@id/lista_tiendas" FAB disappears

It doesn't seem complicated but I just can't accomplish it

Any Ideas?

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">

<ListView
    android:id="@+id/lista_tiendas"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:divider="@android:color/transparent"
    android:dividerHeight="4.0sp"/>

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add_white_48dp"
    app:backgroundTint="@color/spg_rosa"
    app:borderWidth="0dp"
    app:elevation="8dp"
    app:fabSize="normal"
    android:layout_alignParentRight="true"
    android:layout_alignParentBottom="@id/lista_tiendas"
     />
</RelativeLayout>

Anggrayudi H · Accepted Answer · 2021-04-15T12:42:39.143

171

For RelativeLayout:

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    ... />

For CoordinatorLayout, you should use android:layout_gravity="end|bottom"

For ConstraintLayout:

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    ... />

See this answer for more information.

edited Apr 15 '21 at 12:42

answered Jun 11 '15 at 06:16

Anggrayudi H

14,977
11
54
87

2

yes, I corrected code format so RelativeLayout appears! Tx – Juliatzin Jun 11 '15 at 14:41
This worked for me too, thanks! Why doesn't LinearLayout work for a FAB? – Michael Feb 07 '17 at 02:59
3

Recommended is: android:layout_alignParentEnd = "true" – Zon Sep 13 '17 at 05:14
@Anggrayudi H do you know how to do it with ConstraintLayout, then please tell. – M.Usman Jan 04 '18 at 08:29
@AnggrayudiH.Thank you so much i had issue with bottom sheet view when using coordinator layour but i found your solution for relaive layout.wsted three days to fix this siue – scott Aug 06 '18 at 17:41
i would like to use it for FAB on click i want to disable background fragment. but when i use clickable=true, fragment is not working ever though FAB is Closed. i just modified to a bit to use it in java class if fab is open clickable true or else false. its working grate thank you for the solution – Asesha George Apr 12 '20 at 09:35

score 12 · Answer 2 · answered Jul 03 '15 at 20:43

Layout should be RelativeLayout. Try the next code:

<RelativeLayout 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">

<LinearLayout
    android:id="@+id/ly_list_form"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">


    <ListView
        android:id="@+id/list_forms"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:dividerHeight="1dp" />

</LinearLayout>

<LinearLayout
    android:id="@+id/ly_bar_bottom"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:gravity="right"
    android:orientation="horizontal">

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/button_addc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="28dp"
        android:src="@drawable/ic_add"
        app:borderWidth="0dp"
        app:elevation="6dp"
        app:pressedTranslationZ="12dp" />
</LinearLayout>

Wrapping the floating button in a linear layout is what did the trick for me. Otherwise it would ignore margins. — Alaa M., Dec 19 '16 at 21:01

score 5 · Answer 3 · answered Jun 12 '15 at 16:52

It appears that FloatingActionButton isn't positioned correctly inside a RelativeLayout.

I changed RelativeLayout to FrameLayout, and problem solved! Hope it helps!

<ListView
    android:id="@+id/mylist"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:divider="@android:color/transparent"
    android:dividerHeight="1.0sp" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="right|bottom"
    android:src="@drawable/ic_add_white_48dp"
    app:backgroundTint="@color/spg_rosa"
    app:borderWidth="0dp"
    app:elevation="8dp"
    app:fabSize="normal" />

</FrameLayout>

score 5 · Answer 4 · answered Jan 19 '16 at 17:38

5

Try using android.support.design.widget.CoordinatorLayout and android:layout_gravity="bottom|right" works for me.

answered Jan 19 '16 at 17:38

naamadheya

1,902
5
21
28

Bobby · Answer 5 · 2015-06-11T02:57:41.387

2

I was able to get the code to work by doing this:

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:backgroundTint="#ff0000"
    app:borderWidth="0dp"
    app:elevation="8dp"
    app:fabSize="normal"
    android:layout_alignLeft="@+id/text"
    android:layout_above="@+id/text"/>

However, it didn't work with below the TextView instead of above, I believe it could be a bug.

edited Jun 11 '15 at 02:57

answered Jun 11 '15 at 02:46

Bobby

1,416
1
17
30

Ok, But I don't have a textview, I have a listview that take all the screen, so if I put it above, I will not have the desired position! – Juliatzin Jun 11 '15 at 14:42

score 1 · Answer 6 · answered Aug 27 '15 at 10:23

1

Try

android:layout_gravity="bottom|right"

answered Aug 27 '15 at 10:23

Sachini Samarasinghe

1,081
16
18

score 1 · Answer 7 · answered May 08 '21 at 09:50

1

To Align The Button At Bottom and center of the Relative Layout

Add these two in your floatingactionbutton container

    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"

and the output will be: like this

answered May 08 '21 at 09:50

Nabil Nazar

63
1
8

The question requires aligning to the right bottom. Center Horizontal doesn't let that happen. – Mohit Ajwani May 08 '21 at 10:46

Bottom Align Floating Action Button

7 Answers7

Linked