Develop Reference

Nestedscrollview not working well

in my app i have to put recyclerview below some information and some photos and i'm testing the activity but it doesn't work very well and i don't know why !
any one can help me with that, i just need to scroll all things together like one thing . i tried many solutions but no thing solute my issue
here is a video for my issue
xml:
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/coordinate_layout">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/collapsing_toolbar"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:contentScrim="#color/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="#+id/toolbar_layout"
android:layout_gravity="top"
app:layout_collapseMode="parallax"
app:popupTheme="#style/AppTheme.PopupOverlay">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:dividerPadding="8dp"
android:orientation="horizontal"
android:showDividers="end">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:padding="8dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:text="Upload Item"
android:textColor="#color/white"
android:gravity="center_vertical" />
<TextView
android:id="#+id/toolbar_save"
style="#style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/selectableItemBackground"
android:drawablePadding="8dp"
android:drawableRight="#drawable/done"
android:gravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textAllCaps="true"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:id="#+id/swipe_to_refresh"
android:layout_height="match_parent"
android:layout_below="#+id/coordinate_layout"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relative1">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/shoes"
android:id="#+id/profile_imagee" />
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/shoes"
android:id="#+id/profile_imagee1"
android:layout_below="#+id/profile_imagee" />
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/shoes"
android:id="#+id/profile_imagee2"
android:layout_below="#+id/profile_imagee1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="change profile"
android:layout_below="#+id/profile_imagee2"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/relative1">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>

In recyclerview add an attribute
nestedScrollingEnabled to false in xml it will solve your problem

recyclerview not scrolling correctly

My recyclerView is not scrolling correctly, i'm trying to make page like instagram profile so i put collapsing toolbar , swiperefreshLayout , nestedScrollView and recylerview. in this activity i'm making a recyclerview below some information about the person, i hope somebody understand me .
Here is a a screenshot of my problem
I want make all the layout like one piece is some body know the way !
Here is the xml
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/coordinate_layout">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/collapsing_toolbar"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:contentScrim="#color/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
>
<!--<ImageView
android:id="#+id/collapsing_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
android:fitsSystemWindows="true"/>-->
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="#+id/toolbar_layout"
android:layout_gravity="top"
app:layout_collapseMode="parallax"
app:popupTheme="#style/AppTheme.PopupOverlay"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:dividerPadding="8dp"
android:orientation="horizontal"
android:showDividers="end">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:padding="8dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:text="Upload Item"
android:textColor="#color/white"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/toolbar_save"
style="#style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/selectableItemBackground"
android:drawablePadding="8dp"
android:drawableRight="#drawable/done"
android:gravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textAllCaps="true"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:id="#+id/swipe_to_refresh"
android:layout_height="match_parent"
android:layout_below="#+id/coordinate_layout"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relative1">
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/shoes"
android:id="#+id/profile_imagee"
/>
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/shoes"
android:id="#+id/profile_imagee1"
android:layout_below="#+id/profile_imagee"
/>
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/shoes"
android:id="#+id/profile_imagee2"
android:layout_below="#+id/profile_imagee1"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="change profile"
android:layout_below="#+id/profile_imagee2"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/relative1"
>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</android.support.v7.widget.RecyclerView>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>
<!--<ImageView
android:id="#+id/profileImage"
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:src="#drawable/background"/>-->

Try set ViewCompat.setNestedScrollingEnabled(recycler_view, false)

collapsing toolbar not working properly

Can anyone let me know what is wrong with this layout. The collapsing toolbar is not collapsing properly. Moreover i cannot able to change the background of the tablayout when it is pinned on the top. Would be thankful if anyone come up with the solution.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/tool_bar_layout" />
<RelativeLayout
android:id="#+id/home_main_rl"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="260dp"
android:background="#color/colorAccent"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/main_bg"
android:fitsSystemWindows="true"
app:expandedTitleTextAppearance="#style/ExpandedAppbarTextAppearence"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/banner_ad_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp" />
<TextView
android:id="#+id/banner_ad_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/indicator"
android:layout_marginBottom="20dp"
android:gravity="center_horizontal"
android:maxLines="2" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp"
android:padding="10dp"
app:fillColor="#color/standard_brown" />
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:ignore="MissingPrefix,Overdraw,MergeRootFrame">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:tabGravity="fill"
app:tabIndicatorColor="#color/standard_brown"
app:tabIndicatorHeight="4dp"
app:tabTextAppearance="#style/MyCustomTextAppearance"
app:tabTextColor="#color/color_black" />
<android.support.v4.view.ViewPager
android:id="#+id/dine_category_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/tabs" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
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="60dp"
android:layout_marginRight="30dp"
android:clickable="true"
android:visibility="visible"
app:backgroundTint="#color/standard_brown"
app:fabSize="normal" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?actionBarSize"
android:visibility="gone" />
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_header_layout"
app:menu="#menu/navigation_items_layout" />

