title: CollapsingToolbarLayout with tablayout & image as collapsing with sticky toolbar
body: <p>I want to achieve view similar to below images</p>
  
  <p><a href="https://i.stack.imgur.com/Fnk8g.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Fnk8g.png" alt="Initial view that I need in my app"></a></p>
  
  <p><a href="https://i.stack.imgur.com/WmTzR.png" rel="noreferrer"><img src="https://i.stack.imgur.com/WmTzR.png" alt="After user start scrolling view should look like below image"></a></p>
  
  <p>Below are the screens that I have achieved through design support library in android</p>
  
  <p><a href="https://i.stack.imgur.com/NdkMx.png" rel="noreferrer"><img src="https://i.stack.imgur.com/NdkMx.png" alt="View i created with mentioned xml"></a>
  <a href="https://i.stack.imgur.com/5l2Bu.png" rel="noreferrer"><img src="https://i.stack.imgur.com/5l2Bu.png" alt="When i scroll is hides the tablayout which is not good."></a></p>
  
  <p>Please see  my layout file below</p>
  
  <pre><code>&lt;FrameLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      &gt;
  
  
      &lt;android.support.design.widget.CoordinatorLayout
          android:id="@+id/rootLayout"
          android:layout_width="match_parent"
          android:layout_height="match_parent"&gt;
  
          &lt;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"&gt;
  
  
              &lt;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"&gt;
  
                  &lt;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" /&gt;
  
  
  
  
                  &lt;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" /&gt;
  
  
  
  
              &lt;/android.support.design.widget.CollapsingToolbarLayout&gt;
  
  
  
          &lt;/android.support.design.widget.AppBarLayout&gt;
  
  
  
          &lt;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" /&gt;
  
      &lt;/android.support.design.widget.CoordinatorLayout&gt;
  
  
      &lt;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" /&gt;
  &lt;/FrameLayout&gt;
  </code></pre>
  
  <p>please check the above xml and let me know what I am doing wrong??</p>