Floating button not floating in bottom right with post refs

Question

30 hours into android and getting into the cooler stuff now. I tried following this post Floating Action Button Not In Bottom Right

My code is the following layout

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".base.ActivityContactList">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/contact_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/underline"
        android:scrollbars="vertical"
        />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="16px"
        android:src="@drawable/plus_icon3"
        app:fabSize="normal"
        app:layout_anchor="@id/contact_list"
        app:layout_anchorGravity="bottom|right|end" />

</androidx.constraintlayout.widget.ConstraintLayout>

I have two issues

• My icon is not the bottom right.
• My icon has some turquoise color surrounding the purple plus and the purple plus is tiny. I am not sure why.

Here is a picture:

I created the icon view "New -> Image Asset" and then choosing clipart with theme custom so I could set the color.

Answer 1

My icon is not the bottom right

Since you are using ConstraintLayout you need to set the required constraints. In your case

layout_constraintBottom_toBottomOf="parent"
layout_constraintEnd_toEndOf="parent"

So your Floating action button will become

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="16px"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    android:src="@drawable/ic_baseline_home_24"
    app:fabSize="normal" />

My icon has some turqoise color surrounding the purple plus and the purple plus is tiny. I am not sure why.

As described in the documentation, by default it takes the color set in styles.xml attribute colorAccent.

• The background color of this view defaults to the your theme's colorAccent. If you wish to change this at runtime then you can do so via setBackgroundTintList(ColorStateList).

So you can change the background by using the following two methods

1. in XML, app:backgroundTint

   <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:backgroundTint="@color/colorPrimary"
        android:layout_margin="16px"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:src="@drawable/ic_baseline_home_24"
        app:fabSize="normal" />
   

2. Programmatically, .setBackgroundTintList

    mFab.setBackgroundTintList(ColorStateList.valueOf(your color in int));