Develop Reference

Need to collapse/expand part of appbar on button click

I got a layout where i need to expand/collapse the part of appbarlayout on click of button in a toolbar.
I know how to do all the stuff, except the hide/show itself. I tried to use AppBarLayout.setExpanded(false) but its not working.
Here is my 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.softdeal.gazdaifua.activity.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:id="#+id/main_appbar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="fill"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:layout_weight="1">
<ImageButton
android:id="#+id/btn_filter"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_gravity="end"
android:background="?selectableItemBackgroundBorderless"
app:srcCompat="#drawable/ic_filter_list_white_48dp" />
</android.support.v7.widget.Toolbar>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/main.collapsing"
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|snap">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_collapseMode="pin">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="number" />
<Spinner
android:id="#+id/spinner"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<Spinner
android:id="#+id/spinner1"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:visibility="invisible"
app:srcCompat="#drawable/ic_add_plus_button" />

Adding FloatingActionButton in collapsing toolbar layout

Currently working on a app where I need to add "share" and "add" buttons in the bottom right corner of a Collapsing toolbar(for parallax effect).
Which might hide on scrolling or might sit on Actionbar. Added the image of what i want to achieve. Currently have no clue on how to do this(tried with floating action buttons with anchors, but failed).
This is what is should look like:
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/htab_maincontent"
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/htab_appbar"
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/htab_collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<ImageView
android:id="#+id/htab_header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/header"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/htab_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="top"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:titleMarginTop="13dp"/>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/htab_tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:background="#color/colorPrimary"
app:tabIndicatorHeight="#dimen/tabIndicatorHeight"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/htab_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>

If you are using that in CollapsingToolbarLayout, you can do this:
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbarCollapse"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="match_parent"
android:layout_height="190dp"
android:background="#android:color/darker_gray"
android:minHeight="190dp"
android:src="#drawable/ic_email"
app:layout_collapseMode="parallax"
android:id="#+id/imageView8" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabmain"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:src="#drawable/ic_add"
app:backgroundTint="#color/ColorAccent"
app:borderWidth="0dp"
app:fabSize="mini"
app:layout_anchor="#id/app_bar_layout"
app:layout_anchorGravity="bottom|end"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_alignTop="#+id/fabmain2"
android:layout_toStartOf="#+id/fabmain2"
android:layout_marginEnd="20dp" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabmain2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginLeft="16dp"
android:src="#drawable/ic_add"
app:backgroundTint="#color/ColorAccent"
app:borderWidth="0dp"
app:fabSize="mini"
app:layout_anchor="#id/app_bar_layout"
app:layout_anchorGravity="bottom|end"
android:layout_marginRight="16dp"
android:layout_marginEnd="23dp"
android:layout_alignBottom="#+id/imageView8"
android:layout_alignParentEnd="true"
android:layout_marginBottom="29dp" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
app:layout_collapseMode="pin" />
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
Also, According to Google Material Design, i don't think if this is the standard way/or good way for two buttons!
Also, this is my idea (standard way):
You could add a Share action with that icon on Actionbar and then Use one FloatingActionButton like this:
https://github.com/xuyisheng/DesignSupportLibraryDemo
Or i did that myself like this:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EEEEEE"
android:fitsSystemWindows="true">
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<!--Your content-->
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layoutdetails"
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/collapsing_toolbar"
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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/thumbnaildetails"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_alignParentStart="true"
android:contentDescription="#string/imghd"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<TextView
android:id="#+id/txtitemdetailstitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="85dp"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/tbbardetails"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
app:layout_collapseMode="pin"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="#drawable/ic_work"
app:backgroundTint="#E91E63"
app:fabSize="normal"
app:layout_anchor="#id/app_bar_layoutdetails"
app:layout_anchorGravity="right|bottom" />
</android.support.design.widget.CoordinatorLayout>

CoordinatorLayout with NestedScroll and CollapsingToolbarLayout doesn't scroll to bottom

I am having an issue with CoordinatorLayout and CollapsingToolbarLayout, the toolbar is working fin, but when I scroll the activity to bottom, it does never get to the bottom it only gets until the 2nd row before the last one.
Is there any problem in my xml? (I am loading the text from strings.xml programmatically)
This is my Layout
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/rootLayout"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="256dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/img_1"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/par_toolbar"
android:minHeight="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
>
<TextView
android:id="#+id/title"
android:textSize="17sp"
android:text="#string/app_toolbar_title"
android:textColor="#color/Blanco"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
</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:layout_gravity="fill_vertical"
android:background="#color/background"
android:paddingBottom="32dp"
android:paddingRight="32dp"
android:paddingLeft="32dp"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:paddingTop="32dp"
android:layout_height="match_parent"
android:background="#color/background"
android:orientation="vertical">
<TextView
android:id="#+id/txt_paragraph_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textColor="#color/black"
android:layout_marginBottom="5dp"
android:textStyle="bold"
android:textSize="18sp" />
<TextView
android:id="#+id/txt_paragraph"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="#string/history1"
android:textColor="#color/black"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Seems that behavior you have described is caused by layout_gravity attribute of your NestedScrollView. Try to remove it.

