Android5.0新特性:Toolbar标题栏

Toolbar标题栏
Android 5.0最主要的变化就是采用了全新的Material Design界面。Material Design就是材质化设计,材质化设计指的是物体是有质地的,两个控件之间室友实体的,不允许互相穿墙,并且引入了Z轴的概念。

本篇主要讲解android 5.0新特性中的控件 Toolbar ,即标题栏的使用。

一.Toolbar的简介:
Toolbar是Android 5.0 新特性中新出的一个标题栏控件,是用来代替Android3.0中的ActionBar的。ActionBar的功能比较弱,并且显示出来的控件也不漂亮,大部分人都喜欢自定义一个组件来代替ActionBar,也就使得界面不统一、杂乱,在Android5.0 时谷歌推出Toolbar,在 material design 也对之做了名称的定义:App bar。Toolbar相对于ActionBar来说,更加的灵活,有更多的属性,不仅能够在页首,也可以放置在页面的其他部位,因此,使得页面趋向统一。

二.Toolbar的属性:

1. NavigationIcon: Toolbar左边的按钮,即返回键按钮,点击返回上一个界面。
2. Logo: Toolbar上的图标。
3. Title :主标题
4. SubTitle :副标题
5. Menu :Toolbar 的菜单栏
详细的使用可以在接下来的代码中看到,在这就不一一说明了。

三.Toolbar的简单使用步骤:
1.style的设置:
首先是 style中(res/values/styles.xml):修改为无标题,再添加其他属性,代码如下:


    
    



然后是style中 (res/values-v21/styles.xml):创建values-v21,styles.xml,继承values中的theme,代码如下:


    
以上是需要改动的有关style的部分,接下来是ui布局:

2.ui布局:
需要注意的是要使用v7包的Toolbar,代码如下:

    
    
android:background="?attr/colorPrimary" ,这样就可以使之延用 Actionbar 的颜色设定.

3.MainActivity的代码:
在代码中注释的非常详细了,就不单一说了,代码如下:
package com.example.star.toolbar.activity;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;

import com.example.star.toolbar.R;
import com.example.star.toolbar.utils.MyToast;

public class MainActivity extends AppCompatActivity {

    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //初始化控件
        initView();

        //设置Toolbar
        setToolbar();
    }

    /**
     * 设置Toolbar
     * 给Toolbar加入各种属性,并且设置为Toolbar
     */
    private void setToolbar() {
        //Logo
        toolbar.setLogo(R.drawable.ic_launcher);
        //Title 主标题
        toolbar.setTitle("主标题");
        //subTitle 副标题
        toolbar.setSubtitle("副标题");

        setSupportActionBar(toolbar);
        //返回键
        toolbar.setNavigationIcon(R.drawable.ic_launcher);

    }

    /**
     * 初始化控件
     * 这个地方可以用butterknife,简写代码。
     */
    private void initView() {
        toolbar = (Toolbar) findViewById(R.id.toolbar);
    }

    /**
     * Toolbar的菜单的添加
     * @param menu
     * @return
     */
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_main,menu);
        return true;
    }

    /**
     * Toolbar的菜单点击事件
     * @param item
     * @return
     */
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()){
            case R.id.menu_1:
                MyToast.show(this,"菜单1");
                break;
            case R.id.menu_2:
                MyToast.show(this,"菜单2");
                break;
            case R.id.menu_3:
                MyToast.show(this,"菜单3");
                break;
            default:
                break;
        }

        return true;
    }
}

接下来是显示的界面:
Android5.0新特性:Toolbar标题栏_第1张图片
下一张是点击菜单栏之后的界面:
Android5.0新特性:Toolbar标题栏_第2张图片

4.菜单栏menu的使用:
在res-menu-menu_main.xml中的代码:


    

    

    

item的id、title、icon属性就不用多说了,主要是showAsAction这个属性主要有几个值:
ifRoom:如果还有空余空间,就将icon显示在toolbar上。
always:一直显示icon。
never:从不显示icon。

写完menu之后,在MainActivity中重写onCreateOptionsMenu()方法以及onOptionsItemSelected()方法;详细代码在第三步中。

完成以上几步,关于Toolbar的简单应用就可以实现了。


你可能感兴趣的:(Android,5.0新特性)