Android Studio精彩案例(七)《ToolBar使用詳解》

轉載本專欄文章,請註明出處,尊重原創 。文章博客地址:道龍的博客

本文參考博客:http://blog.csdn.net/h_zhang/article/details/51232773

        http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1118/2006.html



Android5.x以後谷歌大力推崇Material Design設計,有意統一之前Android style風格亂象的情況。上一篇博客我們學習了ActionBar的使用,因爲以前很多方式都會對ActionBar做深度定製,使用起來不是很方便,toolbar 作爲 android 5.x 引入的一個新控件,可以理解爲是ActionBar的升級版,大大擴展了Actionbar,使用更靈活,不像actionbar那麼固定,所以單純使用ActionBar已經稍顯過時了,它的一些方法已被標註過時。Toolbar更像是一般的View元素,可以被放置在view樹體系的任意位置,可以應用動畫,可以跟着scrollView滾動,可以與佈局中的其他view交互,等總之很強大。。這篇文章來介紹Android5.x新特性之 Toolbar和Theme的使用,參考了許多博文,和書籍,在此對其做一個總結,從零開始,教您學會使用ToolBar。

應用程序中使用app bar可有如下優點: 
1. 可以顯示出用戶所處的當前位置; 
2. 可以提供一些重要的交互操作,比如搜索(search)操作; 
3. 可以實現導航功能,讓用戶快速回到Home Activity;

本文就主要介紹一下Android Toolbar的使用方法。

我們先來看一張圖片,因爲在下面你會不斷地遇到這個圖片中的內容


簡單解釋一下屬性意義:

colorPrimaryDark狀態欄的顏色(可用來實現沉浸效果)

colorPrimary:Toolbar的背景顏色 (xml中用android:background=”?attr/colorPrimary”指定)

android:textColorPrimaryToolbar中文字的顏色,設置後Menu Item的字體顏色也會跟隨

colorAccentEditText正在輸入時,RadioButton選中時的顏色

windowBackground:底部導航欄的顏色

app:title=”App Title”Toolbar中的App Title

app:subtitle=”Sub Title” Toobar中的小標題

app:navigationIcon=”@android:drawable/ic_menu_sort_by_size” : 導航圖標(注意和Logo的區別)


我們從以下幾個點了解Toolbar的使用

  1. Toolbar的基礎使用
  2. Toolbar配置主題Theme
  3. Toolbar中常用的控件設置
  4. Toolbar的自定義

Toolbar的基礎使用

我們從以下幾點來一步一步的學習Toolbar的使用

  1. Style(風格)
  2. Layout(佈局)
  3. Activity(代碼)

Style(風格)

爲了能在你的Activity中使用Toolbar,你必須在工程裏修改styles.xml文件裏的主題風格,系統默認如下

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

這種Theme表示使用系統之前的ActionBar,那麼我們想要使用Toolbar怎麼辦呢?
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

我們還需要隱藏默認的ActionBar,否則會報如下錯誤:

Caused by: java.lang.IllegalStateException: This Activity already has an action bar 
supplied by the window decor. Do not request Window.FEATURE_SUPPORT_ACTION_BAR and set 
windowActionBar to false in your theme to use a Toolbar instead.

這個主題表示不使用系統的Actionbar了,這是第一步。

Layout佈局

<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=".MainActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        >
    </android.support.v7.widget.Toolbar>

</RelativeLayout>

爲了在你的UI中使用Toolbar,你得爲每個activity佈局添加Toolbar,並且給Toolbar設置一個id android:id=”@+id/toolbar”。這是第二部。其中高度指定爲了ActionBar大小

Activity(代碼)

 Toolbar toolbar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        toolbar = findView(R.id.toolbar);
        setSupportActionBar(toolbar);
    }

代碼中通過findView找到Toolbar,然後通過setSupportActionBar(toolbar);將Toolbar設置爲Activity的導航欄。

通過上面的三個步驟,你就已經使用了Support v7提供的Toolbar了。看看那效果圖。

