Android: Floating Button Icon is not centred

I'm trying to create a floating button in my app. The button is there, but the image in the button is a bit upwards (see image).

I can't figure out what's wrong with it. Below is part of the XML for floating button.

<android.support.design.widget.FloatingActionButton
        android:id="@+id/buttonUp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="16dp"
        android:layout_marginTop="480dp"
        android:clickable="true"
        android:scaleType="center"
        android:src="@drawable/btn_back_to_top_3x"
        app:layout_anchor="@id/layout"
        app:layout_anchorGravity="bottom|right|end"
        app:backgroundTint="@android:color/background_light"
        app:fabSize="normal" />

The button is showing where I wanted it. The only problem seems to be the image inside isn't center. Why is this happening?

EDIT: After some more looking around I realized the image itself was having problem where the image isn't actually centered and there are space at the bottom side (which cause the image to being push upward).

Reason is your image is not in the right size!!

Floating action button default circle size is 56 x 56dp , to get the best fit use that for your background image!!

If you are going for a mini one should be : 40 x 40dp

If you only want to change the Interior icon(only icon) use a 24 x 24dp icon for default size

To test this again i download an image form internet and scaled it down to 56dp and kept a small space to balance it (i am no good with Photoshop)

and added this to your FB view and made background yellow to make it clear.Let's see

out put:

This means it depends on the image that you add and its size if you want to go full background you can even use an imageButton

Refer : https://material.io/guidelines/components/buttons-floating-action-button.html#buttons-floating-action-button-floating-action-button