这篇文章主要为大家详细介绍了安卓5.0折叠工具栏布局使用,感兴趣的小伙伴们可以参考一下
折叠工具栏布局作用是提供了一个可以折叠的工具栏,它继承至框架布局,给它设置布局_滚动标志它可以控制包含在折叠工具栏布局中的控件(如:图像视图,工具栏)在响应布局_行为事件时作出相应的滚动标志滚动事件(移除屏幕或固定在屏幕顶端)。
使用CollapsingToolbarLayout:
安卓。支持。设计。小部件。应用程序栏布局
Android:layout _ width=' match _ parent '
android:layout_height='256dp '
Android:fitsSystemWindows=' true '
安卓。支持。设计。小部件。折叠工具栏布局
Android:id=' @ id/collapsing _ toolbar _ layout '
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
应用程序:contentScrim='#30469b '
app:expandedTitleMarginStart=' 48dp '
app:layout _ scroll flags=' scroll | exituntillcollapsed '
图像视图
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
android:scaleType='centerCrop '
android:src='@mipmap/bg '
app:layout _ collapse模式=' parallax '
app:layout _ collapseParallaxMultiplier=' 0.7 '/
安卓。支持。V7。小部件。工具栏
android:id='@ id/toolbar '
Android:layout _ width=' match _ parent '
android:layout_height='?'' attr/actionBarSize '
app:layout_collapseMode='pin' /
/安卓。支持。设计。小部件。折叠工具栏布局
/安卓。支持。设计。小部件。应用程序栏布局
我们在折叠工具栏布局中设置了一个图像视图和一个工具栏。并把这个折叠工具栏布局放到AppBarLayout中作为一个整体。
1、在折叠工具栏布局中:
我们设置了布局_滚动标志:关于它的值我这里再说一下:
滚动-想滚动就必须设置这个。
总是输入-实现快速返回效果,当向下移动时,立即显示查看(比如工具栏).
exituntillcollapsed向上滚动时收缩查看,但可以固定工具栏一直在上面。
输入总是折叠-当你的视角已经设置米恩海特属性又使用此标志时,你的视角只能以最小高度进入,只有当滚动视图到达顶部时才扩大到完整高度。
其中还设置了一些属性,简要说明一下:
内容稀松布-设置当完全折叠工具栏布局折叠(收缩)后的背景颜色。
expandedTitleMarginStart -设置扩张时候(还没有收缩时)标题向左填充的距离。
没扩张时候如图:
2、在图像视图控件中:
我们设置了:
布局_折叠模式(折叠模式) - 有两个值:
pin -设置为这个模式时,当折叠工具栏布局完全收缩后,工具栏还可以保留在屏幕上。
视差-设置为这个模式时,在内容滚动时,折叠工具栏布局中的查看(比如ImageView)也可以同时滚动,实现视差滚动效果,通常和layout _ collapseParallaxMultiplier(设置视差因子)搭配使用。
layout _ collapseParallaxMultiplier(视差因子) - 设置视差滚动因子,值为:0~1。
3、在工具栏控件中:
我们设置了布局_折叠模式(折叠模式):为别针。
综上分析:当设置了布局_行为的控件响应起了折叠工具栏布局中的布局_滚动标志事件时,图像视图会有视差效果的向上滚动移除屏幕,当开始折叠时折叠工具栏布局的背景色(也就是工具栏的背景色)就会变为我们设置好的背景色,工具栏也一直会固定在最顶端。
效果如图:
【注】:使用折叠工具栏布局时必须把标题设置到折叠工具栏布局上,设置到工具栏上不会显示。即:
mcollapsingtoolbarlayout。设置标题(" ");
该变标题的字体颜色:
扩张时候的标题颜色:mcollapsingtoolbarlayout。setexpandtitlecolor();
收缩后在工具栏上显示时的标题的颜色:mcollapsingtoolbarlayout。setcollapsedtitletextcolor();
这个颜色的过度变化其实折叠工具栏布局已经帮我们做好,它会自动的过度,比如我们把收缩后的标题颜色设为绿色,效果如图:
没录好,反正效果出来了。
接下来看看代码怎么实现吧:
布局文件:
安卓。支持。设计。小部件。协调器布局
xmlns:Android=' http://模式。安卓。' com/apk/RES/Android '
xmlns:app=' http://模式。安卓。' com/apk/RES-auto '
xmlns:tools=' http://模式。安卓。' com/tools '
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
工具:上下文='。'主要活动'
安卓。支持。设计。小部件。应用程序栏布局
Android:layout _ width=' match _ parent '
android:layout_height='256dp '
Android:fitsSystemWindows=' true '
安卓。支持。设计。小部件。折叠工具栏布局
Android:id=' @ id/collapsing _ toolbar _ layout '
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
应用程序:contentScrim='#30469b '
app:expandedTitleMarginStart=' 48dp '
app:layout _ scroll flags=' scroll | exituntillcollapsed '
图像视图
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
android:scaleType='centerCrop '
android:src='@mipmap/bg '
app:layout _ collapse模式=' parallax '
app:layout _ collapseParallaxMultiplier=' 0.7 '/
安卓。支持。V7。小部件。工具栏
android:id='@ id/toolbar '
Android:layout _ width=' match _ parent '
android:layout_height='?'' attr/actionBarSize '
app:layout_collapseMode='pin' /
/安卓。支持。设计。小部件。折叠工具栏布局
/安卓。支持。设计。小部件。应用程序栏布局
线性布局
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
安卓:方向='垂直'
app:layout _ behavior=' @ string/app bar _ scrolling _ view _ behavior '
安卓。支持。V7。小部件。回收视图
Android:id=' @ id/recycle view '
Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent '
安卓系统:滚动条='无'/
/线性布局
/安卓。支持。设计。小部件。协调器布局
代码文件:
Toolbar mToolbar=(Toolbar)findViewById(r . id。工具栏);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
mtoolbar。setnavigationonclicklistener(新视图OnClickListener() {
@覆盖
公共void onClick(视图五){
onBackPressed();
}
});
//使用折叠工具栏布局必须把标题设置到折叠工具栏布局上,设置到工具栏上则不会显示
CollapsingToolbarLayout mCollapsingToolbarLayout=(CollapsingToolbarLayout)findViewById(r . id。折叠_工具栏_布局);
mcollapsingtoolbarlayout。设置标题(' CollapsingToolbarLayout ');
//通过折叠工具栏布局修改字体颜色
mcollapsingtoolbarlayout。setexpandtitlecolor(Color .白色);//设置还没收缩时状态下字体颜色
mcollapsingtoolbarlayout。setcollapsedtitletextcolor(Color .绿色);//设置收缩后工具栏上字体的颜色
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。