這裏寫圖片描述

是不是感覺很醜?沒有一點MD設計的風格,而且還有一個問題,爲什麼跟Action有這麼大的差距?那麼先來穿插的解決這個問題。還要注意點,默認的title是項目名稱。然後加入Menu:

步驟如下:

打開Android studio會發現如圖所示,沒有Menu文件:


這時我們需要Menu文件,怎麼辦呢?

做法如下:


點擊進去後會出現如下界面:


點擊OK,就創建成功,如圖


修改文件名爲main_menu.xml。加入如下代碼:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <!--添加一條item-->
    <item android:id="@+id/Setting"
          android:title="設置"
          />
</menu>

然後在主活動引入menu:

@Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.main_menu,menu);
        return true;
    }

現在再來運行程序:


好了介紹搜玩了如何引入menu,點擊指示圖標會顯示設置。再回到toolBar上來,雖然還是很醜,不過別失望,這僅僅是爲了讓Toolbar正常工作而已,爲了讓Toolbar有Material Design風格,我們必須去設置Toolbar的主題風格。

Toolbar配置主題Theme

我們重新配置系統主題Theme,修改styles.xml代碼如下:

<!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <!--導航欄底色-->
        <item name="colorPrimary">#f61d1f1f</item>
        <!--狀態欄底色-->
        <item name="colorPrimaryDark">#0a0909</item>
        <!--導航欄上的標題顏色,這裏的顏色還可以自己定義喜歡的類型-->
        <item name="android:textColorPrimary">#fff</item>
        <!--Activity窗口的顏色,注意:這個顏色值要通過color屬性引進來-->
        <item name="android:windowBackground">@color/windowBackground</item>
        <!--按鈕選中或者點擊獲得焦點後的顏色-->
        <item name="colorAccent">#00ff00</item>
        <!--和 colorAccent相反,正常狀態下按鈕的顏色,如果我們的colorPrimary是深色,一般設置這裏爲白色-->
        <item name="colorControlNormal">#fff</item>
        <!--Button按鈕正常狀態顏色,根據項目來定義-->
        <item name="colorButtonNormal">@color/accent_material_light</item>
        <!--EditText 輸入框中字體的顏色,colorPrimary如果設置深色,一般字體設置爲白色-->
        <item name="editTextColor">@android:color/white</item>
    </style>


Toolbar中常用的控件設置

各個屬性就不解釋了,註釋都很清楚。你可以對着文章開頭的那張圖片理解一下上邊都對應了手機屏幕的哪個位置的。我們來看看Toolbar怎麼使用這些主題吧?

配置activity_main.xml中的Toolbar改成爲如下:

<?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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
>

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:background="?attr/colorPrimary"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
        >
    </android.support.v7.widget.Toolbar>
</RelativeLayout>


相比上面的Toolbar配置,這裏添加了 不少代碼

首先。app定義了命名空間,主要目的是爲了兼容低版本也是用MD效果的。

然後:

android:background="?attr/colorPrimary"
它表示我這個ToolBar的整個樣式。使用?attr表示全引用,整個自定義樣式裏面的內容都對我的tooBar生效。?/attr/actionBarSize表示根據屏幕的分辨率採用系統默認的高度。

爲了在你的UI中使用Toolbar,你得爲每個activity佈局添加Toolbar,並且給Toolbar設置一個id android:id=”@+id/toolbar”。這是第二。

代碼添加toobar

       
        getSupportActionBar().setDisplayShowTitleEnabled(false);
       toolbar.setTitle("主標題");
        toolbar.setSubtitle("副標題");
        //還可以代碼設置標題顏色
        toolbar.setSubtitleTextColor(Color.WHITE);
        //設置logo。您要注意logo與導航位置圖標的區別
        toolbar.setLogo(R.mipmap.ic_action_select_all);
        //添加導航位置圖標
        toolbar.setNavigationIcon(R.mipmap.img_menu);


註釋寫的很詳細了吧。

