Setting src and background for FloatingActionButton

Question

When I use background and src in android.support.design.FloatingActionbutton it is not set correctly. Instead it is displayed as

<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/pink"
android:src="@drawable/ic_action_barcode_2"
android:layout_gravity="bottom|right"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp" />

but when I use ImageView it appears correctly as

<ImageView
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/pink"
android:src="@drawable/ic_action_barcode_2"
android:layout_gravity="bottom|right"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp" />

why is FloatingActionButton is not displayed correctly? What should I change in my code?

Solution

Floating action button's background does not need to be changed, you just apply a tint and then add your icon as usual

<android.support.design.widget.FloatingActionButton
    ...
    app:backgroundTint="@color/ic_action_barcode_2"
    android:src="@drawable/ic_add" />

This provides you with a round button still but in the colour you desire. In this case the app namespace is used for the support library features:

xmlns:app="http://schemas.android.com/apk/res-auto"

Comments

[Jannie Theunissen]

thanks for pointing out the app namespace. Saved my hair from falling out.