title: Whatsapp like Collapsing Toolbar
body: <p>In my app, I would like to implement Whatsapp home page like collapsible toolbar. That is, while scrolling down the list, the toolbar should go up and the tabs should pin at the top. How can I achieve this?</p>
  <p>Here is my appbar layout</p>
  <pre class="lang-xml prettyprint-override"><code>&lt;android.support.design.widget.AppBarLayout
      android:layout_width=&quot;match_parent&quot;
      android:layout_height=&quot;wrap_content&quot;
      android:id=&quot;@+id/appbarLayout&quot;
      android:theme=&quot;@style/AppTheme.AppBarOverlay&quot;&gt;
  
      &lt;android.support.design.widget.CollapsingToolbarLayout
          android:layout_width=&quot;match_parent&quot;
          android:layout_height=&quot;wrap_content&quot;
          android:id=&quot;@+id/collapsibleToolBarLayout&quot;
          android:fitsSystemWindows=&quot;true&quot;
          app:titleEnabled=&quot;false&quot;
          app:layout_scrollFlags=&quot;scroll|exitUntilCollapsed&quot;&gt;                 
  
          &lt;android.support.design.widget.TabLayout
              android:id=&quot;@+id/tabs&quot;
              android:layout_width=&quot;match_parent&quot;
              android:layout_height=&quot;50dp&quot;
              android:background=&quot;@color/white&quot;
              app:tabTextColor=&quot;@color/product_page_btn_grey&quot;
              app:tabSelectedTextColor=&quot;@color/upcomer_background_red&quot;
              app:tabIndicatorColor=&quot;@color/upcomer_background_red&quot;
              android:layout_gravity=&quot;bottom&quot;
              app:layout_scrollFlags=&quot;scroll|enterAlways&quot;
              app:tabContentStart=&quot;72dp&quot; /&gt;
  
          &lt;android.support.v7.widget.Toolbar
              android:id=&quot;@+id/toolbar&quot;
              android:layout_width=&quot;match_parent&quot;
              android:layout_height=&quot;?attr/actionBarSize&quot;
              app:layout_collapseMode=&quot;parallax&quot;
              app:layout_collapseParallaxMultiplier=&quot;0.9&quot;
              android:background=&quot;@color/upcomer_background_red&quot;
              app:popupTheme=&quot;@style/AppTheme.PopupOverlay&quot; &gt;
  
              &lt;ImageView
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:id=&quot;@+id/title_image_view&quot;
                  android:contentDescription=&quot;@null&quot;
                  android:layout_gravity=&quot;start|center_vertical&quot;
                  android:visibility=&quot;gone&quot;
                  android:src=&quot;@drawable/title&quot;/&gt;
      
              &lt;RelativeLayout
                  android:layout_width=&quot;match_parent&quot;
                  android:layout_height=&quot;match_parent&quot;
                  android:id=&quot;@+id/title_layout&quot;
                  android:visibility=&quot;gone&quot;&gt;
  
                  &lt;TextView
                      android:layout_width=&quot;wrap_content&quot;
                      android:layout_height=&quot;wrap_content&quot;
                      android:layout_centerVertical=&quot;true&quot;
                      android:id=&quot;@+id/toolbarText&quot;
                      style=&quot;@android:style/TextAppearance.DeviceDefault.Widget.ActionBar.Title&quot;/&gt;
  
                  &lt;TextView
                      android:layout_width=&quot;wrap_content&quot;
                      android:layout_height=&quot;wrap_content&quot;
                      android:id=&quot;@+id/send_button&quot;
                      android:layout_marginRight=&quot;10dp&quot;
                      android:layout_marginEnd=&quot;10dp&quot;
                      android:text=&quot;@string/send_text&quot;
                      android:textColor=&quot;@color/white&quot;
                      android:textSize=&quot;18sp&quot;
                      android:textStyle=&quot;bold&quot;
                      android:visibility=&quot;gone&quot;
                      android:layout_centerVertical=&quot;true&quot;
                      android:layout_alignParentRight=&quot;true&quot;
                      android:layout_alignParentEnd=&quot;true&quot;/&gt;
  
              &lt;/RelativeLayout&gt;
      
          &lt;/android.support.v7.widget.Toolbar&gt;
  
      &lt;/android.support.design.widget.CollapsingToolbarLayout&gt;
  
  &lt;/android.support.design.widget.AppBarLayout&gt;
  </code></pre>
  <p>Now the <code>TabLayout</code> is not visible and the <code>Toolbar</code> stays there even though the list in the <code>ViewPager</code> below is scrolled. Kindly help.</p>