1、Collapsing Avatar Toolbar效果
2、Collapsing Avatar Toolbar说明
Collapsing Avatar Toolbar是一个 title 特效。 国外非常流行的一种设计~
温馨提示:Collapsing Avatar Toolbar 的更多使用请直接看下方的代码例子片段,或查看官方文档。
3、Collapsing Avatar Toolbar 使用
下面三个步骤,请仔细阅读。
1、
dependencies {
compile 'com.sloydev:collapsingavatartoolbar:1.0.0'
}
2、
<com.sloydev.collapsingavatartoolbar.CollapsingAvatarToolbar
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
app:collapsedPadding="@dimen/collapsedPadding"
app:expandedPadding="@dimen/expandedPadding"
app:collapsedImageSize="@dimen/collapsedImageSize"
app:expandedImageSize="@dimen/expandedImageSize"
app:collapsedTextSize="@dimen/collapsedTextSize"
app:expandedTextSize="@dimen/expandedTextSize"
>
3、
<android.support.design.widget.CoordinatorLayout
...
>
<android.support.design.widget.AppBarLayout
...
android:layout_height="@dimen/expanded_toolbar_height"
>
<android.support.design.widget.CollapsingToolbarLayout
...
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<android.support.v7.widget.Toolbar
...
app:layout_collapseMode="pin"
/>
<com.sloydev.collapsingavatartoolbar.CollapsingAvatarToolbar
...
>
<de.hdodenhof.circleimageview.CircleImageView
android:id="@id/cat_avatar"
...
/>
<TextView
android:id="@id/cat_title"
...
/>
</com.sloydev.collapsingavatartoolbar.CollapsingAvatarToolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- The rest of your activity layout -->
...
</android.support.design.widget.CoordinatorLayout>