How to set Floating Action Button image to fill the button?

Question

Usually icons are set for floating action buttons, but I need to set an image, so I can make a circular image.

I added it to the project (using Android Studio-> New -> Image Asset), but the image didn't fill the entire button:

My xml:

<com.github.clans.fab.FloatingActionMenu
    android:id="@+id/run_menu"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:paddingBottom="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:visibility="visible"
    fab:fab_colorNormal="#DA4336"
    fab:fab_colorPressed="#E75043"
    fab:fab_colorRipple="#99FFFFFF"
    fab:fab_shadowColor="#66000000"
    fab:fab_showShadow="true"
    fab:layout_constraintBottom_toBottomOf="parent"
    fab:layout_constraintHorizontal_bias="0.0"
    fab:layout_constraintLeft_toLeftOf="parent"
    fab:layout_constraintRight_toRightOf="parent"
    fab:layout_constraintTop_toTopOf="parent"
    fab:layout_constraintVertical_bias="0.0"
    fab:menu_backgroundColor="#ccffffff"
    fab:menu_fab_label="Choose an action"
    fab:menu_labels_colorNormal="#333333"
    fab:menu_labels_colorPressed="#444444"
    fab:menu_labels_colorRipple="#66FFFFFF"
    fab:menu_labels_ellipsize="end"
    fab:menu_labels_maxLines="-1"
    fab:menu_labels_position="left"
    fab:menu_labels_showShadow="true"
    fab:menu_labels_singleLine="true"
    fab:menu_openDirection="up"
    android:layout_height="0dp"
    android:layout_width="0dp">

    <com.github.clans.fab.FloatingActionButton
        android:id="@+id/shop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/store"
        fab:fab_label="Store" />

</com.github.clans.fab.FloatingActionMenu>

Any ideas on how to fix it? How should it be properly made?

Answer 1

The solution is app:maxImageSize = "56dp" property set to your FAB size.

1. Have an image or vector asset, preferably in perfect circle shape and perfectly fit to canvass (no empty margins).
2. Know the actual size of Floating Action Bar (FAB) - Default (56 x 56dp) or Mini (40 x 40dp).
3. XML Code thusly:

<com.google.android.material.floatingactionbutton.FloatingActionButton
   android:src="@drawable/perfect_fit_circle_image"
   app:maxImageSize="56dp"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content" />