Lower the api level and rebuilt your project..hope its work

CollapsingToolBarLayout with TabLayout and ViewPager

Am try to create a layout similar to the one in the image using a CordinatorLayout and CollapsingToolbarLayout, TabLayout and ViewPager.
My Layout doesn't render properly.
Here is my 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/image"
android:src="#drawable/thumb_placeholder"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<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_collapseMode="pin" />
<android.support.design.widget.TabLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/movie_tabs"
app:tabGravity="fill"
app:tabMode="fixed"
android:background="#color/colorPrimary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabTextColor="#color/textColorPrimary"
app:tabSelectedTextColor="#color/textColorPrimary"
app:tabIndicatorColor="#color/textColorPrimary"
app:tabIndicatorHeight="4dp"
app:paddingStart="20dp"
app:paddingEnd="20dp">
</android.support.design.widget.TabLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/movieviewpager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>
Testing it on my device i get this
The ViewPager Fragment overlays the TabLayout if it has content and displays the TabLayout on top of the ImageView when there is no content.
What am i doing wrong, i am still somewhat of an Android noob.

CollapsingToolbarLayout needs a minHeight. This tells the parent AppBarLayout how much it can collapse. I assume you want the Toolbar and the TabLayout to stay at the top of the screen (because you are using the exitUntilCollapsed scroll flag). I would make both of those have android:layout_height="?attr/actionBarSize" and use double that value as the minHeight of the CollapsingToolbarLayout.
ViewPager needs app:layout_behavior="#string/appbar_scrolling_view_behavior".

Old answer but maybe someone found it useful
<android.support.design.widget.CoordinatorLayout
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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:titleEnabled="false"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<VideoView
android:id="#+id/video_view"
android:layout_width="match_parent"
android:layout_height="200dp" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="48dp"
app:layout_collapseMode="pin" />
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_gravity="bottom"
app:tabMode="scrollable" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

<?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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="250dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!-- Your extra details excluding tablayout. if u want any..-->
<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="200dp"
android:orientation="vertical"
tools:context="com.sweedesi.android.customerapp.Fragments.SweetMartListFragment">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/home_dummy_4"
android:scaleType="centerCrop" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/black_shadow"
android:scaleType="centerCrop" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.sweedesi.android.customerapp.Fragments.SweetMartListFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_10"
android:layout_marginTop="#dimen/margin_10"
android:layout_marginRight="#dimen/margin_10"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginTop="#dimen/margin_10"
android:layout_marginRight="#dimen/margin_10"
android:layout_toLeftOf="#+id/txt_reviews"
android:text="Bhagat Mishthan Bhandar"
android:textColor="#color/orangeColor"
android:textSize="#dimen/font_slarge"
android:textStyle="bold" />
<TextView
android:id="#+id/txt_reviews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginTop="#dimen/margin_5"
android:text="580 reviews"
android:textColor="#color/colorWhite"
android:textSize="#dimen/fontsize_normal" />
</RelativeLayout>
<View
android:layout_width="100dp"
android:layout_height="1dp"
android:layout_marginTop="#dimen/margin_5"
android:layout_marginBottom="#dimen/margin_5"
android:background="#color/orangeColor" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/min_order"
android:textColor="#color/colorWhite"
android:textSize="#dimen/fontsize_normal" />
<TextView
android:id="#+id/txt_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_5"
android:text="1000"
android:textColor="#color/colorWhite"
android:textSize="#dimen/fontsize_normal" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_5"
android:orientation="horizontal">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginTop="#dimen/margin_5"
android:background="#drawable/location_white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="#dimen/margin_5"
android:text="Bhati enclave, Main queens road, Opp Jharkhand mahadev mandir, Vaishali nagar, Jaipur - 302021"
android:textColor="#color/colorWhite"
android:textSize="#dimen/fontsize_normal" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#color/colorWhite"
app:tabGravity="fill"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/orangeColor"
app:tabTextAppearance="#style/MyCustomTabText"
app:tabTextColor="#color/colorText" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#color/transperentColor"
app:layout_collapseMode="parallax"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Best is to use
<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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.example.ehryourway.ehryourway.PatientChart"
tools:showIn="#layout/app_bar_patient_chart">
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:tabTextColor="#color/colorPrimary"
android:elevation="4dp"
android:minHeight="?attr/actionBarSize">
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_below="#id/tablayout">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
</android.support.v4.view.ViewPager>
</RelativeLayout>

