Android Toolbar的詳細(xì)介紹和自定義Toolbar

轉(zhuǎn)載:Toolbar的詳細(xì)介紹和自定義Toolbar
在此總結(jié)一下,Android Toolbar 控件的使用方法恩闻,爭(zhēng)取總結(jié)的系統(tǒng)全面些宴凉。之前也只是停留在一些基本簡(jiǎn)單的用法晰房,而且也不系統(tǒng)瑞驱。希望愛學(xué)習(xí)的你能通過(guò)這篇文章荧恍,有所收獲伸刃!

Toolbar 的基本用法

常用的方法

xml中的設(shè)置:

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorAccent"
        app:navigationIcon="@drawable/ic_back_white_24dp"
        app:title="標(biāo)題"
        app:titleTextColor="@color/white">
 </android.support.v7.widget.Toolbar>

如果你不在xml中設(shè)置參數(shù)的話乔询,代碼中的設(shè)置:

 Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        toolbar.setTitle("標(biāo)題");
        toolbar.setTitleTextColor(Color.WHITE);
        toolbar.setNavigationIcon(R.drawable.ic_back_white_24dp);

        //點(diǎn)擊左邊返回按鈕監(jiān)聽事件
        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

            }
        });

由于比較簡(jiǎn)單樟插,效果圖這里也不在貼出啦。

全面但包括不太常用的用法

xml中的配置:

<!--   navigationIcon  左邊返回箭頭圖標(biāo)
       navigationContentDescription 目前還不知道其作用
       titleMarginStart  標(biāo)題距離(開始)左邊的距離
       -->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorAccent"
        app:logo="@mipmap/ic_launcher"
        app:navigationContentDescription=""
        app:navigationIcon="@drawable/ic_back_white_24dp"
        app:subtitle="子標(biāo)題"
        app:subtitleTextColor="@color/white"
        app:title="標(biāo)題"
        app:titleMarginStart="90dp"
        app:titleTextColor="@color/white">

同樣如果不在xml中設(shè)置參數(shù)的話,代碼中的設(shè)置:
這里就不在貼出代碼啦黄锤,設(shè)置的時(shí)候麻献,先敲打出xml配置中的關(guān)鍵單詞或首字母,就會(huì)自動(dòng)提示的猜扮。大部分在xml有的屬性勉吻,代碼中都可以設(shè)置

效果圖:


這里寫圖片描述

注意事項(xiàng):
1:如果你添加了這行代碼 setSupportActionBar(toolbar); 那么 toolbar.setNavigationOnClickListener監(jiān)聽方法,要放到其后面旅赢,否則點(diǎn)擊事件齿桃,監(jiān)聽不到的。如果你用不到ActionBar的一些特性的話煮盼,建議setSupportActionBar(toolbar); 這行代碼不用添加了短纵。

如果你想修改主標(biāo)題和子標(biāo)題的文字大小,你可通過(guò)如下方式:
首先定義一個(gè)style:

 <!--主標(biāo)題-->
<style name="ToolbarTitle" parent="@style/TextAppearance.Widget.AppCompat.Toolbar.Title">
       <item name="android:textColor">#f0f0</item>
        <item name="android:textSize">15sp</item>
    </style>

 <!--子標(biāo)題-->
<style name="ToolbarSubtitle" parent="@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle">
        <item name="android:textColor">#f0f0</item>
        <item name="android:textSize">10sp</item>
    </style>

然后:

 <!-- app:titleTextAppearance="@style/ToolbarTitle"-->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorAccent"
        app:logo="@mipmap/ic_launcher"
        app:navigationContentDescription=""
        app:navigationIcon="@drawable/ic_back_white_24dp"
        app:subtitle="子標(biāo)題"
        app:subtitleTextColor="@color/white"
        app:title="標(biāo)題"
        app:titleMarginStart="90dp"
        app:titleTextAppearance="@style/ToolbarTitle"
        app:titleTextColor="@color/white">

效果圖這里不在貼出了僵控,通過(guò)app:titleTextAppearance=”@style/ToolbarTitle”方法的設(shè)置香到,就能修改標(biāo)題字體的大小,當(dāng)然文字顏色也可以修改报破。

