问题
I am trying to have the same behavior as the PlayStore app in terms of scrolling. Here is the gif of what I want to achieve https://giphy.com/gifs/MymB51M84gpdS.
What I have is the following:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="@dimen/height"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
style="@style/match"
android:minHeight="0dp"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<RelativeLayout
style="@style/match"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
style="@style/match"
android:scaleType="centerCrop"
tools:ignore="ContentDescription"/>
<TextView
android:id="@+id/tv"
style="@style/matchwrap"
android:layout_alignParentBottom="true"/>
<TextView
style="@style/matchwrap"
android:layout_above="@id/tv"
android:maxLines="2"/>
</RelativeLayout>
<include
android:id="@+id/toolbar"
layout="@layout/toolbar"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
style="@style/match">
<LinearLayout style="@style/match"/>
</android.support.v4.widget.NestedScrollView>
<FrameLayout>
<Button/>
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
How do I achieve the PlayStore like scrolling behavior?
EDIT:
My question is more about when the screen is being pulled down, the ToolBar appears and then the image is shown. I want my behavior to match that.
回答1:
Similiar question: collapsing toolbar layout like google play store
There is an ImageView with parallax collapseMode and of course, they pinned the Toolbar but after collapsing the CollapsingToolbarLayout, Toolbar is going to be hide.
Something 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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/seffafCollapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="240dp"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<ImageView
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@drawable/header"
app:layout_collapseMode="parallax" />
<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.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
Result:
来源:https://stackoverflow.com/questions/35449871/collapsingtoolbarlayout-like-playstore-app