CollapsingToolbarLayout with tablayout & image as collapsing with sticky toolbar

I want to achieve view similar to below images
Below are the screens that I have achieved through design support library in android
Please see my layout file below
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="64dp"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/imageburger"
app:layout_collapseMode="parallax" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="50dip"
android:layout_below="#+id/toolbar"
android:layout_gravity="bottom"
android:gravity="bottom"
app:layout_collapseMode="pin"
app:tabGravity="center"
app:tabMode="scrollable" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
</FrameLayout>
please check the above xml and let me know what I am doing wrong??

Please check Paul Burke gists, it may be solve your problem,
https://gist.github.com/iPaulPro/1468510f046cb10c51ea

I managed to get it working by this example https://github.com/vitovalov/TabbedCoordinatorLayout.
My code looks like this now:
<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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/AppTheme.Trans">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="150dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginBottom="60dp"
app:expandedTitleMarginEnd="64dp">
<FFImageLoading.Views.ImageViewAsync
android:id="#+id/backdrop"
android:layout_width="match_parent"
android:layout_height="240dp"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:gravity="top"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin"
app:titleMarginTop="15dp" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/gradient"
app:tabIndicatorHeight="3dp"
android:layout_gravity="bottom" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

you can try soucecode ex
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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:orientation="vertical">
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<LinearLayout
android:id="#+id/vUserProfileRoot"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:clipChildren="false"
android:clipToPadding="false"
android:orientation="vertical"
android:paddingBottom="24dp"
android:paddingLeft="24dp"
android:paddingRight="24dp"
android:paddingTop="60dp"
app:layout_collapseMode="parallax">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipChildren="false">
<ImageView
android:id="#+id/ivUserProfilePhoto"
android:layout_width="70dp"
android:layout_height="70dp"
android:background="#drawable/vdo"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:layout_marginRight="16dp"
/>
<LinearLayout
android:id="#+id/vUserDetails"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:id="#+id/vUserStats"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="16dp"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1167"
android:textColor="#color/black"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="videos"
android:textColor="#color/black"
android:textSize="12sp" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="396"
android:textColor="#color/black"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="followers"
android:textColor="#color/black"
android:textSize="12sp" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="485"
android:textColor="#color/black"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Student"
android:textColor="#color/black"
android:textSize="12sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="218dp"
android:layout_gravity="center"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<ImageButton
android:id="#+id/btnFollow"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_marginTop="8dp"
android:scaleType="center"
android:background="#drawable/image_btn_follow_src"
/>
<ImageButton
android:id="#+id/btn_report"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:layout_gravity="center"
android:layout_marginLeft="20dp"
android:background="#drawable/report_btn"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<TextView
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="I stuck in problem I have one project which uses JNI libs but when I use in another project it throws error unable to find jni"
android:textColor="#color/black"
android:textSize="15dp" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rvUserProfile"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<include
android:id="#+id/new_conn"
layout="#layout/custom_profile_view"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.CollapsingToolbarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="48dp">
<it.neokree.materialtabs.MaterialTabHost
android:id="#+id/tabHost"
android:layout_width="match_parent"
android:layout_height="48dp"
app:tabGravity="fill"
app:tabIndicatorColor="#color/black"
app:primaryColor="#color/white"
app:textColor="#color/black"
app:accentColor="#color/gray"
app:tabIndicatorHeight="4dp"
app:tabMode="fixed" />
<!--<it.neokree.materialtabs.MaterialTabHost-->
<!--android:id="#+id/tabHost"-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="48dp"-->
<!--android:layout_gravity="bottom"-->
<!--android:layout_marginTop="15dp"-->
<!--app:layout_scrollFlags="enterAlways"-->
<!--app:tabBackground="#color/white"-->
<!--app:tabGravity="center"-->
<!--app:tabMode="scrollable"-->
<!--app:tabSelectedTextColor="#color/white"-->
<!--app:tabTextColor="#color/gray" />-->
</FrameLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
you have to download ex : https://github.com/kanytu/android-parallax-recyclerview
https://github.com/Frank-Zhu/PullZoomView