Develop Reference

How to avoid overlapping views with insetEdge and dodgeInsetEdges

I have this layout:
<android.support.design.widget.CoordinatorLayout
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"
android:fitsSystemWindows="true">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/listitem_1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 1"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 2"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 3"
android:background="#ff0000"/>
<View
android:id="#+id/scroller_bottom_bar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/scroller_bottom_bar"
app:layout_anchorGravity="end"
app:srcCompat="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
that translates to the following UI animation:
As you can see, the floating action button overlaps with the blue bottom view. I want to avoid this. How do I do that?

This can be fixed by adding insetEdge and dodgeInsetEdges attributes. Basically, insetEdge lets the CoordinatorLayout know that its other children can dodge it if they want to. Setting the dodgeInsetEdges on other views let's them actually dodge the dodge-able view (marked by insetEdge).
Rewriting the original xml layout as:
<android.support.design.widget.CoordinatorLayout
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"
android:fitsSystemWindows="true">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/listitem_1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 1"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 2"
android:background="#ff0000"/>
<TextView
android:id="#+id/listitem_3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 3"
android:background="#ff0000"/>
<View
android:id="#+id/scroller_bottom_bar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/fab_anchor"
app:layout_anchorGravity="end"
app:layout_dodgeInsetEdges="bottom"
app:srcCompat="#android:drawable/ic_dialog_email" />
<View
android:id="#+id/fab_anchor"
android:layout_width="match_parent"
android:layout_height="1dp"
app:layout_anchor="#id/scroller_bottom_bar"
app:layout_insetEdge="bottom" />
</android.support.design.widget.CoordinatorLayout>
should result to the expected UI behavior:

How to bring the FAB to the top of the layout

I am trying to have 3 FAB's between two views. But the FAB's are below the top view as shown below.
How do I bring them to the front?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:clickable="true"
android:focusableInTouchMode="true"
android:id="#+id/parentPanel"
android:background="#ffffff">
<LinearLayout
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
card_view:cardCornerRadius="6dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:selectableItemBackground"
android:id="#+id/deviceCard">
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="io.tegaru.beepr.AddNewMapsLocationActivity" />
</android.support.v7.widget.CardView>
</LinearLayout>
<LinearLayout
android:id="#+id/bottomPanel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_weight="4"
android:background="#android:color/white">
<LinearLayout
android:id="#+id/btnPanel1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:background="#android:color/white">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:onClick="AddNewReminderBtnClicked"
app:backgroundTint="#292929"
app:fabSize="normal"
app:srcCompat="#drawable/ic_menu_send"
android:layout_gravity="top|center"
android:layout_marginTop="-20dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/btnPanel2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:background="#android:color/white">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:onClick="AddNewReminderBtnClicked"
app:backgroundTint="#292929"
app:fabSize="normal"
app:srcCompat="#drawable/ic_menu_send"
android:layout_gravity="top|center"
android:layout_marginTop="-20dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/btnPanel3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:background="#android:color/white">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:onClick="AddNewReminderBtnClicked"
app:backgroundTint="#292929"
app:fabSize="normal"
app:srcCompat="#drawable/ic_menu_send"
android:layout_gravity="top|center"
android:layout_marginTop="-20dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

LinearLayout does not allow children views to be overlapped.
You should use RelativeLayout (or FrameLayout, etc) instead of LinearLayout as the parent if you want to display FABs above (overlapping) other views.
In your case, set the root layout to RelativeLayout. You may need to make other adjustments though.

To space the fabs equally and use them as an overlay for a web view for example, look at my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<WebView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"></WebView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fab2"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fab3"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/fab1" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/fab2" />
</android.support.constraint.ConstraintLayout>

Floating Action Button scroll with the content

I implemented a floating action button in my layouts. The problem is when I have too much data in my layout, the button not stay in the same position, it scrolls to the bottom of the layout. I need the same like gmail inbox: a floating button that is always accesible no matter the data.
This is my code to show the button
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<include
android:id="#+id/frgOffline"
android:visibility="gone"
layout="#layout/frg_offline"/>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto" card_view:cardBackgroundColor="#android:color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_marginLeft="5dp"
android:layout_marginBottom="7dp"
android:layout_marginTop="7dp"
android:gravity="center_vertical|left">
<LinearLayout
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="25dp"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="text"
android:layout_marginBottom="15dp"
android:textStyle="bold"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="15dp"
android:layout_margin="5dp"
android:textAppearance="?android:attr/textAppearanceSmall"/>
<com.exampleapp.expandiblelist
android:id="#+id/expListaResultado"
android:groupIndicator="#null"
android:layout_height="fill_parent"
android:transcriptMode="disabled"
android:layout_width="match_parent"/>
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/btnNueva"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:elevation="4dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="5dp"
android:src="#drawable/ic_nuevo"
android:layout_gravity="bottom|right"
app:backgroundTint="#color/blue"/>
</android.support.v7.widget.CardView>
</LinearLayout>
What's going on?
Thanks for helping!

