Collapsing Toolbar and Fragment Collapsing Toolbar and Fragment xml xml

Collapsing Toolbar and Fragment


You want to set something up like this:

<android.support.design.widget.CoordinatorLayout>    <android.support.design.widget.AppBarLayout>    <android.support.design.widget.CollapsingToolbarLayout        app:layout_scrollFlags="scroll|exitUntilCollapsed">            <ImageView                app:layout_collapseMode="parallax"/>            <android.support.v7.widget.Toolbar />        </android.support.design.widget.CollapsingToolbarLayout>    </android.support.design.widget.AppBarLayout>    <LinearLayout        app:layout_behavior="@string/appbar_scrolling_view_behavior" >        <android.support.design.widget.TabLayout />        <android.support.v4.view.ViewPager />    </LinearLayout></android.support.design.widget.CoordinatorLayout>

This will give you a parallax effect with Fragments inside the ViewPager.

Make sure you add the:

android:fitsSystemWindows="true"

Attribute to both AppBarLayout and CollapsingToolbarLayout, and this attribute to the Toolbar:

app:layout_collapseMode="pin"

If you want to add another Fragment you can add a FrameLayout like so:

<android.support.design.widget.CoordinatorLayout>    <android.support.design.widget.AppBarLayout>        <!-- CollapsingToolbarLayout -->    </android.support.design.widget.AppBarLayout>    <LinearLayout >        <android.support.design.widget.TabLayout />        <android.support.v4.view.ViewPager />    </LinearLayout>    <FrameLayout /></android.support.design.widget.CoordinatorLayout>