前言
Toolbar在Android5.0之后被Google建议使用，它在MD设计风格里占有重要的一席之地，大势所趋，最近一段时间我就来学学Toolbar的花式使用方法！感谢两位道友的好文章http://www.jianshu.com/p/56c96fc7340f
http://www.jianshu.com/p/e6dd1aabfe65
自我见解
AppBarLayout、CollapsingToolbarLayout、Toolbar他们之间的关系是AppBarLayout--》CollapsingToolbarLayout--》Toolbar。AppBarLayout是在最外层的，CollapsingToolbarLayout可以折叠，Toolbar就是常见的那个Toolbar咯。CollapsingToolbarLayout的layout_scrollFlags可以设置几个属性值：
scroll - 想滚动就必须设置这个。
enterAlways - 实现quick return效果, 当向下移动时，立即显示View（比如Toolbar)。
exitUntilCollapsed - 向上滚动时收缩View，但可以固定Toolbar一直在上面。
enterAlwaysCollapsed - 当你的View已经设置minHeight属性又使用此标志时，你的View只能以最小高度进 入，只有当滚动视图到达顶部时才扩大到完整高度。
CollapsingToolbarLayout下面就可以设置布局了，它是继承自FrameLayout。除开Toolbar就是你自定义的东西了。
Toolbar其实也是相当于一种布局，继承自ViewGroup.如果想实现那种复杂的Toolbar布局可以考虑在下面放两个布局文件，像支付宝那种还是多美观实用的。未滑动之前我展示一个布局，滑动之后展示另外一个，节省出一大部分的空间。
AppBarLayout提供了一个监听它折叠的方法，因此我们可以通过它的改变来决定显示哪个布局,以及透明度的变化，以达到渐变的效果。这里值得注意的是getTotalScrollRange（）必须得是回调方法里的appBarLayout而不是你自己布局里的AppBarLayout，这两个是两个不一样的东西。回调方法里面的逻辑稍微理一下应该就能明白了
barLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() { //barLayout偏移量的监听
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
Log.e("verticalOffset", "verticalOffset--->" + verticalOffset);
Log.e("totalScrollRange", "appBarLayout.getTotalScrollRange()--->" + appBarLayout.getTotalScrollRange());
if (verticalOffset == 0) {
//张开
bar_1.setVisibility(View.VISIBLE);
bar_2.setVisibility(View.GONE);
setToolbar1Alpha(255);
toolbar.setAlpha(1);
} else if (Math.abs(verticalOffset) >= appBarLayout.getTotalScrollRange()) {
//收缩
bar_1.setVisibility(View.GONE);
bar_2.setVisibility(View.VISIBLE);
setToolbar2Alpha(255);
toolbar.setAlpha(1);
} else {
Log.e("Math", "Math.abs(verticalOffset)--->" + Math.abs(verticalOffset));
double percent = (double) Math.abs(verticalOffset) / (double) appBarLayout.getTotalScrollRange();
if (percent > 0.5 && percent <= 1) {
int alpha = (int) ((percent - 0.5) * 2 * 255);
bar_1.setVisibility(View.GONE);
bar_2.setVisibility(View.VISIBLE);
setToolbar2Alpha(Math.abs(alpha));
toolbar.setAlpha((float) ((percent - 0.5) * 2));
} else {
int alpha = (int) ((0.5 - percent) * 2 * 255);
bar_1.setVisibility(View.VISIBLE);
bar_2.setVisibility(View.GONE);
setToolbar1Alpha(alpha);
toolbar.setAlpha((float) ((0.5 - percent) * 2));
}
}
}
});
另外一个重点来了，比如说我CollapsingToolbarLayout里的子View存在一个图片，我想把Toolbar的颜色设置成与它类似，这样看起来比较同意嘛，美观，那怎么办呢。这个时候就是另一个比较牛B的东西登场了：Palette。
它可以根据你的图片来得到集中跟图片相关的颜色：
Vibrant：充满活力的
Vibrant dark 活力黑
Vibrant light 活力亮
Muted 柔和的
Muted dark 柔和的黑
Muted light 柔和的亮
要注意这里得到的有可能是Null,所以你得判断下。
我这人是这么写的
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.duolaameng);
Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
@Override
public void onGenerated(Palette palette) {
//这里我们获取的是图片充满活力的黑的色调
List<Palette.Swatch> swatchs = palette.getSwatches();
Palette.Swatch swatch = null;
if (null != swatchs && swatchs.size() != 0) {
swatch = swatchs.get(0);
}
//设置Toolbar颜色
if (swatch == null) {
return;
}
barLayout.setBackgroundColor(swatch.getRgb());
getSupportActionBar().setBackgroundDrawable(new ColorDrawable(swatch.getRgb()));
//设置系统状态栏颜色
getWindow().setStatusBarColor(swatch.getRgb());
}
});
我这里不是直接拿的某一类的，我是直接拿的所有的然后取得第一个。
这次的笔记就弄到这儿吧，挺有意思的，下次想想如何实现像网易云音乐那种画上去后Toolbar的背景是下面图片的底部部分
代码地址：https://github.com/developerLzh/CollapsingToollayoutExp
[1]