Toolbar可以設置 Title(主標題),Subtitle(副標題),Logo(logo圖標),NavigationIcon(導航按鈕)。

注意 如果你想要通過toolbar.setTitle(“主標題”);設置Toolbar的標題,你必須在調用它之前調用如下代碼:

getSupportActionBar().setDisplayShowTitleEnabled(false);

上面代碼用來隱藏系統默認的Title,不指定這行代碼,代碼設置Title是沒有任何效果的。

或者另一種方式是,把toobar.setTitle();放置於setSupportAction(toobar);之前也可以正常展示。

經過如上配置再來看看效果圖吧!


當然,你也可以通過佈局文件來添加同樣的效果。個人喜歡使用代碼添加。對於佈局文件添加,可參考如下:通過app:title屬性設置Toolbar的標題,通過app:logo屬性設置Toolbar的圖標。還可以通過app:titleTextColor屬性設置標題文字顏色等等。

那麼Toolbar能不能使用Menu菜單功能呢?答案是肯定的了。來看看加載如下menu菜單的Toolbar吧

修改剛纔的main_menu.xml中的代碼:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".MainActivity">
    <!--添加一條item-->
    <item
        android:id="@+id/action_edit"
        android:icon="@drawable/ic_action_search"
        android:orderInCategory="80"
        android:title="查找"
        app:showAsAction="always"/>

    <item
        android:id="@+id/action_share"
        android:icon="@drawable/abc_ic_menu_share_mtrl_alpha"
        android:orderInCategory="90"
        android:title="分享"
        app:showAsAction="ifRoom"/>

    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="設置"
        app:showAsAction="never"/>
</menu>

怎麼給menu的各個Item添加點擊事件呢?Toolbar給我們提供如下方法

        //事件
        //實現接口(也可以重寫onOptionItemSelected()方法實現同樣的功能,個人喜歡添加監聽器效果)
        toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()) {
                    case R.id.action_edit:
                        Toast.makeText(MainActivity.this, "查找按鈕", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_share:
                        Toast.makeText(MainActivity.this, "分享按鈕", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_settings:
                        Toast.makeText(MainActivity.this, "設置按鈕", Toast.LENGTH_SHORT).show();
                        break;
                }
                return false;
            }
        });

至此,Toolbar添加控件就基本完結了,來看看效果如下


效果還可以,接下來讓我們緊跟腳步。再來修改一下ToolBar的樣式:

在style文件中,修改成如下形式的樣式:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <!--導航欄底色-->
        <item name="colorPrimary">@color/colorPrimary</item>
        <!--狀態欄底色-->
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <!--按鈕選中或者點擊獲得焦點後的顏色-->
        <item name="colorAccent">@color/colorAccent</item>
        <!--導航欄上的標題顏色,這裏的顏色還可以自己定義喜歡的類型-->
        <item name="android:textColorPrimary">#fafbfb</item>

        <!--Activity窗口的顏色,注意:這個顏色值要通過color屬性引進來,否則會報錯-->
        <item name="android:windowBackground">@color/windowBackground</item>

        <!--和 colorAccent相反,正常狀態下按鈕的顏色,如果我們的colorPrimary是深色,一般設置這裏爲白色-->
        <item name="colorControlNormal">#e1fe05</item>
        <!--Button按鈕正常狀態顏色,根據項目來定義-->
        <item name="colorButtonNormal">@color/accent_material_light</item>
        <!--EditText 輸入框中字體的顏色,colorPrimary如果設置深色,一般字體設置爲白色-->
        <item name="editTextColor">@android:color/white</item>
    </style>
</resources>

通過上邊修改,樣式改爲下面的狀態:;



使用默認導航,返回上一個活動。

導航按鈕可以讓用戶很容易的返回app的主界面,這就能夠產生非常好的用戶體驗。給Toolbar添加導航按鈕功能也是非常簡單的,通過如下兩步即可:
1. 在manifest文件中通過android:parentActivityName屬性爲Activity配置parent activity
2. 在代碼中通過ActionBar.setDisplayHomeAsUpEnabled(true)方法使能導航按鈕

