Develop Reference

Nested fragment improper layout inflation in TabLayout

So I have a main_activity with DrawerLayout. This activity has FrameLayout which is inflated with the layout of fragment_forecast. Fragment_forecast has TabLayoutwhich holds three other fragments. All of this child fragment layouts overlap tabs of TabLayout.
I tried to use LinearLayout instead of FrameLayout inside fragment_forecast but the result is that bottom part of child_fragments is cut off.
What is a proper way to handle this situation ?
Activity layout for main_activity:
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.daza.soundmap.Main2Activity">
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="enterAlways"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
/>
<FrameLayout
android:id="#+id/main_activity_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_view" />
</android.support.v4.widget.DrawerLayout>
Fragment layout for fragment_day_forecast (child of forecast_fragment) :
<FrameLayout 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"
tools:context="com.example.daza.soundmap.ForecastFragment">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabBackground="#color/primaryLightColor"
app:tabIndicatorColor="#color/secondaryColor"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/primaryTextColor"
app:tabTextColor="#color/primaryTextColor" />
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</FrameLayout>
Fragment layout for fragment_day_forecast:
<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:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.daza.soundmap.DayForecastFragment"
>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout_hour"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view_hour_forecast"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical" />
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.constraint.ConstraintLayout>

Try this bunch of code. Replace FragmentLayout with RelativeLayout and set viewpager below id tabs .
<RelativeLayout 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.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_below="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</RelativeLayout>

TabLayout is overlapping with ViewPager Fragment because Your parent of fragment_day_forecast is
FrameLayout
TabLayout
ViewPager
Where FrameLayout is meant to put one View over another.
You need to use RelativeLayout as a parent view. i.e., Set relation between views. In this case, It will be ViewPager below TabLayout.
Something like(fragment_day_forecast),
<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="com.example.daza.soundmap.ForecastFragment">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabBackground="#color/primaryLightColor"
app:tabIndicatorColor="#color/secondaryColor"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/primaryTextColor"
app:tabTextColor="#color/primaryTextColor" />
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/tabs" />
</RelativeLayout>

Nested Coordinator layout and Appbar Layout

Trying to build layout in which the activity has Coordinator layout and Appbar layout. The appbar layout has tab layout, which is connected to a view pager. In the view pager, the first fragment has another coordinator layout and an appbar layout. When the scroll happens in appbar layout, I want the Activity's appbar layout also to scroll.
Activity's xml
<?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"
android:id="#+id/coord"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_layout"
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_scrollFlags="scroll|snap|enterAlwaysCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/material_flat"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/ToolBarWithNavigationBack"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
app:layout_collapseMode="pin"></android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<LinearLayout
android:id="#+id/tab_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#android:color/white"
android:clipToPadding="true"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="10dp"
app:layout_scrollFlags="scroll|enterAlways|snap">
<android.support.design.widget.TabLayout
android:layout_width="fill_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:tabIndicatorColor="#BDBDBD"
app:tabIndicatorHeight="4dp"
app:tabSelectedTextColor="?android:attr/textColorPrimaryInverse"
app:tabTextAppearance="#android:style/TextAppearance.Widget.TabWidget" />
</LinearLayout>
</android.support.design.widget.AppBarLayout>
​
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
The fragment's xml
<?xml version="1.0" encoding="utf-8"?>
<NestedCoordinatorLayout
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"
android:background="#android:color/background_light">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
app:theme="#style/ThemeOverlay.AppCompat.Dark">
<LinearLayout
android:id="#+id/home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e3e6e8"
android:gravity="center"
android:orientation="vertical"
android:padding="20dp"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed|snap">
<android.support.v7.widget.CardView
card_view:cardCornerRadius="4dp"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_margin="24dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/shade_gradient" />
</android.support.v7.widget.CardView>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="15dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/simple.viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</NestedCoordinatorLayout>
When the appbar scrolls in the fragment, I want the activity's appbar to scroll also.
I have used the NestedCoordinatorLayout as suggested in CoordinatorLayout inside another CoordinatorLayout
Please let me know how to achieve that
Thanks!

Recycler view scrolls without collapsing toobar

Recycler view scrolls without collapsing toobar. This is my Main layout.
<CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/coordinator"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
>
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/collapp_bar"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<View
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="220dp"
app:layout_collapseMode="parallax"
android:background="#android:color/transparent"
/>
<include layout="#layout/custom_toolbar" />
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="parallax"
android:layout_gravity="bottom"
android:id="#+id/nestedScrollView"
android:layout_marginBottom="10dp"
>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:id="#+id/recyclerView"
android:layout_height="wrap_content"
android:orientation="horizontal" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f4f4f4"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="fill_parent"
android:layout_height="50dp"
app:tabMode="fixed"
app:tabGravity="fill"
app:tabTextColor="#color/gray"
app:tabSelectedTextColor="#color/selected_text_color"
app:tabIndicatorColor="#color/more_comment_color"
android:background="#android:color/background_light"
android:layout_gravity="bottom"
/>
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
app:layout_anchor="#id/tab_layout"
app:layout_anchorGravity="bottom|center"
android:layout_marginTop="-20dp"
/>
</CoordinatorLayout>
This is the layout which I am setting in View Pager
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white">
<android.support.v4.widget.SwipeRefreshLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/swipe"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.v7.widget.RecyclerView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/recyler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/bg_listview" /></android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>
My Recycler view scrolls,even without collapsing toolbar sometimes.Alsothe scrolling is not smooth.In recyClerView of view pager i have a header item and then the list of items.Sometimes it get stuck at Header at top and need to pull it down.