到這里悠就,你可能要問(wèn)了,如果充易,我想要標(biāo)題居中梗脾,怎么辦呢?查看api盹靴,toolbar沒(méi)有使其居中的方法炸茧,也就提供了使其距左右,上下邊距大小的方法稿静。不過(guò)不用擔(dān)心梭冠,這里還是有辦法的「谋福看如下代碼:

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

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="標(biāo)題"
            android:textColor="@color/white"
            android:textSize="22sp" />

    </android.support.v7.widget.Toolbar>

效果圖:


這里寫圖片描述

注意: 此時(shí) TextView 控件的寬和高都是自適應(yīng)大小控漠,java 代碼中此行代碼setSupportActionBar(toolbar);就不要添加了,否則就會(huì)顯示不正常绍妨。如果你非要添加setSupportActionBar(toolbar);這行代碼的話润脸,TextView 控件的寬要用match_parent屬性。這里再次建議setSupportActionBar(toolbar);這行代碼就不要點(diǎn)添加了他去。
至于它的作用,在此做一下簡(jiǎn)單的說(shuō)明吧:
1)在Toolbar這個(gè)控件出現(xiàn)之前倒堕,其實(shí)我們也可以通過(guò) ActionBar actionBar = getSupportActionBar(); 方法獲取到acitonbar灾测,(前提你的activity主題theme,是采用的帶actionbar的主題,如果你采用這樣的主題android:theme="@style/Theme.AppCompat.Light.NoActionBar">拿到的actionBar也是 null,顯然是不行的)之后你就可以采用諸如下面的方面來(lái)操作actionbar啦媳搪。

 ActionBar actionBar = getSupportActionBar();
        if (actionBar != null) {
            actionBar.setDisplayHomeAsUpEnabled(true);
            actionBar.setDisplayShowTitleEnabled(true);
            actionBar.setTitle("主標(biāo)題");
               ......
        } else {
            Log.i(TAG, "onCreate: actionBar is null");
        }

但是铭段,原生自帶的ActionBar設(shè)置的靈活性,還是有限秦爆,因此Toolbar 這個(gè)控件序愚,也就應(yīng)運(yùn)而生啦!此時(shí)等限,有的小伙伴說(shuō)了爸吮,我雖然使用了Toolbar來(lái)代替ActionBar,但是我還想使用ActionBar的一些特性怎么辦呢望门?這個(gè)時(shí)候 setSupportActionBar(toolbar);就發(fā)揮其作用啦形娇。添加這行代碼,你的toolbar可以說(shuō)也就具有了ActionBar的相關(guān)屬性了筹误。好啦桐早,到此setSupportActionBar(toolbar) 的作用也講完了。如果你還不太明白的話厨剪,可以參考一下篇文章:
ActionBar和Toolbar的基礎(chǔ)使用

結(jié)合menu配置文件的用法哄酝。

這里先看一下效果圖:


這里寫圖片描述

首先在menu文件夾中,創(chuàng)建名為 menu.xml 文件(文件名隨意的):

<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="@drawable/ic_search"
        android:title="Search"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/action_notifications"
        android:icon="@drawable/ic_delete_white_24dp"
        android:title="notifications"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/action_settings"
        android:icon="@mipmap/ic_launcher"
        android:orderInCategory="100"
        android:title="@string/action_settings"
        app:showAsAction="never" />
</menu>

然后在代碼中這樣加載該menu文件即可:

 toolbar.inflateMenu(R.menu.menu);

最后運(yùn)行代碼祷膳,就是上圖的效果炫七。

在這里,app:showAsAction 屬性還是很有必要介紹一下滴钾唬。
app:showAsAction 有以下三個(gè)屬性:

  1. ifRoom 表示在屏幕空間足夠的情況下顯示在Toolbar中万哪,不夠的話就顯示在菜單中
  2. never 表示永遠(yuǎn)不顯示在Toolbar中,而是一直顯示在菜單中
  3. always 表示永遠(yuǎn)顯示在Toolbar中抡秆,如果屏幕空間不夠則不顯示

注意:Toolbar中的action按鈕只會(huì)顯示圖標(biāo)奕巍,菜單中的action按鈕只會(huì)顯示文字。

