Plus Icon in Floating Action Button not rendered correctly in Android pre-Lollipop

Question

I tried to setup a fab by using the support design library.

Code in XML:

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/fab"
    android:src="@drawable/ic_add_white_18dp"
    app:borderWidth="2dp"
    app:fabSize="normal"
    android:onClick="submit"
    app:rippleColor="@color/colorPrimaryDark">

</android.support.design.widget.FloatingActionButton>

On Nexus 6(lollipop), the plus icon is rendering correctly.

enter image description here

But on nexus 4(pre lollipop), plus icon size is crossing the circle.

enter image description here

I have downloaded and used the plus(ic_add_white_18dp) from Material icons

Icon Sizes used:

mdpi - 18dp
hdpi - 27dp
xdpi - 36dp
xxdpi - 54dp

enter image description here

What should be the correct size to use for plus icon.

For some odd reason I do not see the "plus" on the material icons anymore. Where did you find it? — tccpg288, Jul 02 '16 at 16:30
please search with text "add" and you can find icons under "Content" section — karsas, Jul 04 '16 at 04:41

score 13 · Accepted Answer · edited May 23 '17 at 12:18

13

Update

This has been fixed as of v22.2.1.

As it was stated on FloatingActionButton, square button below API level 17

Which referenced this bug: https://code.google.com/p/android/issues/detail?id=175067

Your FAB should have app:borderWidth="0dp"

edited May 23 '17 at 12:18

Community

1
1

answered Jun 28 '15 at 03:02

Logain

4,259
1
23
32

Plus Icon in Floating Action Button not rendered correctly in Android pre-Lollipop

1 Answers1

Update