11

enter image description here

Hi I want to set image into FloatingActionButton i did this :

<android.support.design.widget.FloatingActionButton
            android:id="@+id/qick_menu"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="20dp"
            android:src="@drawable/quick_menu"
            app:elevation="7dp"
            app:layout_anchor="@id/mapview"
            app:layout_anchorGravity="bottom|right|end" />

But I have a small image in my button

3
  • please show what you want Mar 13, 2017 at 9:48
  • @KiranBennyJoseph I want to remove this border and put image for full size Mar 13, 2017 at 9:52
  • Change your image, it has borders. Mar 13, 2017 at 9:53

5 Answers 5

42

try this: in Layout:

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:scaleType="fitXY"
        android:src="@drawable/map"
        app:backgroundTint="@android:color/transparent"
        app:borderWidth="0dp"
        app:useCompatPadding="true" />


</RelativeLayout>

Now in res/values/dimens.xml:

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="fab_margin">16dp</dimen>
    <dimen name="design_fab_image_size" tools:override="true">56dp</dimen>
</resources>

This line is important <dimen name="design_fab_image_size" tools:override="true">56dp</dimen>

output:

enter image description here

4
  • Many Thanx , after 1 hour searching and applying to code found, what i exactly want. Jun 27, 2018 at 12:55
  • Do you know the original value of design_fab_image_size?
    – AdamMc331
    Dec 10, 2018 at 21:10
  • this is then applied to every fab button in the project, correct? =( Jun 11, 2019 at 12:52
  • How to apply it only to some of the FAB buttons in the app? May 15, 2021 at 16:14
5

you can use fabSize attribute

app:fabSize="normal" 
0
3

Try this: android:scaleType="center" and try image size 56dp. It worked for me.

1

The image/icon inside FAB can be resized in XML.

app:maxImageSize = "32dp" This will be your image size inside Floating Action Button.

app:fabCustomSize = "64dp" This will be your Floating Action Button size.

0

You can change the image if you want to change the size of the inner image, just choose the image of your choice and add it to floating button.

4
  • So how I can do this ? Mar 13, 2017 at 10:18
  • You can use ImageAsset provided by android studio or download from internet , and then use src property in floating button tag in xml @KrzysztofPokrywka
    – UserDev
    Mar 14, 2017 at 6:06
  • <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|end" android:layout_margin="@dimen/fab_margin" android:src="@drawable/ic_action_work" />
    – UserDev
    Mar 14, 2017 at 7:42
  • I made the image from ImageAsset in android studio and then simple used in src, take a look at above comment @KrzysztofPokrywka
    – UserDev
    Mar 14, 2017 at 7:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.