那如果設(shè)置了ifRoom 屬性之后儒士,既然只顯示圖標(biāo)不顯示文字的止,那還設(shè)置 android:title=”Search” 文字干嘛呢?如果你設(shè)置了之后,雖然不顯示着撩,但是你長(zhǎng)按相應(yīng)按鈕后诅福,就會(huì)吐司相應(yīng)文字內(nèi)容的。

細(xì)心的你可能發(fā)現(xiàn)還有些不足的地方拖叙,就是上圖的點(diǎn)擊菜單選項(xiàng)時(shí)氓润,彈出的菜單位置有點(diǎn)太靠上啦,能不能設(shè)置呢薯鳍,還有菜單的背景和文字顏色能不能設(shè)置呢咖气?答案當(dāng)然是可以的!

首先設(shè)置好樣式:

 <style name="ToolbarPopupTheme" parent="@style/ThemeOverlay.AppCompat.Dark">
         <!--<item name="android:colorBackground">#000000</item>--> <!--這里可以改變菜單的背景色-->
        <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item> <!--新增一個(gè)item,用于控制menu-->
    </style>

    <style name="OverflowMenuStyle" parent="Widget.AppCompat.Light.PopupMenu.Overflow">
        <item name="overlapAnchor">false</item>  <!--把該屬性改為false即可使menu位置位于toolbar之下-->
    </style>

然后直接在這里引用就可以了: app:popupTheme=”@style/ToolbarPopupTheme”

 <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorAccent"
        app:popupTheme="@style/ToolbarPopupTheme">

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="標(biāo)題"
            android:textColor="@color/white"
            android:textSize="22sp" />

    </android.support.v7.widget.Toolbar>

效果圖:


這里寫圖片描述

與AppBarLayout結(jié)合的使用

(1): app:layout_scrollFlags=”scroll”

xml代碼:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            android:background="@color/colorAccent"
            app:layout_scrollFlags="scroll"
            app:popupTheme="@style/ToolbarPopupTheme">

        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/nestedScrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="16dp"
                android:text="@string/large_text" />

        </LinearLayout>

    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

首先注意最外層:包裹了一層 android.support.design.widget.CoordinatorLayout 布局崩溪,那CoordinatorLayout 布局是什么的浅役,我們可以理解為它是加強(qiáng)版的FramLayout。然后注意:Toolbar 的新添加的這條屬性 app:layout_scrollFlags=”scroll” 伶唯。最后看一看效果圖:

這里寫圖片描述

PS:對(duì)于 scroll 屬性觉既,網(wǎng)上也有說(shuō)的比較專業(yè)的,不過(guò)我認(rèn)為從產(chǎn)生的效果角度去分析的話乳幸,那就是:往上滑動(dòng)就不說(shuō)了瞪讼,往下滑動(dòng)就是當(dāng)下面的滾動(dòng)布局滑動(dòng)到頂端時(shí),標(biāo)題欄toolbar才會(huì)滑出來(lái)反惕。該屬性實(shí)用性一般吧尝艘。

(2):app:layout_scrollFlags=”scroll|enterAlways”

scroll 與 enterAlways 結(jié)合產(chǎn)生的效果圖如下:

這里寫圖片描述

PS:我們還是從產(chǎn)生的效果角度去分析的:往下滑動(dòng)時(shí)搁进,幔睬,標(biāo)題欄 toolbar 會(huì)優(yōu)先滑出來(lái),然后滾動(dòng)布局才開始滑動(dòng)赫模。就像該單詞的意思一樣:總是在悬赏。也就是只要添加了該屬性值狡汉,下滑時(shí) toolbar 總是優(yōu)先滑出來(lái)。該屬性比較實(shí)用闽颇。

(3): app:layout_scrollFlags=”scroll|enterAlways|snap”

在以上基礎(chǔ)上盾戴,在與 snap 結(jié)合所產(chǎn)生的效果圖如下:


這里寫圖片描述

PS:還是從產(chǎn)生的效果角度去分析的:不管是往下或者往上滑動(dòng)時(shí),兵多,標(biāo)題欄 toolbar 首先還是和(2)中一樣的尖啡,不過(guò)有個(gè)細(xì)微的不同,toolbar會(huì)根據(jù)當(dāng)前的滾動(dòng)距離剩膘,自動(dòng)選擇是隱藏還是顯示衅斩。該屬性實(shí)用性也一般。

