NavigationView,AppBarLayout與CollapsingToolbarLayout

NavigationView

        在上面示例中,菜單項是通過listview自己添加的,而android support design包中提供的NavigationView是專門用來顯示菜單項的。
        它與toolbar一樣,也是加載menu文件。

常用屬性

        headerLayout:菜單項的頭。可選。headerLayout中的組件必須等navView加載完畢後,通過navView.findViewById()才能獲取到。
        menu:NavigationView要加載的menu文件。
        itemBackground:每一個菜單項的背景,可以是selector。
        itemIconTint:每一個菜單項中icon的填充顏色,可以是selector。
        itemTextColor:每一個菜單項中文字的顏色,可以是selector
        itemTextAppearance:每一個菜單項中提示文字的樣式,可以設置大小,顏色等。

常用方法

        setNavigationItemSelectedListener():點擊每一個菜單項時的回調。

示例

        final NavigationView nav = (NavigationView) findViewById(R.id.nav_menu);
        nav.post(new Runnable() {
            @Override
            public void run() {//獲取headerLayout中的控件
                ImageView icon = (ImageView) nav.findViewById(R.id.nav_header_icon);
                RoundedBitmapDrawable drawable = RoundedBitmapDrawableFactory.create(getResources(), BitmapFactory.decodeResource(getResources(), R.drawable.bg));
                drawable.setCircular(true);
                icon.setImageDrawable(drawable);
            }
        });
        //設置每一個菜單項的點擊事件
        nav.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.ment_accept:
                        content.setText("accept");
                        break;
                }
                return true;
            }
        });
其佈局使用示例爲:
    <android.support.design.widget.NavigationView
        android:id="@+id/nav_menu"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/activity_plugin"
        app:itemTextAppearance="@style/nav_text_appearance"
        app:itemBackground="@drawable/selector_menu_item_bg"
        app:menu="@menu/menu_toolbar" />

AppbarLayout

        繼承於LinearLayout並實現了一些MD設計的控件,它是一個增強版的垂直線性佈局。其主要功能是用來處理子View隨手指滑動而展開或收縮效果
        它可以有多個子View。如果第一個子view沒有設置layout_scrollFlags有scroll值,則所有的子view都不會隨手指滑動而滾動,即使後面的子view設置了scroll值;如果第一個子view設置了scroll值,那麼除第一個子view之外所有的view都不會滑出屏幕,而第一個view會滑出屏幕。

layout_scrollFlags

        作用於子View的屬性。其值如下:
        scroll:隨手指移動,子View會展開或收縮。如果沒有該值,則CTL不會隨手指移動而發生變化。
        exitUntilCollapsed:子View收縮到最小高度(minHeight屬性設置的值)後,不再繼續收縮。不設置該值的話,則子View會一直隨手指滑出屏幕。
        enterAlways:手指剛往下移動,子View就會展開。如果不設置該值,則直到滑動控件滑到頂部時,子View纔會隨手指下滑而展開。
        enterAlwaysCollapsed:只有滑動view滑動到頂部時,子View才能展開。
        snap:手指鬆開時,子View會自動回到展開或者收縮狀態。如果不設置該值,則停在手指擡起的位置。

常用方法

        addOnOffsetChangedListener:添加監聽事件。當AppbarLayout移動時,會回調該監聽器中的方法,從而可以在監聽方法中進行自定義操作。如:將滑動到某一值時,將某個View固定等。
         getTotalScrollRange:獲取Appbar可滑動的範圍。

示例

   <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="256dp"
        android:fitsSystemWindows="true">
        <TextView
            app:layout_scrollFlags="snap|scroll|enterAlways"
            android:minHeight="50dp"
            android:layout_width="match_parent"
            android:layout_height="100dp" />
    </android.support.design.widget.AppBarLayout>
        內部的TextView會隨着手指的滑動而滑動。如果將AppbarLayout的高度寫成wrap_content,再將內部的TextView修改一下,可以寫一個非常簡單的下拉刷新。

CollapsingToolbarLayout

        可伸縮的toolbar,是toolbar的包裝類,並且應該做爲AppBarLayout的直接子類。

常用屬性

這些屬性的顯示都是通過動畫進行,並不是直接顯示成最終結果。
        contentScrim:收縮後顯示的背景色。
        expandedTitleGravity:toolbar展開時,title顯示的位置。和平時的Gravity一樣。
        expandedTitleMarginBottom、expandedTitleMarginStart、expandedTitleMarginTop與expandedTitleMarginEnd表示展示時title的左右邊距,與margintop等相同。
        expandedTitleTextAppearance:展示時title的文字樣式。
        collapsedTitleTextAppearance:收縮時title的文字樣式。
        collapsedTitleGravity:收縮時title的位置。
        layout_scrollInterpolator:展開和收縮時所執行的動畫的插值器。
        scrimAnimationDuration:contentScrim顯示時會執行一個動畫,該屬性就是設置該動畫的duration。
        layout_scrollFlags:設置隨手指滑動時的滑動行爲。

layout_collapseMode

        作用於子View的屬性。有兩個值:
        pin:設置該值的子View不會隨CTL的滑動而滑動。可以將CTL的高度設置爲100dp,裏面的子View設置爲50dp,在滑動前50dp時子View是不會滑動的。如下:
        <android.support.design.widget.CollapsingToolbarLayout<!--其父View爲AppbarLayout-->
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@android:color/darker_gray"
            app:layout_scrollFlags="scroll|snap">

            <LinearLayout
                app:layout_collapseMode="pin"
                app:layout_collapseParallaxMultiplier="0"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:background="@android:color/holo_red_dark"
                android:orientation="vertical" />
        </android.support.design.widget.CollapsingToolbarLayout>
        當滑動超過50dp時,子View會跟隨滑動。這是因爲CTL顯示的高度已不中以顯示子View了。
        parallax:與pin相反,子View隨手指滑動而滑動。

layout_collapseParallaxMultiplier

        作用於子View的屬性。爲浮點型數值。(1-該值)乘以手指滑動的距離,得到的結果爲子View移動的距離。因此,該值大於1,則子View移動方向與手指移動方向相反;該值小於1,則子View移動方向與手指移動方向相同。



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