Develop Reference

How do I use parallax to scroll through my content?

I have some issues with parallax for android, where I currently have an image on top (with text content in the center) and a button on the top right.
Now as I scroll, I want the text and button to remain fixed on screen. As I scroll past the appbar (toolbar), the toolbar should be fixed to the top and the button should be on top right of it, fixed to it , while the rest of the content stays scrollable.
Here's my code (without parallax), any clue how i can achieve this ?
<?xml version="1.0" encoding="utf-8"?>
<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/cl_root_view"
android:background="#color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false">
<LinearLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
android:background="#color/white"
android:contentInsetStart="5dp"
android:contentInsetLeft="5dp"
android:contentInsetEnd="5dp"
android:contentInsetRight="5dp"
app:contentInsetEnd="5dp"
app:contentInsetLeft="5dp"
app:contentInsetRight="5dp"
app:contentInsetStart="5dp"
app:titleTextAppearance="#style/Toolbar.TitleText">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/toolbar_title"
style="#style/Toolbar.AltTitleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:drawableStart="#drawable/ic_dots"
android:gravity="center_vertical" />
<ImageButton
android:id="#+id/my_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="#+id/toolbar_title"
android:layout_marginEnd="20dp"
android:background="#drawable/ic_my_button"
android:tint="#color/black" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<ScrollView
android:id="#+id/scrollView"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF">
<TextView
android:id="#+id/roomsTitle"
style="#style/Headline2LeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_toStartOf="#+id/btnMore"
android:paddingStart="20dp"
android:paddingEnd="20dp"
android:text="#string/meeting_rooms"
android:textAppearance="#style/TextAppearance.Text.Chronicle"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btnMore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:fontFamily="sans-serif"
android:letterSpacing="0.02"
android:lineSpacingExtra="2sp"
android:paddingStart="20dp"
android:paddingEnd="20dp"
android:text="#string/all_rooms"
android:textColor="#color/reddish"
android:textSize="18sp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v4.view.ViewPager
android:id="#+id/roomViewPager"
android:layout_width="match_parent"
android:layout_height="400dp"
android:clipToPadding="false"
android:overScrollMode="never"
android:paddingStart="15dp"
android:paddingTop="16dp"
android:paddingEnd="15dp"
android:paddingBottom="45dp"
app:layout_constraintTop_toBottomOf="#id/roomsTitle" />
<RelativeLayout
android:id="#+id/register_a_visitor_container"
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_margin="5dp"
android:layout_marginTop="35dp"
android:background="#color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/roomViewPager">
<ImageView
android:id="#+id/register_visitor_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:tint="#color/reddish"
android:src="#drawable/ic_register_visitor_icon"
/>
<TextView
android:id="#+id/register_a_visitor_button"
style="#style/Body1RegLeftBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:letterSpacing="0.01"
android:layout_marginStart="16dp"
android:layout_toEndOf="#+id/register_visitor_icon"
android:lineSpacingExtra="8sp"
android:text="#string/register_a_visitor"
android:textAllCaps="false"
android:textAppearance="#style/TextAppearance.Text.Roboto.Regular" />
<ImageView
android:id="#+id/reset_password_chevron"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="16dp"
android:tint="#color/brownish_grey"
android:background="#drawable/ic_baseline_chevron_right_24px"
/>
</RelativeLayout>
<!-- TODO work on it after MVP -->
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:visibility="gone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/container">
<TextView
android:id="#+id/upcoming_events"
style="#style/Headline3LeftGrey"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_marginStart="25dp"
android:text="#string/upcoming_events" />
<android.support.v7.widget.RecyclerView
android:id="#+id/event_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/upcoming_events"
android:background="#color/black"
tools:listitem="#layout/item_repo_view" />
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
As you can see from the above layout. I want to add an image (and add the my_button on top right of that image) that is above the toolbar and scrolls off the screen as you scroll up while my button stays in its place until the toolbar gets on top ,after which the toolbar is affixed to the top as you scroll further up, unless you scroll down and the image is visible again and the button is no more fixed.
Please let me know if this is confusing,I will try to explain it better with diagrams if possible.
Any examples will be helpful! thanks!