下面我們就來實現一下,先做一些準備工作。在首頁增加一個按鈕;
activity_main.xml :

 <Button
        android:onClick="next"
        android:text="進入下一個活動"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

相當簡單,就是增加了一個Button按鈕,點擊button執行start()方法。
MainActivity.java :

public void next(View view)
{
    Intent i = new Intent(this, ChildActivity.class);
    startActivity(i);
}
方法啓動了一個Nextactivity。
Nextactivity.java :

public class NextActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_next);

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        ActionBar ab = getSupportActionBar();

        //使能app bar的導航功能
        ab.setDisplayHomeAsUpEnabled(true);

    }
}


通過getSupportActionBar()方法得到ActionBar實例;調用ActionBar的setDisplayHomeAsUpEnabled()使能導航功能。

接下來看一下child activity的佈局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_next"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.itydl.toolbarforcsdn.NextActivity">

    <android.support.v7.widget.Toolbar
        app:title="另一個更活動"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

    <TextView
        android:text="這是另一個活動"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout>

沒什麼可說的,相信講過上邊的介紹,看起來很簡單。

最後,在manifest文件中爲ChildActivity指定parent Activity。

<activity
    android:name=".NextActivity"
    android:label="@string/title_activity_child"
    android:parentActivityName=".MainActivity">

    <meta-data
        android:name="android.support.PARENT_ACTIVITY"
        android:value=".MainActivity"/>
</activity>

通過android:parentActivityName屬性指定ChildActivity的parent Activity。注意:meta-data標籤是爲了兼容android 4.0或者更小的版本。

程序運行效果圖:

添加ToolBar的子按鈕並對所有控件添加點擊事件:


其實在tooBar中,是可以直接通過佈局的方式添加孩子佈局的。

在主佈局中添加如下代碼:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:id="@+id/activity_main"
    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="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
        <!--可以在這類直接添加Toolbar的子控件,顯然在這裏可以添加自定義的控件-->

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="首頁"
            android:textColor="@android:color/holo_red_light"
            android:textSize="20sp" />
    </android.support.v7.widget.Toolbar>

    <!--app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"能夠讓toobar上邊的文字爲淺色主題(例如默認白色)
    如果不指定的話,由於我們之前在style中制定了toolbar爲淺色主題,那麼toobar的文字就是深色主題(例如黑色)-->

    <Button
        android:onClick="next"
        android:text="進入下一個活動"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
</LinearLayout>

