pin buttons below toolbar while scrolling android

Question

I need to show buttons below toolbar while scroll down like below video. Any samples? I have tried lot but confused.

https://www.youtube.com/watch?v=enWVNP3Gifg

Answer 1

You can use two toolbar one with search view and one with widgets.

You design be like below.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

  <android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

  <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"/>

  <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar2"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"/>

  <ImageButton
    android:id="@+id/fabButton"
    android:layout_width="56dp"
    android:layout_height="56dp"
    android:layout_gravity="bottom|right"
    android:layout_marginBottom="16dp"
    android:layout_marginRight="16dp"
    android:background="@drawable/fab_background"
    android:src="@drawable/ic_favorite_outline_white_24dp"
    android:contentDescription="@null"/>

</FrameLayout>

then you can hide one on scroll like below

Complete Demo of hide toolbar on scroll.

Answer 2

You need to use CoordinatorLayout which you can find a good tutorial in here:

Tutorial

Simply put, you need to have a CoordinatorLayout which contains a AppBarLayout (which must be the first child) and the AppBarLayout must contain two chilren like this:

<android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

           <android.support.v7.widget.Toolbar
               .../>
           <android.support.design.widget.TabLayout
                android:id="@+id/tabLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways"/>
        </android.support.design.widget.AppBarLayout>

The line app:layout_scrollFlags="scroll|enterAlways" makes it like you want it.