Clickable CardView inside NestedScroll doesn't trigger scrolling

I have a layout with a CoordinatorLayout, and AppBarLayout and a NestedScrollView, inside the NestedScrollView I have multiple CardViews, everything works ok until I set the CardViews to be clickable, then if I start a scroll within a CardView, scroll doesn't work.
This is my layout:
<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.AppBarLayout
android:id="#+id/appbar"
android:layout_height="256dp"
android:layout_width="match_parent"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true"
app: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"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary">
<ImageView
android:id="#+id/backdrop"
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_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_gravity="fill_vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="0dp"
app:cardUseCompatPadding="true">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="80dp"
android:layout_height="80dp"
android:background="#color/primary" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="4dp"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingBottom="7dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lines="1"
android:includeFontPadding="false"
android:text="Title1"
style="#android:style/TextAppearance.Medium" />
<TextView
android:lines="2"
android:text="Description 1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
...
</LinearLayout>
</android.support.v4.widget.NestedScrollView>

The issue comes to daylight when the ScrollView isn't filled with content. I think it's a very weird bug in Android.
The 'solution'..
<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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_height="256dp"
android:layout_width="match_parent"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true"
app: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"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary">
<ImageView
android:id="#+id/backdrop"
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_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_gravity="fill_vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="0dp"
app:cardUseCompatPadding="true"
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="80dp"
android:layout_height="80dp"
android:background="#cdcdcd"
android:clickable="true"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="4dp"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingBottom="7dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lines="1"
android:includeFontPadding="false"
android:text="Title1"
style="#android:style/TextAppearance.Medium"/>
<TextView
android:lines="2"
android:text="Description 1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="1000dp"
android:orientation="vertical"
android:layout_margin="4dp"
android:background="#c1c1c1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20pt"
android:text="some content..."/>
</LinearLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

It seems like the same problem as here: Scroll doesn't work in NestedScrollView when try to scroll from views with click events
This is the kind of workaround for your problem
https://stackoverflow.com/a/32887429/2165810
But you shuld also use setPreventCornerOverlap(false) for your CardView to avoid problems with CardView

As people have noted, the problem is when the CardView sits fully within the screen it won't trigger scrolling from the card. Scrolling still works from views within the CollapsingToolbarLayout.
My solution was to add android:layout_marginBottom="100dp" to the CardView so that the bottom edge is offscreen thus allowing scrolling.

Position toolbar on layout using material design

I have 3 doubts related with layout and styles: I need position my toolbar in specific position, I need add shadows on text, and I need add more action buttons.
The image describe my problem:
I have 2 "Toolbar"s in my layout, one on top, and one need stay before picture. I did try a lot of things, but dont work!
This is my layout:
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="#dimen/detail_backdrop_height"
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"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="84dp">
<ImageView
android:id="#+id/backdrop"
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="#drawable/gallery_toolbar_shape"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
<ProgressBar
android:id="#+id/gallery_progressbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginTop="-7.5dp"
style="?android:attr/progressBarStyleHorizontal"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<app:android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/personalToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignBottom="#+id/appbar"
android:layout_alignParentBottom="true"
android:background="#color/personal_tb"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
>
<ImageView android:id="#+id/testImg" android:src="#drawable/ic_done" android:layout_width="24dp" android:layout_height="24dp"/>
</app:android.support.v7.widget.Toolbar>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="24dp">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/card_margin">
<LinearLayout
style="#style/Widget.CardContent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Info"
android:textAppearance="#style/TextAppearance.AppCompat.Title" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/cheese_ipsum" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/card_margin"
android:layout_marginLeft="#dimen/card_margin"
android:layout_marginRight="#dimen/card_margin">
<LinearLayout
style="#style/Widget.CardContent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Friends"
android:textAppearance="#style/TextAppearance.AppCompat.Title" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/cheese_ipsum" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/card_margin"
android:layout_marginLeft="#dimen/card_margin"
android:layout_marginRight="#dimen/card_margin">
<LinearLayout
style="#style/Widget.CardContent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Related"
android:textAppearance="#style/TextAppearance.AppCompat.Title" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/cheese_ipsum" />
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="#id/appbar"
app:layout_anchorGravity="bottom|right|end"
android:src="#drawable/ic_discuss"
android:layout_margin="#dimen/fab_margin"
android:clickable="true"
app:borderWidth="0dp"/>
Anyone can point me the problem, I used:
android:layout_alignBottom="#+id/appbar"
"appbar" is my : AppBarLayout
Thanks

Am just wondering why you need to use multiple toolbar. But instead if you need to place a toolbar as per your shared image, place the toolbar inside the appbar layout.
Like:
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="#dimen/detail_backdrop_height"
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"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="84dp">
<ImageView
android:id="#+id/backdrop"
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="#drawable/gallery_toolbar_shape"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
<ProgressBar
android:id="#+id/gallery_progressbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginTop="-7.5dp"
style="?android:attr/progressBarStyleHorizontal"/>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/personalToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignBottom="#+id/appbar"
android:layout_alignParentBottom="true"
android:background="#color/personal_tb"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
</android.support.design.widget.AppBarLayout>