最後把主活動中的代碼貼一下,相當於對上邊知識點做一個彙總

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private Toolbar mToolbar;
    private PopupWindow mPopupWindow;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mToolbar = (Toolbar) findViewById(R.id.toolbar);
        //表示ToolBar取代ActionBar
        setSupportActionBar(mToolbar);
        getSupportActionBar().setDisplayShowTitleEnabled(false);
        //設置主標題和顏色
        mToolbar.setTitle("title");
        mToolbar.setTitleTextColor(Color.YELLOW);

        //設置副標題和顏色
        mToolbar.setSubtitle("sub");
        mToolbar.setSubtitleTextColor(Color.parseColor("#80ff0000"));


        //添加導航位置圖標,這個圖片一般用於點擊打開側邊欄,或者點擊返回上一個活動。
        mToolbar.setNavigationIcon(R.mipmap.img_menu);


        //事件

        //1、設置NavigationIcon的點擊事件,需要放在setSupportActionBar之後設置纔會生效,
        //因爲setSupportActionBar裏面也會setNavigationOnClickListener
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(), "click NavigationIcon", Toast.LENGTH_SHORT).show();
            }
        });


        //2、Menu控件的點擊事件。實現接口(也可以重寫onOptionItemSelected()方法實現同樣的功能,個人喜歡添加監聽器效果)
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()) {
                    case R.id.action_edit:
                        Toast.makeText(MainActivity.this, "查找按鈕", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_share:
                        Toast.makeText(MainActivity.this, "分享按鈕", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_settings:
                        popUpMyOverflow();
                        break;
                }
                return true;
            }
        });

        //3、ToolBar裏面還可以包含子控件
        mToolbar.findViewById(R.id.tv_title).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(getApplicationContext(), "點擊自定義標題", Toast.LENGTH_SHORT).show();
            }
        });


    }

    /**
     * 彈出自定義的popWindow
     */
    public void popUpMyOverflow() {

        //獲取狀態欄高度
        Rect frame = new Rect();
        getWindow().getDecorView().getWindowVisibleDisplayFrame(frame);

        //狀態欄高度+toolbar的高度
        int yOffset = frame.top + mToolbar.getHeight();

        if (null == mPopupWindow) {
            //初始化PopupWindow的佈局
            View popView = getLayoutInflater().inflate(R.layout.action_overflow_popwindow, null);
            //popView即popupWindow的佈局,ture設置focusAble.
            mPopupWindow = new PopupWindow(popView,
                    ViewGroup.LayoutParams.WRAP_CONTENT,
                    ViewGroup.LayoutParams.WRAP_CONTENT, true);
            //必須設置BackgroundDrawable後setOutsideTouchable(true)纔會有效
            mPopupWindow.setBackgroundDrawable(new ColorDrawable());
            //點擊外部關閉。
            mPopupWindow.setOutsideTouchable(true);
            //設置一個動畫。
            mPopupWindow.setAnimationStyle(android.R.style.Animation_Dialog);
            //設置Gravity,讓它顯示在右上角。
            mPopupWindow.showAtLocation(mToolbar, Gravity.RIGHT | Gravity.TOP, 0, yOffset);
            //設置popupWindow上邊控件item的點擊監聽
            popView.findViewById(R.id.ll_item1).setOnClickListener(this);
            popView.findViewById(R.id.ll_item2).setOnClickListener(this);
            popView.findViewById(R.id.ll_item3).setOnClickListener(this);
        } else {
            mPopupWindow.showAtLocation(mToolbar, Gravity.RIGHT | Gravity.TOP, 0, yOffset);
        }

    }

    //PopupWindow的監聽回調事件
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.ll_item1:
                Toast.makeText(getApplicationContext(), "添加好友", Toast.LENGTH_SHORT).show();
                break;
            case R.id.ll_item2:
                Toast.makeText(getApplicationContext(), "發現", Toast.LENGTH_SHORT).show();
                break;
            case R.id.ll_item3:
                Toast.makeText(getApplicationContext(), "發起羣聊", Toast.LENGTH_SHORT).show();
                break;
        }
        //點擊PopWindow的item後,關閉此PopWindow
        if (null != mPopupWindow && mPopupWindow.isShowing()) {
            mPopupWindow.dismiss();
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        //讓toolbar的menu顯示出來
        getMenuInflater().inflate(R.menu.main_menu, menu);
        return true;
    }

    public void next(View view) {
        Intent intent = new Intent(this, NextActivity.class);
        startActivity(intent);
    }
}

然後是popupwindow的佈局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:background="#000000"
              android:orientation="vertical"
              android:padding="10dp">

    <LinearLayout
        android:id="@+id/ll_item1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_user" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="添加好友"
            android:textColor="#ffffff"
            android:textSize="20sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/ll_item2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_hot" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="發起羣聊"
            android:textColor="#ffffff"
            android:textSize="20sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/ll_item3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_home" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="幫助與反饋"
            android:textColor="#ffffff"
            android:textSize="20sp" />
    </LinearLayout>
</LinearLayout>

然後咱再運行看看效果怎麼樣:



下一篇文章會介紹ToolBar更高級的用法,比如添加ActionViiew、添加Action Provider、自定義ToolBar等。

喜歡的朋友點個贊或者關注下博客,支持下樓主~


加羣聊技術,Android開發交流羣:  497646615


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章