(4): app:layout_scrollFlags=”scroll|enterAlways|exitUntilCollapsed”

scroll 與 enterAlways 與 exitUntilCollapsed 結(jié)合所產(chǎn)的效果圖如下:


這里寫圖片描述

注意此時(shí)Toolbar的布局有些許改變(改變后的):

 <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@color/colorAccent"
            android:minHeight="40dp"
            app:layout_scrollFlags="scroll|enterAlways|exitUntilCollapsed"
            app:popupTheme="@style/ToolbarPopupTheme">

        </android.support.v7.widget.Toolbar>

我們給Toolbar 設(shè)置了一個(gè)最小高度 android:minHeight=”40dp”怠褐,然后又把正常高度改變了畏梆,并隨意改成了100dp。

PS:還是從產(chǎn)生的效果角度去分析的:默認(rèn)toolbar 顯示的正常高度值我們?cè)O(shè)置成的100dp奈懒,當(dāng)我們上滑的時(shí)候奠涌,高度達(dá)到最小高度40dp時(shí),toolbar不在滑動(dòng)了磷杏。該屬性感覺(jué)實(shí)用性不強(qiáng)溜畅。

(5): app:layout_scrollFlags=”scroll|enterAlways|enterAlwaysCollapsed”

scroll 與 enterAlways 與 enterAlwaysCollapsed 結(jié)合所產(chǎn)的效果圖如下:

這里寫圖片描述

xml中Toolbar 的布局和(4)還是一樣的,不過(guò)app:layout_scrollFlags屬性茴丰,由原來(lái)的exitUntilCollapsed改為enterAlwaysCollapsed达皿。

PS:還是從產(chǎn)生的效果角度去分析的:默認(rèn)toolbar 顯示的正常高度值我們?cè)O(shè)置成的100dp天吓,當(dāng)我們上滑的時(shí)候贿肩,toolbar直到完全隱藏時(shí)峦椰,下面的滾動(dòng)布局才開始發(fā)生滾動(dòng);下滑時(shí)toolbar會(huì)優(yōu)先滑出設(shè)置的最小高度值汰规,然后當(dāng)滾動(dòng)布局下滑到頂部時(shí)汤功,后面的toolbar部分,才開始完全顯示(滑)出來(lái)溜哮。該屬性感覺(jué)實(shí)用性也不強(qiáng)滔金。

與CollapsingToolbarLayout結(jié)合的使用

(1):先看下效果圖:


這里寫圖片描述

再把代碼貼上:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="180dp"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.NoActionBar.AppBarOverlay">

         <!--本次重點(diǎn)關(guān)注這里 CollapsingToolbarLayout -->
        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll">

            <ImageView
                android:id="@+id/image"
                android:layout_width="match_parent"
                android:layout_height="180dp"
                android:scaleType="centerCrop"
                android:src="@drawable/ic_image"
                app:layout_collapseMode="parallax" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:navigationIcon="@drawable/ic_back_white_24dp"
                app:popupTheme="@style/AppTheme.NoActionBar.PopupOverlay"
                app:title="標(biāo)題"
                app:titleTextColor="@color/white">

            </android.support.v7.widget.Toolbar>

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/text_margin"
            android:text="@string/large_text" />

    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

這里我們重點(diǎn)關(guān)注 CollapsingToolbarLayout控件 以下的幾個(gè)屬性:

  • app:contentScrim=”?attr/colorPrimary” 當(dāng)上滑到toolbar 高度期間直到達(dá)到toolbar高度時(shí),給toolbar設(shè)置的背景色茂嗓,以及過(guò)渡顏色餐茵。當(dāng)然,這里不僅僅可以設(shè)置顏色述吸,也可以設(shè)置圖片忿族。 如果不設(shè)置該屬性,標(biāo)題欄會(huì)過(guò)渡為以之前的圖片為背景蝌矛。
  • app:layout_scrollFlags=”scroll” 和介紹 AppBarLayout 時(shí)道批,給Toolbar 設(shè)置和配置一樣。其效果上圖已做展示入撒。
  • app:expandedTitleGravity=”center_horizontal” 從單詞意思可以看出隆豹,這是展示后,title的位置茅逮。
  • app:expandedTitleMarginStart=”50dp” 從單詞意思可以看出璃赡,這是展示后,title 距離開始位置的邊距献雅。
  • app:collapsedTitleGravity=”center” 從單詞意思可以看出碉考,這是收縮后,title 位置(測(cè)試發(fā)現(xiàn)惩琉,不好用)豆励。
  • app:expandedTitleTextAppearance=”@style/transparentText” 展開后標(biāo)題文字的樣式
  • app:collapsedTitleTextAppearance=”@style/ToolbarTitle” 折疊后標(biāo)題文字的樣式

