Toolbar使用概述

一. Toolbar

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="44dp"
    android:background="@color/colorPrimary"
    app:navigationIcon="@drawable/ic_back" <-- toolbar返回icon設(shè)置 -->
    app:popupTheme="@style/ToolbarPopupTheme"> <-- 更多menu配置 -- >
    <TextView
        android:id="@+id/toolbar_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textColor="@color/white" />
</android.support.v7.widget.Toolbar>
app:popupTheme

menu主題配置(主要配置是否顯示在toolbar下顯示,以及menu相關(guān)屬性)
注:建議點(diǎn)擊菜單彈出PopupMenu 或 PopupWindow來替代系統(tǒng)默認(rèn)menu,以滿足需求。

需要在value-21 以及value包下,都配置popupTheme主題,達(dá)到適配目的
 <style name="ToolbarPopupTheme" parent="ThemeOverlay.AppCompat.Dark">
    <item name="actionOverflowMenuStyle">@style/OverFlowMenu</item>
    <!--popupMenu item 點(diǎn)擊背景設(shè)置-->
    <item name="android:itemBackground">@drawable/popup_menu_item_slt</item>
    <!--popupMenu 寬度設(shè)置-->
    <item name="android:width">80dp</item>
    <!--popupMenu item中字體顏色設(shè)置-->
    <item name="android:textSize">16sp</item>
    <item name="android:textColor">@color/gray_900</item>
</style>

<style name="OverFlowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
    <!--false在toolbar下顯示-->
    <item name="android:overlapAnchor">false</item>
    <!--popupMenu背景-->
    <item name="android:popupBackground">@color/gray_600</item>
    <!-- 彈出層水平方向上的偏移,即距離屏幕左邊的距離,負(fù)值會導(dǎo)致右邊出現(xiàn)空隙 -->
    <item name="android:dropDownHorizontalOffset">0dp</item>
    <!-- 彈出層垂直方向上的偏移,即在豎直方向上距離Toolbar的距離,值為負(fù)則會蓋住Toolbar -->
    <item name="android:dropDownVerticalOffset">0dp</item>
</style>

二. Toolbar使用

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    TextView title = (TextView) findViewById(R.id.toolbar_title);
    setSupportActionBar(toolbar);
    ActionBar actionBar = getSupportActionBar();
    actionBar.setDisplayShowTitleEnabled(false);
    actionBar.setDisplayHomeAsUpEnabled(false);
    title.setText("自定義標(biāo)題");
    toolbar.setOverflowIcon(AppCompatResources.getDrawable(this, R.drawable.ic_more));
1. actionBar.setDisplayShowTitleEnabled(false);

控制toolbar的title是否顯示,默認(rèn)顯示app label

2. actionBar.setDisplayHomeAsUpEnabled(false);

控制返回按鈕是否顯示

3. toolbar.setOverflowIcon(AppCompatResources.getDrawable(this, R.drawable.ic_more));

自定義更多按鈕圖標(biāo)

三. menu使用

加載menu布局
@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.main_toolbar_menu, menu);
    return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
        case R.id.setting:
            Toast.makeText(this, "設(shè)置", Toast.LENGTH_SHORT).show();
            break;
    }
    return true;
}

在menu目錄下建菜單xml

<item
    android:id="@+id/setting"
    android:orderInCategory="1"
    android:icon="@drawable/ic_back"
    android:title="設(shè)置"
    app:showAsAction="never"/>
1. android:orderInCategory作用:item排序,int值,值越小越靠前

菜單默認(rèn)按照item順序顯示

2. app:showAsAction作用:是否顯示在toolbar上,常用取值always、never

always: item顯示在toolbar上
never:item不顯示在toolbar上

3. android:icon:item設(shè)置icon后,顯示圖片,不顯示文字
圖一

圖二

圖3

圖一:正常顯示,app:showAsAction="never"
圖二:配置圖片,并且app:showAsAction="always"
圖三:xml中只包含一個item,并且app:showAsAction="always"

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容