Android FAB plus sign not present on android drawable

Question

Where can I find the plus sign at the center of a Floating Action Button?

Is it made by Android or do I need to do it by my self?

Wilder Pereira · Answer 1 · 2019-05-14T01:19:32.373

123

You can find the plus icon on the Vector Asset Studio.

In Android Studio, open an Android app project.
In the Project window, select the Android view.
Right-click the res folder and select New > Vector Asset.
Click the Android icon Button and look for the plus sign

More info here: https://developer.android.com/studio/write/vector-asset-studio.html#materialicon

edited May 14 '19 at 01:19

answered Apr 01 '16 at 17:22

Wilder Pereira

2,249
3
21
31

5

This is just amazing. One of those "how the hell did I not know about this before" moments. – Trevor Jul 04 '17 at 07:37
2

FYI the name of the plus icon is `add`. It took me a while to find it :) – Cullub Apr 12 '18 at 17:51
1

I struggled for five minutes with this dialog. Am I the only person for whom "material design" is actually frustratingly unintuitive? It turns out that you're supposed to click on the Android icon to be given the option to change it into something else. There is no "Choose" button in Android 3.4. I have the same problem with the Android material design calendar -- have to re-figure out what I'm supposed to do each time I use it. – Joe Lapp May 13 '19 at 23:05

Dmitri Timofti · Accepted Answer · 2017-08-03T10:50:07.933

54

You can get the Material Icons:

1.Online - from the Material Design Website. The plus icon is called 'add'. Select the icon, pick a colour & size and download the png or svg resource.

2.From Android Studio - using Vector Asset Studio. Check the link for more information. (as suggested by Wilder Pereira in the post below)

edited Aug 03 '17 at 10:50

answered Apr 01 '16 at 17:14

Dmitri Timofti

2,428
1
22
25

score 38 · Answer 3 · answered Jan 14 '18 at 02:13

38

based on @Dagnogo's answer, I found this is the simplest way.

    <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"
    app:srcCompat="@android:drawable/ic_input_add"
    android:tint="@android:color/white"/>

The key is using tint property

answered Jan 14 '18 at 02:13

Dika

2,213
4
33
49

I changed fab button's tint to white, the src is also with fill color in white, and it still displays black. – Benur21 Feb 01 '21 at 01:00
It seems to have to do with the style it uses by default. It connects the + color to the "black" defined in colors.xml. – Benur21 Feb 02 '21 at 01:46

score 9 · Answer 4 · answered Dec 24 '17 at 21:02

9

If you need to change the color change the tint method on the fab. For example I needed the "white plus" in my fab so I did that :

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:tint="@android:color/white" //put your colors here
    android:src="@drawable/ic_add_black_24dp"
    android:layout_height="wrap_content" />

answered Dec 24 '17 at 21:02

Dagnogo Jean-François

1,292
16
16

1

I found this answer genius! Please allow me to perfect it on my own my comment :D – Dika Jan 14 '18 at 02:09
YES! This allows you to use the built-in `app:srcCompat="@android:drawable/ic_input_add"`! For some reason the built-in add icon is _green_. This overrides that icky color and saves me from having to load in a bunch of icons. Thank you! – SMBiggs Mar 21 '18 at 17:44

score 7 · Answer 5 · answered Jun 09 '18 at 11:42

I think you are searching for this.

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="@dimen/fab_margin"
    app:srcCompat="@android:drawable/ic_input_add" />

score 0 · Answer 6 · answered May 23 '21 at 07:36

In 2021, if you want to change the colour of the button, then you need to use the app:tint property over android:tint.

Also, I recommend using app:srcCompat over android:src for better support of vectors.

For better accessibility support, it's important to use the android:contentDescription attribute.

Finally, you can use built-in drawables by using the @android:drawable/ prefix.

Putting it all together:

<com.google.android.material.floatingactionbutton.FloatingActionButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="32dp"
            android:contentDescription="Add a new item"
            app:tint="@android:color/white"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:srcCompat="@android:drawable/ic_input_add" />

Android FAB plus sign not present on android drawable

6 Answers6