您当前的位置: 首页 >  ar

Kevin-Dev

暂无认证

  • 0浏览

    0关注

    544博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

【Android -- Material Design】CollapsingToolbarLayout 的基本使用

Kevin-Dev 发布时间:2021-03-02 14:09:11 ,浏览量:0

前言

本篇将介绍 CollapsingToolbarLayout 的一些功能和属性,使用其实现可折叠的 toolbar 效果。

效果图

在这里插入图片描述

代码实现

CollapsingToolbarLayout 是对Toolbar的包装并且实现了折叠app bar效果,使用时,要作为 AppbarLayout 的直接子View。CollapsingToolbarLayout 有以下特性:

1. Collapsing title(折叠标题) 当布局全部可见的时候,title 是最大的,当布局开始滑出屏幕,title 将变得越来越小,你可以通过setTitle(CharSequence) 来设置要显示的标题。

注意:Toolbar 和 CollapsingToolbarLayout 同时设置了title时,不会显示Toolbartitle而是显示CollapsingToolbarLayout 的 title,如果要显示Toolbar 的 title,你可一在代码中添加如下代码:

collapsingToolbarLayout.setTitle("");

2. Content scrim(内容纱布) 当 CollapsingToolbarLayout 滑动到一个确定的阀值时将显示或者隐藏内容纱布,可以通过 setContentScrim(Drawable) 来设置纱布的图片。

提示:纱布可以是图片也可以是颜色色值,如果要显示颜色,在xml 布局文件中用contentScrim属性添加,代码如下:

app:contentScrim="@color/colorPrimary"

3. Status bar scrim(状态栏纱布) 当 CollapsingToolbarLayout 滑动到一个确定的阀值时,状态栏显示或隐藏纱布,你可以通过 setStatusBarScrim(Drawable) 来设置纱布图片。

提示:同内容纱布一样,状态栏纱布可以是图片也可以是一个颜色值,如果要显示颜色值,在xml 中用statusBarScrim 属性指定。

4. Parallax scrolling children(有视差地滚动子View) 让 CollapsingToolbarLayout 的子 View 可以有视差的滚动,需要在 xml 中用 添加如下代码:

app:layout_collapseMode="parallax"

5. Pinned position children(固定子View的位置) 子 View 可以固定在全局空间内,这对于实现了折叠并且允许通过滚动布局来固定 Toolbar 这种情况非常有用。在 xml 中将 collapseMode 设为 pin,代码如下:

 app:layout_collapseMode="pin"
关注
打赏
1658837700
查看更多评论
立即登录/注册

微信扫码登录

0.0399s