Please refer below code, i have made something like you.
<?xml version="1.0" encoding="utf-8"?>
<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:id="#+id/view_profile_parent_layout"
android:background="#color/splash_bg_color"
tools:context=".view_profile.ViewProfileActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_barLayout"
android:layout_width="match_parent"
android:layout_height="#dimen/view_profile_profile_app_bar_height"
android:elevation="#dimen/view_profile_app_bar_elevation"
android:theme="#style/ThemeOverlay.AppCompat.Light">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_bar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:titleEnabled="false"
android:fitsSystemWindows="true"
app:layout_scrollFlags="exitUntilCollapsed|scroll">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize">
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/view_profile_imageView"
android:layout_width="#dimen/view_profile_profile_width"
android:layout_height="#dimen/view_profile_profile_height"
android:src="#drawable/ic_profile_icon"
android:layout_centerHorizontal="true"
app:civ_border_width="#dimen/view_profile_profile_border_width"
app:civ_border_color="#color/textPrimary"/>
<TextView
android:id="#+id/view_profile_profile_name_textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/view_profile_profile_name_margin_top"
android:layout_below="#id/view_profile_imageView"
android:fontFamily="#font/roboto_regular"
android:text=""
android:textSize="#dimen/view_profile_profile_name_text_size"
android:gravity="center"
android:textColor="#color/white"/>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
app:layout_collapseMode="pin"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="#dimen/login_btn_elevation"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/back_button"
android:layout_width="#dimen/back_btn_layout_w"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_alignParentStart="true"
android:orientation="horizontal">
<Button
android:layout_gravity="center_vertical|center_horizontal"
android:layout_width="#dimen/back_btn_w"
android:layout_height="#dimen/back_btn_w"
android:layout_marginStart="#dimen/default_padding"
android:clickable="false"
android:background="#drawable/ic_arrow_back_white_24dp"
android:elevation="#dimen/login_btn_elevation" />
</LinearLayout>
<TextView
android:id="#+id/nav_title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_marginStart="#dimen/nav_outer_h_space"
android:fontFamily="#font/roboto_regular"
android:text=""
android:gravity="center"
android:textColor="#color/white"
android:textSize="#dimen/title_size" />
<Button
android:id="#+id/edit_button"
android:layout_width="#dimen/back_btn_w"
android:layout_height="#dimen/back_btn_w"
android:layout_gravity="right"
android:layout_centerInParent="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="#dimen/nav_outer_h_space"
android:background="#drawable/edit_white_icon"
android:elevation="#dimen/login_btn_elevation" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
Use
app:layout_scrollFlags="exitUntilCollapsed|scroll"
in collapsing layout
app:layout_collapseMode="pin"
in Toolbar

Changing from one view to another view onScroll

I am working a project. I have a a layout with a view at top and a Scrollview at the bottom of the view. Initially the layout will look like this.
After I scroll up the bottom layout. The view should smoothly change the the below view. And if I scroll down the view should come back to its previous layout.
As you can see there is a change in the position and size of the textviews. How can I achieve this ?
Here is the layout:
<?xml version="1.0" encoding="utf-8"?>
<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/home_parentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:background="#color/AT_charcoal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginBottom="9dp"
android:background="#drawable/topographybackgroundx">
<RelativeLayout
android:id="#+id/layout_header_profile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20dp">
<RelativeLayout
android:id="#+id/top_ExpandedHeader"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/image_invisalignLogo"
android:layout_width="108dp"
android:layout_height="26dp"
android:background="#drawable/invis_logo"
android:contentDescription="#null" />
<ImageButton
android:id="#+id/image_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:background="#drawable/ic_profile_wht"
android:contentDescription="#null" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/number_RelativeLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/layout_aligner_expanded_change"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp">
<TextView
android:id="#+id/image_alignerNumber"
style="#style/BigNumber"
android:layout_width="wrap_content"
android:layout_height="138dp"
android:layout_alignParentStart="true"
android:layout_below="#+id/textview_alignerTimeChange"
android:maxLength="2"
android:maxLines="1"
android:text="#string/three"
android:textSize="124sp" />
<TextView
android:id="#+id/textview_alignerChange"
style="#style/BodyWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginTop="80dp"
android:layout_toEndOf="#id/image_alignerNumber"
android:letterSpacing="0.03"
android:text="#string/days_alignerchange" />
<de.hdodenhof.circleimageview.CircleImageView xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/image_selfie_icon"
android:layout_width="96dp"
android:layout_height="96dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
app:civ_border_color="#FFFFFFFF"
app:civ_border_width="2dp" />
<TextView
android:id="#+id/textview_6alignerNumber"
style="#style/HeaderWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/image_alignerNumber"
android:layout_below="#id/image_alignerNumber"
android:layout_marginTop="2dp"
android:letterSpacing="0.03"
android:text="#string/aligner_number" />
<TextView
android:id="#+id/textview_expanalignerNumber"
style="#style/HeaderWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/image_alignerNumber"
android:layout_toEndOf="#id/textview_6alignerNumber"
android:text="5" />
<TextView
android:id="#+id/textview_alignerTimeChange"
style="#style/LargeHeaderWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="17dp"
android:letterSpacing="0.03"
android:text="#string/aligner_change"
android:visibility="gone" />
<Button
android:id="#+id/button_change"
style="#style/TextButtonWhite"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textview_alignerTimeChange"
android:layout_marginTop="15dp"
android:background="#color/AT_lushGreen"
android:gravity="center_vertical"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:text="#string/changenow"
android:visibility="gone" />
</RelativeLayout>
<View
android:id="#+id/dividerline"
android:layout_width="fill_parent"
android:layout_height="2dp"
android:layout_below="#id/number_RelativeLayout"
android:layout_marginTop="12dp"
android:background="#color/AT_line" />
<TextView
android:id="#+id/addPhoto_TextView"
style="#style/BtnTextBlue18"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/dividerline"
android:layout_marginTop="10dp"
android:text="#string/add_photo" />
<TextView
android:id="#+id/goCalendar_TextView"
style="#style/BtnTextGold18"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="#id/dividerline"
android:layout_marginTop="7dp"
android:text="#string/go_calendar" />
</RelativeLayout>
</RelativeLayout>
<include
layout="#layout/homescreen_scrollview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/layout_header_profile"
android:layout_marginTop="15dp" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>