You can see this code this will work fine with you
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto" card_view:cardBackgroundColor="#android:color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_marginLeft="5dp"
android:layout_marginBottom="7dp"
android:layout_marginTop="7dp"
android:gravity="center_vertical|left">
<LinearLayout
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="25dp"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="text"
android:layout_marginBottom="15dp"
android:textStyle="bold"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="15dp"
android:layout_margin="5dp"
android:textAppearance="?android:attr/textAppearanceSmall"/>
<com.exampleapp.expandiblelist
android:id="#+id/expListaResultado"
android:groupIndicator="#null"
android:layout_height="fill_parent"
android:transcriptMode="disabled"
android:layout_width="match_parent"/>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/btnNueva"
android:layout_width="48dp"
android:layout_height="48dp"
android:elevation="4dp"
android:layout_marginBottom="16dp"
android:layout_marginLeft="5dp"
android:src="#mipmap/ic_launcher"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="16dp"
/>
</RelativeLayout>

you need coordinatorlayout for this
try this one, It might help
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
android:fitsSystemWindows="true"
tools:context="info.androidhive.fab.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main" />
<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="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
in content_main layout put all your necessary code..

CoordinatorLayout and weight

I need to create a Coordinatorlayout with a Linear Layout and a RecyclerView with the same space for both.
I've tried setting layout_weight 0.5 but the RecyclerView is taking all the space.
This is my code.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/lvToDoList"
android:layout_weight="0.5"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_input_add" />
</android.support.design.widget.CoordinatorLayout>
How can I achive that?
Regards, Diego.

layout_weight working only in LinearLayout. So, put LinearLayout as middle layer:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/lvToDoList"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
>
</android.support.v7.widget.RecyclerView>
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_input_add" />
</android.support.design.widget.CoordinatorLayout>

You need to include a LinearLayout inside the CoordinatorLayout. The inner LinearLayout provides the hook so that Android can do weighted views.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/lvToDoList"
android:layout_weight="0.5"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_input_add" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>

You can use weight like this
<android.support.constraint.ConstraintLayout 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_marginTop="#dimen/margin_10_dp"
android:layout_height="wrap_content">
<View
android:id="#+id/view1"
android:layout_width="0dp"
android:layout_height="5dp"
android:background="#212121"
android:text="Button 1"
app:layout_constraintEnd_toStartOf="#+id/view2"
app:layout_constraintHorizontal_weight="1"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="#+id/view2"
android:layout_width="0dp"
android:layout_height="5dp"
android:background="#3cff42"
android:text="Button 2"
app:layout_constraintEnd_toStartOf="#+id/view3"
app:layout_constraintHorizontal_weight="1"
app:layout_constraintStart_toEndOf="#+id/view1" />
<View
android:id="#+id/view3"
android:layout_width="0dp"
android:layout_height="5dp"
android:background="#f93d3d"
android:text="Button 3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_weight="1"
app:layout_constraintStart_toEndOf="#+id/view2" />

Making the new floating action button's position static

How would I go about making my FAB have a static position. i.e it doesn't go up or down on scroll with coordinator layout? I don't see an option in res-auto or regular android namespaces..
Here's the layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/root"
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">
<RelativeLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/search_polls_toolbar"
android:layout_width="match_parent"
android:layout_height="?android:actionBarSize"
android:background="#color/icitizen_toolbar_orange"
android:weightSum="1"
>
<!--<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginRight="2dp"
android:layout_marginTop="5dp"
android:background="#drawable/magnifying_glass"/>-->
<EditText
android:id="#+id/search_polls"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:hint="#string/search_polls"
android:gravity="center_horizontal"
android:layout_weight=".5"
android:drawableLeft="#drawable/magnifying_glass"
android:drawableStart="#drawable/magnifying_glass"
android:layout_marginTop="5dp"
android:layout_marginLeft="15dp"
android:drawablePadding="-50dp"
android:paddingLeft="5dp"
android:paddingTop="5dp"
android:paddingBottom="10dp"
android:cursorVisible="false"
android:textSize="20sp"
android:background="#color/icitizen_light_orange"
/>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/poll_horizontal_recycler_view"
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_below="#id/search_polls_toolbar"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:scrollbars="none"
>
</android.support.v7.widget.RecyclerView>
<android.support.v7.widget.RecyclerView
android:id="#+id/poll_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:layout_below="#id/poll_horizontal_recycler_view"
android:scrollbars="vertical" />
</RelativeLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/polls_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/white_plus_icon"
android:layout_marginBottom="70dp"
app:backgroundTint="#color/icitizen_orange"
app:layout_anchor="#id/container"
app:layout_anchorGravity="bottom|right|end"
app:borderWidth="0dp"
android:layout_marginRight="15dp"
android:layout_marginEnd="15dp"/>
</android.support.design.widget.CoordinatorLayout>

Tried to put fab button in side Frame layout.
this this,
<FrameLayout
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:src="#drawable/ic_plus"
app:fabSize="normal" />
</FrameLayout>