給 ImageView 控件 設(shè)置的 app:layout_collapseMode=”parallax” 屬性說(shuō)明:
app:layout_collapseMode有兩個(gè)參數(shù):

  • parallax 子View可以選擇在當(dāng)前的布局當(dāng)時(shí)是否以“視差”的方式來(lái)跟隨滾動(dòng)。(PS:其實(shí)就是讓這個(gè)View的滾動(dòng)的速度比其他正常滾動(dòng)的View速度稍微慢一點(diǎn))瞒渠。
  • pin 測(cè)試發(fā)現(xiàn)良蒸,按照以上的布局,如果你使用pin參數(shù)伍玖,看效果嫩痰,和使用parallax 參數(shù),好像沒(méi)有什么區(qū)別窍箍。目前個(gè)人認(rèn)為的區(qū)別后面在做介紹串纺。

注意事項(xiàng):

1.上圖中背景圖丽旅,也就是xml中的 ImageView 控件,設(shè)置的圖片大小纺棺,在保證顯示正常的情況下榄笙,越小越好。太大的話祷蝌,在展示的時(shí)候茅撞,會(huì)有卡頓的感覺(jué)。


下面我們來(lái)看一個(gè)效果圖:


這里寫圖片描述

如果你發(fā)現(xiàn)展開和折疊后的標(biāo)題字體太小或太大巨朦,你可通過(guò)如下兩個(gè)屬性設(shè)置:

 app:expandedTitleTextAppearance="@style/transparentText" 展開后標(biāo)題文字的樣式  
 app:collapsedTitleTextAppearance="@style/ToolbarTitle" 折疊后標(biāo)題文字的樣式

transparentText (透明)樣式:

<style name="transparentText" parent="TextAppearance.AppCompat.Small">
        <item name="android:textColor">#00000000</item>
         <item name="android:textSize">15sp</item>
    </style>

ToolbarTitle樣式:

<style name="ToolbarTitle" parent="@style/TextAppearance.Widget.AppCompat.Toolbar.Title">
       <item name="android:textColor">#f0f0</item>
        <item name="android:textSize">15sp</item>
    </style>

細(xì)心的你米丘,會(huì)發(fā)現(xiàn)我們的狀態(tài)欄,現(xiàn)在是完全透明的狀態(tài)糊啡。那我們?cè)趺磳?shí)現(xiàn)呢拄查?那你會(huì)說(shuō)了,那還不簡(jiǎn)單棚蓄!
使用下面的代碼:

 //透明狀態(tài)欄效果
        if (Build.VERSION.SDK_INT >= 21) {
            View decorView = getWindow().getDecorView();
            int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
            decorView.setSystemUiVisibility(option);
            getWindow().setStatusBarColor(Color.TRANSPARENT);

        }

不就能實(shí)現(xiàn)嗎堕扶!或者使用第三方 透明狀態(tài)欄設(shè)置庫(kù)。很簡(jiǎn)單的就能實(shí)現(xiàn)了癣疟。如果你真正具體操作了挣柬,運(yùn)行代碼了。你會(huì)發(fā)現(xiàn)睛挚,是實(shí)現(xiàn)不了的邪蛔。不過(guò)你把上述代碼中 ImageView 控件的 app:layout_collapseMode 的參數(shù)設(shè)置為 pin 。如下:
app:layout_collapseMode=”pin” 扎狱。此時(shí)你在試一下侧到,就能實(shí)現(xiàn)上圖的效果啦。現(xiàn)在也能說(shuō)明淤击,parallax 和 pin 的一個(gè)區(qū)別吧匠抗。

