AndroidToolbar学习

2019年6月7日 207次阅读 来源: 跑步与开车

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

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的风格

<style name="AppTheme.Base" parent="Theme.AppCompat">    
<item name="android:windowActionBar">false</item>    
<item name="android:windowNoTitle">true</item>
</style>

这里试用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里面添加

<android.support.v7.widget.Toolbar
android:id=”@+id/toolbar”
android:background=”@android:color/white”
android:layout_height=”wrap_content”
android:layout_width=”match_parent”>
</android.support.v7.widget.Toolbar>


###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)

<style name=”AppTheme.Base” parent=”Theme.AppCompat”>
<item name=”windowActionBar”>false</item>
<item name=”windowNoTitle”>true</item>
<item name=”colorPrimary”>@color/colorPrimary</item>
<item name=”colorPrimaryDark”>@color/colorPrimaryDark</item>
<item name=”colorAccent”>@color/colorAccent</item>
<item name=”android:windowBackground”>@color/windowBackground</item></style>


二是v21(res/values-v21/styles.xml)中

<style name=”AppTheme” parent=”AppTheme.Base”>

<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，否则界面看起来是模糊的 **
    原文作者：跑步与开车
    原文地址: https://www.jianshu.com/p/f5c4b4a89e70
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