Floating Action Button with square shape

Jonathan I picture Jonathan I · Jul 3, 2015 · Viewed 14.8k times · Source

When I set a color to my fab, it looks like so:

enter image description here

My layout xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity$PlaceholderFragment">

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    android:layout_marginRight="20dp"
    app:fabSize="normal"
    android:elevation="@dimen/fab_elevation"
    android:background="#000000"
    android:stateListAnimator="@animator/fab_anim"
    android:layout_gravity="center_horizontal"
    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true" />

Also the color doesn't change. Can anyone help me in understanding what I am doing wrong?

I also tried with a @color link but it crashed, with the background of a drawable (ex. android:background="@drawable/fab_background") nothing happens.

Here is the drawable fab_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item>
    <ripple android:color="@color/fab_color_1_muted">
        <item>
            <shape>
                <solid android:color="@color/fab_color_1" />
            </shape>
        </item>
    </ripple>
</item>

Answer

appukrb picture appukrb · Jul 28, 2015

Use this code in your xml

app:borderWidth="0dp"

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    android:layout_marginRight="20dp"
    app:fabSize="normal"
    android:elevation="@dimen/fab_elevation"
    android:background="#000000"
    app:borderWidth="0dp"
    android:stateListAnimator="@animator/fab_anim"
    android:layout_gravity="center_horizontal"
    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true" />