app:layout_scrollFlags=”scroll|enterAlways”

那么 app:layout_scrollFlags=”scroll|enterAlways” 效果怎樣呢?下面看圖說(shuō)話:

這里寫圖片描述

PS:這里也不再多說(shuō)了污抬,原理和介紹 AppBarLayout 時(shí)汞贸,給Toolbar 設(shè)置和配置基本差不多。

app:layout_scrollFlags=”scroll|exitUntilCollapsed”

效果圖:


這里寫圖片描述

app:layout_scrollFlags=”scroll|enterAlways|exitUntilCollapsed”

PS:這里不再貼出效果圖啦印机,聰明的你矢腻,相信也能想象出其效果。(不過(guò)這樣結(jié)合的配置射赛,感覺(jué)不常用也不太實(shí)用多柑。上面貼圖的幾種效果,還比較實(shí)用一些楣责。)

文章寫了好幾天竣灌,才算寫的個(gè)差不多聂沙,如果對(duì)你有些幫助的話,給個(gè)贊和好評(píng)吧初嘹!

引申拓展—–實(shí)現(xiàn)懸浮欄的效果

如何自定義Toolbar 標(biāo)題欄


ToolBar 的封裝

Android ToolBar 使用完全解析

【android MaterialDesign】 用法總結(jié)

Android 詳細(xì)分析AppBarLayout的五種ScrollFlags

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末及汉,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子削樊,更是在濱河造成了極大的恐慌豁生,老刑警劉巖兔毒,帶你破解...
    沈念sama閱讀 222,104評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件漫贞,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡育叁,警方通過(guò)查閱死者的電腦和手機(jī)迅脐,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,816評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)豪嗽,“玉大人谴蔑,你說(shuō)我怎么就攤上這事」昝危” “怎么了隐锭?”我有些...
    開封第一講書人閱讀 168,697評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)计贰。 經(jīng)常有香客問(wèn)我钦睡,道長(zhǎng),這世上最難降的妖魔是什么躁倒? 我笑而不...
    開封第一講書人閱讀 59,836評(píng)論 1 298
  • 正文 為了忘掉前任荞怒,我火速辦了婚禮,結(jié)果婚禮上秧秉,老公的妹妹穿的比我還像新娘褐桌。我一直安慰自己,他們只是感情好象迎,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,851評(píng)論 6 397
  • 文/花漫 我一把揭開白布荧嵌。 她就那樣靜靜地躺著,像睡著了一般砾淌。 火紅的嫁衣襯著肌膚如雪啦撮。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,441評(píng)論 1 310
  • 那天拇舀,我揣著相機(jī)與錄音逻族,去河邊找鬼。 笑死骄崩,一個(gè)胖子當(dāng)著我的面吹牛聘鳞,可吹牛的內(nèi)容都是我干的薄辅。 我是一名探鬼主播,決...
    沈念sama閱讀 40,992評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼抠璃,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼站楚!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起搏嗡,我...
    開封第一講書人閱讀 39,899評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤窿春,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后采盒,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體旧乞,經(jīng)...
    沈念sama閱讀 46,457評(píng)論 1 318
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,529評(píng)論 3 341
  • 正文 我和宋清朗相戀三年磅氨,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了尺栖。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,664評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡烦租,死狀恐怖延赌,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情叉橱,我是刑警寧澤挫以,帶...
    沈念sama閱讀 36,346評(píng)論 5 350
  • 正文 年R本政府宣布,位于F島的核電站窃祝,受9級(jí)特大地震影響掐松,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜锌杀,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,025評(píng)論 3 334
  • 文/蒙蒙 一甩栈、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧糕再,春花似錦量没、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,511評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至猾担,卻和暖如春袭灯,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背绑嘹。 一陣腳步聲響...
    開封第一講書人閱讀 33,611評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工稽荧, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人工腋。 一個(gè)月前我還...
    沈念sama閱讀 49,081評(píng)論 3 377
  • 正文 我出身青樓姨丈,卻偏偏與公主長(zhǎng)得像畅卓,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子蟋恬,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,675評(píng)論 2 359