簡介
Toolbar是在 Android 5.0 開始推出的一個 Material Design 風(fēng)格的導(dǎo)航控件 用來取代之前的 Actionbar
Toolbar支持：
- 設(shè)置導(dǎo)航欄圖標(biāo)
- 設(shè)置App的logo
- 支持設(shè)置標(biāo)題和子標(biāo)題
- 支持添加一個或多個的自定義控件
- 支持Action Menu
實踐說明
默認(rèn)情況下Activity是有一個ActionBar的
如何刪除這個ActionBar呢碰声？
首先在styles文件中自定義一個style
<style name="MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
然后在對應(yīng)Activity清單文件中配置
<activity
android:name=".FirstToolbarActivity"
android:theme="@style/MyTheme"/>
第一種樣式
布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
app:navigationIcon="@mipmap/ic_book_list"
app:titleTextColor="@color/white"
app:theme="@style/CustomToolbarTheme">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:text="標(biāo)題"
android:textColor="@android:color/white"
android:textSize="16sp"/>
</android.support.v7.widget.Toolbar>
</RelativeLayout>
FirstToolbarActivity.java
package com.zhoujian.toolbar;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
/**
* Created by zhoujian on 2017/3/8.
*/
public class FirstToolbarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_first);
initView();
}
private void initView()
{
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
// 設(shè)置navigation button 點擊事件
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
//設(shè)置menu
toolbar.inflateMenu(R.menu.menu_item);
// 設(shè)置溢出菜單的圖標(biāo)
toolbar.setOverflowIcon(getResources().getDrawable(R.mipmap.icon_menu));
// 設(shè)置menu item 點擊事件
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.item_collect:
//點擊設(shè)置
Toast.makeText(FirstToolbarActivity.this, "按鈕被點擊了", Toast.LENGTH_SHORT).show();
break;
case R.id.item_talk:
//點擊設(shè)置
Toast.makeText(FirstToolbarActivity.this, "發(fā)起群聊點擊了", Toast.LENGTH_SHORT).show();
break;
case R.id.item_add:
//點擊設(shè)置
Toast.makeText(FirstToolbarActivity.this, "添加朋友被點擊了", Toast.LENGTH_SHORT).show();
break;
}
return false;
}
});
}
}
顯示效果：
a.png
第二種樣式
布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:toolbar="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
toolbar:logo="@mipmap/ic_launcher"
toolbar:navigationIcon="@mipmap/ic_book_list"
toolbar:subtitle="小標(biāo)題"
toolbar:theme="@style/CustomToolbarTheme"
toolbar:title="大標(biāo)題"
toolbar:titleMarginStart="20dp"
toolbar:titleTextColor="@color/white">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:text="我的"
android:textColor="@color/white"
android:textSize="14sp"/>
</android.support.v7.widget.Toolbar>
</RelativeLayout>
SecondToolbarActivity.java
package com.zhoujian.toolbar;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
/**
* Created by zhoujian on 2017/3/8.
*/
public class SecondToolbarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_second);
initView();
}
private void initView()
{
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
// 設(shè)置navigation button 點擊事件
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
//設(shè)置menu
toolbar.inflateMenu(R.menu.menu_item);
// 設(shè)置溢出菜單的圖標(biāo)
toolbar.setOverflowIcon(getResources().getDrawable(R.mipmap.icon_menu));
// 設(shè)置menu item 點擊事件
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.item_collect:
//點擊設(shè)置
Toast.makeText(SecondToolbarActivity.this, "按鈕被點擊了", Toast.LENGTH_SHORT).show();
break;
case R.id.item_talk:
//點擊設(shè)置
Toast.makeText(SecondToolbarActivity.this, "發(fā)起群聊點擊了", Toast.LENGTH_SHORT).show();
break;
case R.id.item_add:
//點擊設(shè)置
Toast.makeText(SecondToolbarActivity.this, "添加朋友被點擊了", Toast.LENGTH_SHORT).show();
break;
}
return false;
}
});
}
}
顯示效果：
b.png
第三種樣式
布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:toolbar="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
toolbar:title="使用實例"
toolbar:navigationIcon="@mipmap/ic_book_list"
toolbar:titleTextColor="@color/white"
toolbar:theme="@style/CustomToolbarTheme">
</android.support.v7.widget.Toolbar>
</RelativeLayout>
ThirdToolbarActivity.java
package com.zhoujian.toolbar;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
/**
* Created by zhoujian on 2017/3/8.
*/
public class ThirdToolbarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_third);
initView();
}
private void initView()
{
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
// 設(shè)置navigation button 點擊事件
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
//設(shè)置 Toolbar menu
toolbar.inflateMenu(R.menu.toolbar_menu);
// 設(shè)置溢出菜單的圖標(biāo)
toolbar.setOverflowIcon(getResources().getDrawable(R.mipmap.icon_menu));
// 設(shè)置menu item 點擊事件
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.publish:
//點擊設(shè)置
Toast.makeText(ThirdToolbarActivity.this, "發(fā)布按鈕被點擊了", Toast.LENGTH_SHORT).show();
break;
}
return false;
}
});
}
}
顯示效果：
c.png
第四種樣式
布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:toolbar="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
toolbar:navigationIcon="@mipmap/ic_book_list"
toolbar:theme="@style/CustomToolbarTheme"
toolbar:titleTextColor="@color/white">
<EditText
android:id="@+id/edit_search"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="@color/white"/>
</android.support.v7.widget.Toolbar>
</RelativeLayout>
FourthToolbarActivity.java
package com.zhoujian.toolbar;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
/**
* Created by zhoujian on 2017/3/8.
*/
public class FourthToolbarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_four);
initView();
}
private void initView()
{
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
// 設(shè)置navigation button點擊事件
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
//設(shè)置menu
toolbar.inflateMenu(R.menu.menu_search);
// 設(shè)置溢出菜單的圖標(biāo)
toolbar.setOverflowIcon(getResources().getDrawable(R.mipmap.icon_menu));
// 設(shè)置menu item 點擊事件
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.item_search:
//點擊設(shè)置
Toast.makeText(FourthToolbarActivity.this, "搜索按鈕被點擊了", Toast.LENGTH_SHORT).show();
break;
}
return false;
}
});
}
}
顯示效果：
d.png
