问题
I'm having trouble integrating the Design Support Library into my application. For some reason, the toolbar collapses with the CollapsingToolbarLayout, and does not leave it pinned like in the Cheesesquare example by Chris Banes. https://github.com/chrisbanes/cheesesquare
I didn't do anything different to my layout. In fact, I replaced my styles with his, and dropped in his layout. I wonder if using Toolbar, instead of android.support.v7.widget.Toolbar is causing this.
Here is the problem.
Here is my XML of the AppBar section.
<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_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="64dp">
<ImageView
android:id="@+id/backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
...
</android.support.design.widget.CoordinatorLayout>
回答1:
Your intuition was correct: CollapsingToolbarLayout
does rely on you using the support Toolbar
- it uses that to set the minimum height of the CollapsingToolbarLayout
(among many other things). You should switch to using the support version of the Toolbar
to ensure the best experience with CollapsingToolbarLayout
.
回答2:
<?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:context=".UserDetail" >
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
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"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp" >
<ImageView
android:id="@+id/imageView_list"
android:layout_width="match_parent"
android:layout_height="275dp"
app:layout_collapseMode="parallax"
android:fitsSystemWindows="true"
android:scaleType="fitXY"
android:src="@drawable/default_profile" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
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/scroll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:clipToPadding="false" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="15dp"
android:shrinkColumns="1"
android:stretchColumns="*" >
<TableRow
android:id="@+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp" >
</TableRow>
<TableRow
android:id="@+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/CurrentAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Current Address:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_CurrentAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textMultiLine"
android:text="Current Address"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/PermanentAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Permanent Address:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_PermanentAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textMultiLine"
android:text="Permanent Address"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/Email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_Email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email Address"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/PhoneNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Phone Number:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_PhoneNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Phone Number"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/BirthDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Date of Birth:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_BirthDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BirthDate"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/Gender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gender:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_Gender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gender"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/Education"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Education:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_Education"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Education"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/Qualification"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Qualification:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_Qualification"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Qualification"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/BloodGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BloodGroup:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_BloodGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BloodGroup"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
<TableRow
android:id="@+id/tableRow11"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="@+id/MaritalStatus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MaritalStatus:"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="@+id/txt_MaritalStatus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MaritalStatus"
android:textColor="#000000"
android:textSize="15sp"
android:textStyle="normal" />
</TableRow>
</TableLayout>
<!-- <Button
android:id="@+id/addContact"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Add To Contact"
android:textStyle="bold"
android:visibility="invisible" /> -->
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_margin="16dp"
app:layout_anchor="@id/app_bar_layout"
app:layout_anchorGravity="bottom|right|end"
android:clickable="true"
android:src="@drawable/addtocontact"
style="@style/FabStyle"
/>
</android.support.design.widget.CoordinatorLayout>
回答3:
- Use
app:layout_collapseMode="pin"
to ensure that the Toolbar itself remains pinned to the top of the screen while the view collapses. - Even better, when you use
CollapsingToolbarLayout
and Toolbar together, the title will automatically appear larger when the layout is fully visible, then transition to its default size as it is collapsed. Note that in those cases, you should call
setTitle()
on theCollapsingToolbarLayout
, rather than on the Toolbar itself.For more details about implementation visit Android Developers Blog or details about package CollapsingToolbarLayout
来源:https://stackoverflow.com/questions/30564588/design-support-library-collapsingtoolbarlayout-toolbar-not-getting-pinned-o