Is this a bug in Android support design Library?

Question

I just started to use the new Deisgn library from Google : 'com.android.support:design:22.2.0'

I use the FloatingActionButton and I have a small issue between Android below 5.0 and over 5.0. Watch the screenshot :

Android 4.4 :

Android 4.4

Android 5.0 :

As you can see, on Android 4.4, there is a margin around the FAB. I think this is for displaying the shadow. But IT'S OVERSIZED ! So is it a bug (or a forget of Google) or just the normal behavior ?

The xml of the view hosting he fabs :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="fr.freemo.freemo.activities.ListFreemoCityActivity">

<include
    android:id="@+id/toolbar"
    layout="@layout/view_toolbar" />


<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_below="@+id/toolbar">

</FrameLayout>


<ProgressBar
    android:id="@+id/progressBar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab_add"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="@dimen/margin_fab"
    android:layout_marginRight="@dimen/margin_fab"
    android:elevation="@dimen/fab_elevation_lollipop"
    android:src="@drawable/ic_action_new"
    app:backgroundTint="@color/color_app"
    app:fab_type="normal" />


<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab_display"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/fab_add"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="@dimen/margin_fab"
    android:layout_marginRight="@dimen/margin_fab"
    android:elevation="@dimen/fab_elevation_lollipop"
    android:src="@drawable/ic_map_white"
    android:tint="@color/color_app"
    app:backgroundTint="@color/white"
    app:fab_type="normal" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab_display_list"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/fab_display"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="@dimen/margin_fab"
    android:layout_marginRight="@dimen/margin_fab"
    android:elevation="@dimen/fab_elevation_lollipop"
    android:src="@drawable/ic_action_list"
    android:tint="@color/color_app"
    android:visibility="invisible"
    app:backgroundTint="@color/white"
    app:fab_type="normal" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab_display_grid"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/fab_display_list"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="@dimen/margin_fab"
    android:layout_marginRight="@dimen/margin_fab"
    android:elevation="@dimen/fab_elevation_lollipop"
    android:src="@drawable/ic_view_module_white"
    android:tint="@color/color_app"
    android:visibility="invisible"
    app:backgroundTint="@color/white"
    app:fab_type="normal" />
   </RelativeLayout>

Hope this helps http://stackoverflow.com/questions/30613921/how-to-remove-floatingactionbuttons-surrounding-shadow — Muthukrishnan Suresh, Jun 03 '15 at 08:48
@MuthukrishnanSuresh I don't want to remove the shadow. I just want to display the shadow correctly. In 5.0, the shadow will be displayed in the next update (forget from Google), in 4.X, it's displayed but with a large "margin" which is (I think) the drawable for the shadow. — Cocorico, Jun 03 '15 at 08:59

score 3 · Accepted Answer · answered Jun 03 '15 at 11:27

3

It was an issue (check a bug report created by me: https://code.google.com/p/android/issues/detail?id=175330) and should be fixed in the future release of the support-design library.

answered Jun 03 '15 at 11:27

makovkastar

5,000
2
30
50

score 0 · Answer 2 · edited May 23 '17 at 10:27

Its a bug for API 21. You can make arrow visible by removing some margin. Here is the way You can solve it and after testing on different devices it seems to work:

https://stackoverflow.com/a/31337162/3173384

Edited

Bug has already been fixed. Just update all support libraries to v 22.2.1

compile 'com.android.support:design:22.2.1'
compile 'com.android.support:appcompat-v7:22.2.1'
compile 'com.android.support:cardview-v7:22.2.1'
compile 'com.android.support:recyclerview-v7:22.2.1'

score 0 · Answer 3 · edited Jun 20 '20 at 09:12

This has been specified to not being an actual bug. Instead, this is the expected behavior.

Quoting a google dev answer:

This isn't a bug and is working as intended, in the sense that it's something that which is completely unavoidable. Within a CoordinatorLayout we have some control and can detect certain situations (edges) where it can offset the FAB. This is a hack though.

If you don't like it, set elevation to 0dp and be done with it.

As someone other stated here, we should define

xmlns:app="http://schemas.android.com/apk/res-auto"
app:borderWidth="0dp"
app:elevation="0dp"

or, even better, define your elevation in dimens.xml based on the API version you are working with. Most common case would be:

<!-- dimens.xml(v21) -->
<dimen name="custom_fab_elevation">@dimen/fab_elevation</dimen>

<!-- dimens.xml(lower) -->
<dimen name="custom_fab_elevation">0dp</dimen>

Is this a bug in Android support design Library?

3 Answers3