For every RecyclerView that is has a scrolling parent (such as ScrollView or NestedScrollView) you should disable nested scrolling like this:
yourRecyclerView.setNestedScrollingEnabled(false);
For your smoothing problem it seems that there is a bug with AppBarLayout and there are some libraries for fixing that. One that I know but I've never used is:
https://github.com/henrytao-me/smooth-app-bar-layout

Android Nested Scrollview not scrolling

I am having a Nested ScrollView which contains contents inside a Linear Layout.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:CoverFlowPager="http://schemas.android.com/apk/res-auto"
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.support.v4.widget.NestedScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:clipToPadding="false"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</FrameLayout>
I have this layout inside a ViewPager and ViewPager is inside a CordinatorLayout.
<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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
Now when I scroll the view the view is not scrolling. But since the layout is placed inside the Cordinator layout its moving up till the ToolBar is hid. But its not scrolling up.
Here is my main activity xml, The view pager is inside a tabbed 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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:attrs="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
<FrameLayout
android:id="#+id/titleContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center">
<com.CustomFontTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Toolbar Title"
android:textColor="#ffffff"
attrs:customFont="handyman_bold"
android:textSize="8pt"
android:layout_marginLeft="-20dp"
android:id="#+id/toolbar_title"/>
</FrameLayout>
<ImageButton
android:id="#+id/btn_ToolBarRightBtn"
android:layout_width="32dp"
android:layout_height="28dp"
android:tag="0"
android:background="#null"
android:scaleType="fitXY"
android:src="#drawable/icon_shopping"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:layout_marginRight="10dp"
/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_gravity="bottom"
android:background="#color/offwhite"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.CoordinatorLayout>
Here is my screenshots,
Initial View
When view is scrolled up, it scrolls only to hide the top navigation bar. Its not scrolling to display the items below the tab bar,

app:layout_behavior="..." should be set on a direct child of CoordinatorLayout. If your ViewPager is a direct child of CoordinatorLayout, place it to ViewPager declaration.

Quote from here: Troubleshooting Coordinator Layouts
When coordinating between a fragment with a list of items inside of a ViewPager and a parent activity, you want to put the app:layout_behavior property on the ViewPager as outlined here so the scrolls within the pager are bubbled up and can be managed by the CoordinatorLayout. Note that you should not put that app:layout_behavior property anywhere within the fragment or the list within.

You can try this! I had the same problem with my app. This worked for me.
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:attrs="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
<FrameLayout
android:id="#+id/titleContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center">
<com.CustomFontTextView
android:id="#+id/toolbar_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="-20dp"
android:gravity="center"
android:text="Toolbar Title"
android:textColor="#ffffff"
android:textSize="8pt"
attrs:customFont="handyman_bold" />
</FrameLayout>
<ImageButton
android:id="#+id/btn_ToolBarRightBtn"
android:layout_width="32dp"
android:layout_height="28dp"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:layout_marginRight="10dp"
android:background="#null"
android:scaleType="fitXY"
android:src="#drawable/icon_shopping"
android:tag="0" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/offwhite" />
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:clipToPadding="false"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"></LinearLayout>
</android.support.v4.widget.NestedScrollView>

try this
scroll.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
v.getParent().requestDisallowInterceptTouchEvent(true);
return false;
}
});

The ScrollingViewBehavior is just add top and bottom offset to your ViewPager. Generally the offset depends on AppBarLayout height and it do not depends on your TabLayout height because it is not in the AppBarLayout. So, for quick workaround you can just add paddingBottom to your ViewPager like this:
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="50dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_gravity="bottom"
android:background="#android:color/black"
android:layout_width="match_parent"
android:layout_height="50dp"/>

So here is the problem, you cannot have a NestedScrollView within the FrameLayout.
Also, some other smaller changes needed in xml to make it work.
Like the TabLayout has to be inside AppBar Layout and be pinned.
Here's your code -->
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_gravity="bottom"
android:background="#color/offwhite"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:layout_anchor="#+id/appbar"
app:layout_anchorGravity="bottom"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
And --> Change your Fragment code to remove the frame layout!
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:CoverFlowPager="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:clipToPadding="false"
android:fillViewport="true">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
Hope this helps!

Coordinator Layout with ViewPager and ListFragment not scrolling

I have implemented a view pager within a Coordinator layout that contains a ListFragment. The view pager is working fine but the list does not scroll,
can anyone help? Do I have to implement something to recognise the direction of the touch and then disable touch events?
Coordinator Layout:
<?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=".MainActivity">
<android.support.design.widget.AppBarLayout android:id="#+id/app_bar"
android:layout_height="wrap_content" android:layout_width="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize" android:layout_width="match_parent"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<com.passwordstore.utility.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary" />
<View
android:layout_width="match_parent"
android:layout_height="4dp"
android:background="#android:color/white"
android:foreground="#drawable/shadow"/>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1"
android:background="#android:color/white"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" android:id="#+id/frameLayout">
<include layout="#layout/activity_password_list" />
</FrameLayout>
<android.support.design.widget.FloatingActionButton android:id="#+id/fabNew"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin" android:src="#drawable/ic_add_white_24dp"
app:layout_anchor="#+id/frameLayout"
app:layout_anchorGravity="bottom|right|end"/>
</android.support.design.widget.CoordinatorLayout>
Fragment - activity_password_list:
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:id="#+id/item_list"
android:name="com.passwordstore.fragment.PasswordListFragment" android:layout_width="match_parent"
android:layout_height="match_parent" android:layout_marginLeft="16dp"
android:layout_marginRight="16dp" tools:context=".PasswordListActivity"
tools:layout="#android:layout/list_content" />

I had the same result with the same issue, i just had to used these custom layouts, you may want to take a look:
https://github.com/TheLittleNaruto/SupportDesignExample/tree/master/app/src/main/java/com/thelittlenaruto/supportdesignexample/customview