美好头标ToolBar
ActionBar我相信是每一位合格的程序员都用过的组件,也是每一个程序员都会抱怨的组件,因为他不能实现复杂的自定义。为此Google推出了比ActionBar更为美好的组件ToolBar。
本文重点讲述Android Toolbar的用法,包括它的一些概念和注意事项,现在总结出来分享给Android程序员兄弟们。本文的例子都是基于Android5.0+。
Toolbar
Toolbar是什么?大概说一下它的官方介绍。Toolbar是应用的内容的标准工具栏,可以说是Actionbar的升级版,两者不是独立关系,要使用Toolbar还是得跟ActionBar扯上关系的。相比Actionbar Toolbar最明显的一点就是变得很自由,可随处放置,因为它是作为一个ViewGroup来定义使用的,所以单纯使用ActionBar已经稍显过时了,它的一些方法已被标注过时。
那么它怎么使用呢,首先我们一样要用到v7的支持包,然后定义程序的主题样式,在style里得先把Actionbar去掉,有点像欲想练功,必先自宫的感觉啊。如下:
/res/values/styles.xml
去除Actionbar最简单的方法就是直接继承NoActionBar的主题了。颜色的属性说明,还是下面这张图最清楚了:
另外,SearchView在AppCompat中提供了更强的可定制性和更多的样式可供设置,不过一般我们用默认的就行。
还有我们可以在values-v21给API21的系统版本设置默认的底部导航栏默认的颜色:
/res/values-v21/styles.xml
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229101824042-245535436.png)
设置好主题的下一步工作:
在xml的layout中定义一个Toolbar:
/layout/toolbar.xml
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229101911745-1548205092.png)
我们把toolbar作为一个独立的布局xml,方便在其他布局里include进去。可以看到我们在这里是可以设置Toolbar的属性的,初上面的外还有以下的属性,都是见名知意的就不一一说明了。
然后在activity的布局里把它include进去就行了,当然一般把它放到最上面了,有需要你是可以把它放到中间、底部或其它位置的,可见它的自由度是很高的。在下一步呢就到代码了,在onCreate中:
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229102031479-1178944965.png)
上面关键的一点就是setSupportActionBar(mToolbar);把Toolbar当做ActionBar给设置了。menu还是可以像ActionBar一样用和处理的:
res/menu/main.xml
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229102318245-1957277806.png)
这一步时候程序的样子: PS. Genymotion可以用5.0的模拟器了
可以感觉到这样是不是和ActionBar没什么区别呢。诶,左边的菜单图标怎么出来的呢,其实上面还没处理到,他就是Navigation drawer了,使用新版本的v4、v7库的drawer明显的一点是它带了一个酷酷的交互动画(请看最后的gif图)。那么使用Toolbar之后又怎么去在Toolbar中使用drawer呢。下面当然也是跟着代码来.
/layout/activity_main.xml
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229102514307-2039541937.png)
Pager的东西可以先忽略,后面会说到。侧滑菜单的内容为简单起见直接先用图片来演示了。可以看到布局的设置大同小异,不同点在代码中:
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229102704401-629211569.png)
先把图标设置显示出来,然后把ActionBarDrawerToggle作为DrawerLayout的监听器设置进去,还是比较简单的,效果:
要是需要把drawer覆盖toolbar怎么办呢?需要稍微调整一下界面的布局位置就行了,效果就不贴上来了(脑补,或者改下源码的setContentView运行):
![](https://images2015.cnblogs.com/blog/832454/201512/832454-20151229103334464-1777011252.png)
Demo源码下载地址:http://download.csdn.net/detail/bbld_/8191251
依赖库android-support-v7-appcompat.rar with Palette : http://download.csdn.net/detail/bbld_/8382913