You can use the Collapsing Toolbar Layout
Example Here and here
Edit: some piece of code
<android.support.design.widget.CoordinatorLayout
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.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<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"
app:contentScrim="?attr/colorPrimary">
<ImageView
android:id="#+id/expandedImage"
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="#drawable/beach_scene"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7"
/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" >
</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:background="#android:color/white"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/sample_string"/>
</android.support.v4.widget.NestedScrollView>

Using a Collapse Tool Bar as João said, your code should be like this
and getting my answer as base from here
<android.support.design.widget.CoordinatorLayout
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:clipToPadding="false">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="210dp"
android:background="#color/WHITE">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:collapsedTitleTextAppearance="#style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:expandedTitleMarginStart="72dp"
app:expandedTitleTextAppearance="#style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<Your Content>
<android.support.v7.widget.Toolbar
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="40dp"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include
layout="#layout/homescreen_scrollview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/layout_header_profile"
android:layout_marginTop="15dp" />
On <Your Content> is the place where you should put your string.
Sorry that I can't help more. Your Cody is a little messy and really hard to understand.
Maybe if you edit leaving only the important codes will help.
But maybe this library can help you.

Issue with collapsing toolbar in marshmallow and above

I am facing a little issue with Collapsing toolbar and only for the devices having OS marshmallow and above, for lower versions its working fine
following 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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/fp_dashboard_backgrd"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_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|enterAlways">
<include
layout="#layout/filter_search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="?attr/actionBarSize"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/MyToolbar"
android:layout_width="match_parent"
android:background="#color/fund_screener_toolbar"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:theme="#style/ActionBar">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:maxLines="1"
android:text=" Fund Screener "
android:textColor="#color/color_white"
android:textSize="#dimen/dimen_txt_20" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include
android:id="#+id/scrolll"
layout="#layout/recycle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="fill_vertical"
android:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<include
android:id="#+id/imageViewProgress"
layout="#layout/layout_bull_progress_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</android.support.design.widget.CoordinatorLayout>
And here are the first image showing when i scroll up
and when i scroll down i get this extra white space above my toolbar I am not sure what is going wrong. check below image. As you guys can see white space above my Fund Screener toolbar
Guys please help me I have done lot of changes and research but not able to get any solution. Please help
EDIT
filter_search.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="vertical"
android:padding="10dp">
<android.support.v7.widget.AppCompatSpinner
android:id="#+id/spnAMCName"
style="#style/Base.Widget.AppCompat.Spinner.Underlined"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/SpinnerBottomLine" />
<com.app.widgets.TextViewRobotoRegular
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:text="#string/lbl_asset_type"
android:textColor="#color/fp_light_gray"
android:textSize="13sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<com.app.widgets.TextViewRobotoLight
android:id="#+id/btnequity"
android:layout_width="#dimen/dimen_0"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/btn_border_default"
android:gravity="center"
android:paddingBottom="7dp"
android:paddingTop="7dp"
android:text="#string/equity"
android:textColor="#color/fp_light_gray"
android:textSize="13sp" />
<com.app.widgets.TextViewRobotoLight
android:id="#+id/btndebt"
android:layout_width="#dimen/dimen_0"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/btn_border_default"
android:gravity="center"
android:paddingBottom="7dp"
android:paddingTop="7dp"
android:text="#string/debt"
android:textColor="#color/fp_light_gray"
android:textSize="13sp" />
<com.app.widgets.TextViewRobotoLight
android:id="#+id/btnhybrid"
android:layout_width="#dimen/dimen_0"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/btn_border_default"
android:gravity="center"
android:paddingBottom="7dp"
android:paddingTop="7dp"
android:text="#string/hybrid"
android:textColor="#color/fp_light_gray"
android:textSize="13sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:orientation="horizontal"
android:weightSum="1">
<android.support.v7.widget.AppCompatSpinner
android:id="#+id/spnFundSubCategory"
style="#style/Base.Widget.AppCompat.Spinner.Underlined"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_weight="0.5"
android:paddingRight="2dp"
android:theme="#style/SpinnerBottomLine" />
<android.support.v7.widget.AppCompatSpinner
android:id="#+id/spnFundNature"
style="#style/Base.Widget.AppCompat.Spinner.Underlined"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_weight="0.5"
android:paddingLeft="2dp"
android:theme="#style/SpinnerBottomLine" />
</LinearLayout>
</LinearLayout>

