The floating action button is always displayed on top.

Question

I am trying to show a textview at the top of the Floating Action button. Inside FrameLayout, I have 1 FAB and 1 TextView:

<FrameLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|start" android:padding="@dimen/fab_margin"> <android.support.design.widget.FloatingActionButton android:id="@+id/fabAddSeller" android:layout_width="70dp" android:layout_height="70dp" app:backgroundTint="#3780f4" android:stateListAnimator="@null"/> <TextView android:id="@+id/tvSellRecordCount" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/sell_record_counter" android:layout_gravity="top|end" android:text="12" android:textColor="#FFFFFF" android:textSize="10sp" /> </FrameLayout> 

In accordance with this answer, I added

Android: stateListAnimator = "@ zero"

in FAB - there is no difference. I placed the TextView after the FAB - no effect.

How to show a different view on top of a FloatingActionButton?

Answer 1

In Android Studio, I can fix it after adding an elevation to the text view:

 android:elevation="6dp" 

FAB seems to have 5dp heights.

However, I'm not sure if this will fully work for you, since → 21 is available for the API.

Try to do some tests on real devices ...

Perhaps in real devices / emulators android:stateListAnimator="@null" enough android:stateListAnimator="@null" .

UPDATE

After adding app:elevation this fix also started working with old APIs

 app:elevation="6dp" android:elevation="6dp" 

Answer 2

Replace FrameLayout with RelativeLayout and add

  <android.support.design.widget.FloatingActionButton ... android:layout_below="@+id/tvSellRecordCount" ... />