How can i implement Collapsing layout with tabs without a list view?

i am working on a android project where i have to implement collapsing toolbar with tabs . Tabs should contain a normal Relative layout which has 4 textview.

I am successfully able to implement the collapsing toolbar but the problem is when ever i try to scroll upwards holding the tabs i have implemented collapse toolbar is not working. On the same tabs if i use a list view or Grid layout its working fine when i scroll. If i try to use Normal layout's such as Linear or Relative layout i am not able to scroll. is there any way i can fix this without list or grid layout?

below is my code for xml:

<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:fitsSystemWindows="true">

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        style="@style/MyStyle"
        android:layout_width="match_parent"
        app:tabIndicatorColor="#F21757"
        app:tabSelectedTextColor="#F21757"
        android:layout_height="?actionBarSize"
        app:tabTextColor="@android:color/white"
        app:layout_anchor="@+id/MyAppbar"
        app:layout_anchorGravity="bottom"
        android:layout_gravity="bottom"
        app:tabGravity="fill"
        app:tabMode="scrollable"
        android:background="#171C20" />


    <android.support.design.widget.AppBarLayout
    android:id="@+id/MyAppbar"
    android:layout_width="match_parent"
    android:layout_height="256dp"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    >

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapse_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        app:contentScrim="#000000"

        android:fitsSystemWindows="true">

        <ImageView
            android:id="@+id/bgheader"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:src="@drawable/load"
            android:fitsSystemWindows="true"
            app:layout_collapseMode="parallax"
             />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?actionBarSize"
            app:layout_collapseMode="pin"

            />


    </android.support.design.widget.CollapsingToolbarLayout>

</android.support.design.widget.AppBarLayout>
    
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:paddingBottom="20dp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="?attr/actionBarSize"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    </android.support.design.widget.CoordinatorLayout>

Solution

Try this

Step 1. main_activity.xml

<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/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.ncrypted.demoapplications.MainActivity">

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar_layout"
    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/collapsingToolBar_hotel_details"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleMarginEnd="64dp"
        app:expandedTitleMarginStart="48dp"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:id="@+id/img_hotel_details"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:contentDescription="@string/strong_image_of_andorid"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            android:src="@mipmap/ic_launcher"
            app:layout_collapseMode="parallax" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolBar_hotel_detail"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_scrollFlags="scroll|enterAlways">

        </android.support.v7.widget.Toolbar>


    </android.support.design.widget.CollapsingToolbarLayout>

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_collapseMode="pin"
        app:tabGravity="fill"
        app:tabMode="fixed" />
</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.v4.view.ViewPager>

Step:2 Create fragments activity

- FragmentActivity1

fragment1.xml

 <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.ncrypted.demoapplications.FragmentActivity1">

 <!-- TODO: Update blank fragment layout -->
 <TextView
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:text="@string/hello_blank_fragment1" />

FragmentActivity.java

public class FragmentActivity1 extends Fragment {    
public FragmentActivity1() 
{
    // Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState)
{
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.fragment_fragment_activity1, container, false);
}
}

Step:3 take two other Fragment 2,3 and write code as above

Step:4 MainActivity.java

public class MainActivity extends AppCompatActivity {
private ViewPager pager;
private TabLayout tabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolBar_hotel_detail);
    setSupportActionBar(toolbar);
    ViewCompat.setTransitionName(findViewById(R.id.app_bar_layout), "Extra Image");
    CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout)
            findViewById(R.id.collapsingToolBar_hotel_details);        collapsingToolbarLayout.setContentScrimColor(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary));
    collapsingToolbarLayout.setTitle("Collaps");
    pager = (ViewPager) findViewById(R.id.viewPager);
    ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
    adapter.addFragment(new FragmentActivity1());
    adapter.addFragment(new FragmentActivity2());
    adapter.addFragment(new FragmentActivity3());
    pager.setAdapter(adapter);
    tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(pager);
    tabLayout.getTabAt(0).setText("Tab1");
    tabLayout.getTabAt(1).setText("Tab2");
    tabLayout.getTabAt(2).setText("Tab3");
}
class ViewPagerAdapter extends FragmentPagerAdapter {
    private final List<Fragment> mFragmentList = new ArrayList<>();
    public ViewPagerAdapter(FragmentManager manager) {
        super(manager);
    }
    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }
    @Override
    public int getCount() {
        return mFragmentList.size();
    }
    public void addFragment(Fragment fragment) {
        mFragmentList.add(fragment);
    }
    }
}