You are using android:layout_marginTop="?attr/actionBarSize" where you are including your layout="#layout/filter_search". This is causing actionBarSize space above your CollapsingToolbarLayout in expanded mode. Just remove it as follows.
<include
layout="#layout/filter_search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
I hope this works for you.Thank You

Fab gets focus only sometimes

I have a problem testing the focusability of my App with D-pad. Here there are two screenshots of my App:
In the picture of the left side, the fab is "outside(or below)" the list and after the last element it gets the focus when navigating down, so everything is ok in this case. The problem comes with the image of the right side. The fab is "inside" the listView and for that reason(I think but I'am not sure) it doesn't get ever the focus. Is there anything that can be done about it?
An enhacement would be that the fab would get the focus always before the list(that is immediately after the tabs), no matter where the fab is positioned at the momment in the layout, but the problem is that I don't know how to do it, since Android decides the focus order of my Layout.
Any help would be highly appreciated.
UPDATE:
fragment_main.xml
<?xml version="1.0" encoding="utf-8"?>
<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:mContext=".FragmentMain">
<!---marginBottom for ads-->
<android.support.v4.view.ViewPager
android:id="#+id/viewpagerMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:layout_marginBottom="60dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<android.support.design.widget.TabLayout
android:id="#+id/tabsMain"
android:layout_width="match_parent"
android:layout_height="90dp"
android:layout_marginTop="50dp"
android:background="?attr/colorPrimary"
app:layout_anchor="#+id/appbar"
app:layout_anchorGravity="bottom"
app:tabGravity="fill"
app:tabIndicatorHeight="5dp"
app:tabMode="fixed"
app:tabPaddingTop="60dp"
app:tabSelectedTextColor="#android:color/white"
app:tabTextAppearance="#style/TabTextAppearance" />
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="330dp"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<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:layout_scrollFlags="scroll|exitUntilCollapsed">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="86dp"
android:background="#color/white"
android:orientation="vertical">
<com.github.mikephil.charting.charts.LineChart
android:id="#+id/chart"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_marginLeft="5dp"/>
<ProgressBar
android:id="#+id/progressBar"
android:background="#drawable/progress"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:visibility="visible"
tools:visibility="visible">
</ProgressBar>
</FrameLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- http://antonioleiva.com/floating-action-button/-->
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabMain"
android:focusable="true"
android:background="#drawable/selector_focusable_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end|right"
android:layout_marginBottom="60dp"
android:layout_marginRight="16dp"
android:layout_marginEnd="16dp"
android:src="#drawable/plus_48"
app:pressedTranslationZ="12dp"
app:rippleColor="#color/colorAccent"/>
<include layout="#layout/ad_bottom_bar"
android:id="#+id/advBottomBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
/>
</android.support.design.widget.CoordinatorLayout>
security_item.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- for statedrawable list to work we need to set background in cardview and
immediate linearlayout. Also set android.clickable in cardview AND
android:duplicateParentState in linearlayout-->
<android.support.v7.widget.CardView 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/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:background="#drawable/selector_security"
android:clickable="true"
android:nextFocusRight="#+id/overflow"
app:contentPadding="#dimen/si_card_view_content_padding"
android:id="#+id/cardView"
card_view:cardCornerRadius="0dp"
card_view:cardElevation="#dimen/si_card_view_elevation"
card_view:cardUseCompatPadding="true"
>
<LinearLayout
android:id="#+id/linearParent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:nextFocusRight="#+id/overflow"
android:duplicateParentState="true"
android:background="#drawable/selector_security">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#id/ticker"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
tools:text="GOOG" />
<TextView
android:id="#+id/market"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="start"
tools:text="EQUITY" />
<ImageView
android:id="#+id/overflow"
android:focusable="true"
android:nextFocusLeft="#+id/cardView"
android:nextFocusDown="#+id/cardView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/selector_overflow_mini"
android:tint="#color/gray700"
android:src="#drawable/ic_overflow"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.carlos.capstone.customcomponents.AutoResizeTextView
android:id="#+id/securityName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
android:textStyle="bold"
tools:text="Alphabet Inc." />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="end"
android:textSize="#dimen/si_label_day"
android:text="Day(max/min)"
tools:text="Day(max/min)" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/price"
android:layout_marginTop="3dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:textSize="#dimen/si_price_text_size"
tools:text="710,89" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.9"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.carlos.capstone.customcomponents.AutoResizeTextView
android:id="#+id/percentChange"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginTop="#dimen/si_percent_margin_top"
android:textSize="#dimen/si_percent_text_size"
android:gravity="end"
tools:text="-110.21%" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical">
<com.carlos.capstone.customcomponents.AutoResizeTextView
android:id="#+id/dayMax"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:textColor="#color/gray400"
android:gravity="end"
tools:text="716,49" />
<com.carlos.capstone.customcomponents.AutoResizeTextView
android:id="#+id/dayMin"
android:paddingTop="#dimen/si_min_padding_top"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="end"
android:textColor="#color/gray400"
tools:text="706,02" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>

You can create a separate Layout and put your fab there. This will force that part to always be seen.
For example
<LinearLayout>
//list stuff here
<LinearLayout>
//fab stuff
</LinearLayout>
</LinearLayout>

Coordinator Layout with RecyclerView

I am using a CoordinatorLayout with RecyclerView.The app runs fine but my problem is the the view should only scroll as the items in RecyclerView.In my case i have only 3 items but the CordinatorLayout will scroll the RecyclerView till it will snap to the top because of this i am getting the below part as white as the listsize is only 3.
XMl
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<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.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="#android:color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textView38"
android:layout_alignParentTop="true"
android:padding="20dp"
android:src="#drawable/ic_filter_back" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_event_details"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#fff"
android:orientation="horizontal"
android:paddingBottom="03dp">
<RelativeLayout
android:id="#+id/rl_tab1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<ImageView
android:id="#+id/tab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="05dp"
android:src="#drawable/ic_create_wedding_admin" />
<TextView
android:id="#+id/tv_tab_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tab1"
android:layout_marginLeft="05dp"
android:layout_marginRight="05dp"
android:gravity="center"
android:text="Admin" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rl_tab2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<ImageView
android:id="#+id/tab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="05dp"
android:src="#drawable/ic_create_wedding_guests" />
<TextView
android:id="#+id/tv_tab_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tab2"
android:layout_marginLeft="05dp"
android:layout_marginRight="05dp"
android:gravity="center"
android:text="Guests" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rl_ed_tab_guests"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<ImageView
android:id="#+id/iv_ed_iv_budget"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="05dp"
android:src="#drawable/ic_create_wedding_budget" />
<TextView
android:id="#+id/tvbud"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/iv_ed_iv_budget"
android:layout_marginLeft="05dp"
android:layout_marginRight="05dp"
android:gravity="center"
android:text="Budget" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rl_ed_tab_tasks"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<ImageView
android:id="#+id/iv_ed_iv_tasks"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="05dp"
android:src="#drawable/ic_create_wedding_tasks" />
<TextView
android:id="#+id/tv_ed_tasks"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/iv_ed_iv_tasks"
android:layout_marginLeft="05dp"
android:layout_marginRight="05dp"
android:gravity="center"
android:text="Tasks" />
</RelativeLayout>
</LinearLayout>
What i want is to scroll the view only till the item size.

This issue has already been brought up.
Please check other questions before posting another.
You need to provide a custom behavior to your child layout in the Coordinator Layout.
Check this if it helps:
https://stackoverflow.com/a/33461064/2346980