Android 5.x Material design 之 To

作者: kmzhao | 来源:发表于2016-01-21 17:25 被阅读499次

ToolBar的概述

  • 说到ToolBar,它其实API21发布的新控件,是以前我们熟悉的ActionBar的替代者。它其实是一个自定义的View,所以可以加载到布局文件中的任何地方咯~
  • 它和ActionBar的区别主要有以下几点:
    • 作为一个view,可以放在布局任何地方,更容易管理
    • 在同一个Activity中可以摆放多个ToolBar

最基本的用法

  • 1, 首先在style.xml文件中,的主题设置为 不支持ActionBar的主题,类似于下面这个,默认他是支持ActionBar的主题
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"/>
  • 2, 在布局文件中引入ToolBar,注意的是引入的v7包中的,所以它支持到api7版本,给ToolBar加了一个背景颜色。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout     xmlns:android="http://schemas.android.com/apk/res/android"      xmlns:tools="http://schemas.android.com/tools"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    >    

      <android.support.v7.widget.Toolbar
          android:id="@+id/toolbar"          
          android:layout_width="match_parent"        
          android:layout_height="wrap_content"        
          android:background="#69f"/>
</RelativeLayout>
  • 3,看代码中的逻辑
  • 首先是onCreate方法中就两行代码,得到对象,然后调用方法setSupportAcionBar()支持ActionBar模式即可。
@Override
protected void onCreate(Bundle savedInstanceState) {    
        super.onCreate(savedInstanceState);    
        setContentView(R.layout.activity_main);    
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);    
        setSupportActionBar(toolbar);
}    
  • 然后调用onCreateOptionsMenu方法设置ToolBar中的内容即可
@Override
public boolean onCreateOptionsMenu(Menu menu) {    
    getMenuInflater().inflate(R.menu.menu_toolbar, menu);    
    return true;
}
  • 当然menu中的menu_toolbar.xml文件可以自己设置
<menu xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:app="http://schemas.android.com/apk/res-auto">    
      <item        
          android:id="@+id/item1"        
          android:icon="@android:drawable/ic_menu_zoom"        
          android:title="@string/item1"  
          app:showAsAction="ifRoom"/>
      <item
          android:id="@+id/item2"        
          android:icon="@android:drawable/ic_menu_set_as"        
          android:title="setting"
        app:showAsAction="never"/>
</menu>
  • 4,最后看一下展示效果吧
C130CC90-5948-407A-9EDC-2668330C3DEE.png

相关文章

网友评论

本文标题:Android 5.x Material design 之 To

本文链接:https://www.haomeiwen.com/subject/kkilkttx.html