Android Toolbar 学习

参考博客地址:原博客地址

1.概述:

Android3.0 Android推了ActionBar这个控件,而到了2013年Google开始大力推动所谓的AndroidStyle,想要逐渐改善过去纷乱的android界面设计,希望让Android终端使用者尽可能在android手机里有一个一致的体验,ActionBar过去最多人使用的两大套件就是ActionBarSharelock,及官方在support library v7里的AppCompat.

既然介绍Toolbar,也意味着官方在某些程度上认为ActionBar限制了android app的开发与设计的弹性,而在material design也对之做了名称的定义:App bar,那么如何在android app中用toolbar这个控件来做出一个基本的app bar

2.基础套用

2.1风格

风格要调整的地方有二:
- 一在res/values/styles.xml里面
- 二在res/values-21/styles.xml里面

为了之后的方便,先在values/styles.xml里增加一个名为AppTheme.Base的风格

“`

false
true

这里试用AndroidAPI22和以上要去掉"android:"否则会报错

AppCompat does not support the current theme features: { windowActionBar: false, windowActionBarOverlay: false, android:windowIsFloating: false, windowActionModeOverlay: false, windowNoTitle: false }“`

因为此范例只要用Toolbar,所以我们要让原本的ActionBar隐藏起来,然后将原本的AppTheme的parent属性改为上面的AppTheme.Base

2.2.界面

在activity_main里面添加

“`


###2.3Java程序
在Activity里面加入ToolBar声明:
>```
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

3.自定义颜色

  • colorPrimaryDark(状态栏底色):在风格(style)或者主题(Theme)里设定
  • AppBar底色
    这个设定分为二,若你的android app仍然是使用ActionBar,则直接在风格(style)或者主题(themes)里面设定colorPrimary参数即可;
    可视若采用Toolbar的话,则要在界面(layout)里面设置Toolbar的background属性.
  • navigationBarColor(导航栏底色):仅能在API21+也就是Android5.0之后的版本使用,因此要将之设定在res/values-21/styles.xml里面

  • 主视窗底色:windowBackground
    所以我们在这里设置的地方有三,一是style中(res/values/styles.xml)

    “`

    false
    true
    @color/colorPrimary
    @color/colorPrimaryDark
    @color/colorAccent


二是v21(res/values-v21/styles.xml)中
>```
<style name="AppTheme" parent="AppTheme.Base">    
<!-- Customize your theme here. -->    
<item name="android:navigationBarColor">@color/colorAccent</item>
</style>```

三是本篇主角Toolbar的background设定
>```
<android.support.v7.widget.Toolbar   
  android:background="@color/toolbar"    
  android:id="@+id/toolbar"    
  android:layout_height="wrap_content"    
  android:layout_width="match_parent">
</android.support.v7.widget.Toolbar>

toolbar是设定在activity_main.xml中,对其设定值background属性可以设定为

android:background="?attr/colorPrimary" 

这样就可以沿用ActionBar的颜色设定了

4控件(Compoment)

大概来说,预设常用的几个元素:
- setNavigationIcon:即设定up Button的图标
- setLogo:设定APP的图标
- setTitle:主标题
- setSubtitle:副标题
- setOnMenuItemClickListener:设定菜单各按钮的动作

写代码
除了菜单以外的部分

“`
Toolbar toolbar =(Toolbar)findViewById(R.id.toolbar);
//AppLogo
toolbar.setLogo(R.drawable.ic_launcher);
//Title
toolbar.setTitle(R.string.app_name);
//SubTitle
toolbar.setSubtitle(“subtitle”);
setSupportActionBar(toolbar);
//navigationIcon必须在setSupportActionBar之后才会有作用
//否则会出现backButton
toolbar.setNavigationIcon(R.drawable.ab_android);

菜单部分
需要先在res/menu/menu_main.xml作定义
>```
<menu    
xmlns:android="http://schemas.android.com/apk/res/android"    
xmlns:app="http://schemas.android.com/apk/res-auto"    
xmlns:tools="http://schemas.android.com/tools"    
tools:context=".ToolbarActivity"    >    
<item        
android:id="@+id/action_edit"        
android:title="@string/action_edit"        
android:orderInCategory="80"        
android:icon="@drawable/ab_edit"        
app:showAsAction="ifRoom"/>    
<item        
android:id="@+id/action_share"        
android:title="@string/action_share"        
android:orderInCategory="90"        
android:icon="@drawable/ab_share"        
app:showAsAction="ifRoom"/>    
<item        
android:id="@+id/action_setting"        
android:title="@string/action_setting"        
android:orderInCategory="100"        
app:showAsAction="never"/>
</menu>

回到Activity写OnMenuItemClickListener

“`
public boolean onMenuItemClick(MenuItem item) {
String message = “”
switch (item.getItemId()){
case R.id.action_edit:
message += “”;
break;
case R.id.action_share:
message += “”;
break;
case R.id.action_setting:
message += “”;
break;
}
if (!message.equals(“”))
Toast.makeText(this,message,Toast.LENGTH_SHORT).show();
return true;
}


这个是让Activity实现了OnMenuItemClickListener,复写的方法,然后将这个监听器设置给Toolbar
toolbar.setOnMenuItemClickListener(this);“`
和 setNavigationIcon 一样,需要將之设定在 setSupportActionBar 之后才有作用。

做个简单的说明:
- colorPrimaryDark
状态栏背景色。在 style 的属性中设置。
- textColorPrimary
App bar 上的标题与更多菜单中的文字颜色。
在 style 的属性中设置。
- App bar 的背景色
Actionbar 的背景色设定在 style 中的 colorPrimary。
Toolbar 的背景色在layout文件中设置background属性。
- colorAccent
各控制元件(如:check box、switch 或是 radoi) 被勾选 (checked) 或是选定 (selected) 的颜色。
在 style 的属性中设置。
- colorControlNormal
各控制元件的预设颜色。
在 style 的属性中设置
- windowBackground
App 的背景色。
在 style 的属性中设置
- navigationBarColor
导航栏的背景色,但只能用在 API Level 21 (Android 5) 以上的版本
在 style 的属性中设置
最后需要注意的是:使用material主题的时候,必须设定targetSdkVersion =21,否则界面看起来是模糊的                                

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值