1.和平常一樣,建立一個Moudle
- 在xml布局檔案中使用 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"
tools:context="com.example.test.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
</android.support.v7.widget.Toolbar>
</RelativeLayout>
3.java代碼中設定
注意
我們在使用 Toolbar 時候需要先隐藏掉系統原先的導航欄,網上很多人都說給Activity設定一個NoActionBar的Theme。但個人覺得有點小題大做了,是以這裡我直接在BaseActivity中調用
supportRequestWindowFeature(Window.FEATURE_NO_TITLE)
去掉了預設的導航欄.
注意,我的BaseActivity是繼承了AppCompatActivity的,如果是繼承Activity就應該調用
requestWindowFeature(Window.FEATURE_NO_TITLE
public class MainActivity extends AppCompatActivity
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
// toolbar.setNavigationIcon(R.mipmap.ic_launcher);//設定導航欄圖示
toolbar.setLogo(R.mipmap.ic_launcher);//設定app logo
toolbar.setTitle("Title");//設定主标題
toolbar.setSubtitle("Subtitle");//設定子标題
toolbar.inflateMenu(R.menu.activity_tool_bar);//設定右上角的填充菜單
//點選事件
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.action_item1:
//........
case R.id.action_item2:
//........
}
return true;
}
});
}
}
4.右上角的填充菜單檔案
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
<item
android:id="@+id/action_search"
android:icon="@mipmap/ic_action_search"
android:title="搜尋"
app:showAsAction="ifRoom"
<!--<item-->
<!--android:id="@+id/action_notification"-->
<!--android:icon="@mipmap/ic_error_page"-->
<!--android:title="通知"-->
<!--app:showAsAction="ifRoom" />-->
<item
android:id="@+id/action_item1"
android:title="item01"
app:showAsAction="never"
<item
android:id="@+id/action_item2"
android:title="item_02"
app:showAsAction="never"
</menu>
- app:showAsAction=”ifRoom”
如果Toolbar 有足夠控件就顯示出來,沒有就隐藏在下拉清單中
- app:showAsAction=”never”
不管有沒有足夠空間,都不顯示出來
- 效果圖
右上角三個點的圖示是黑色的,替換成白色方法如下,
@mipmap/ic_menu_more_overflow 就是白色點點
<resources>
...
...
<style name="Theme.ToolBar.ZhiHu" parent="Theme.AppCompat.Light.NoActionBar">item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.ZhiHu</item></style>
<style name="ActionButton.Overflow.ZhiHu" parent="android:style/Widget.Holo.Light.ActionButton.Overflow">item name="android:src">@mipmap/ic_menu_more_overflow</item></style>
</resources>
- Toolbar 引用擦樣式
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/color_0176da"
android:theme="@style/Theme.ToolBar.ZhiHu">
</android.support.v7.widget.Toolbar>