2.Android support design NavigationView


2.Android support design NavigationView
  • Android support design NavigationView
  • NavigationView紹介
  • gradle構成
  • レイアウト設定
  • NavigationViewイベント処理
  • 効果図

  • NavigationViewの紹介
    Android Design Support Libraryがない場合、サイドスライド(一般的に左側)メニューの機能の実現は多くの仲間を悩ませている.このような機能をカスタマイズするViewは、さまざまなサイズの問題、実現問題、時間問題を避けられない.サードパーティのライブラリを探すと、良いかもしれませんが、さまざまなメーカーのシステムの互換性の問題も頭を悩ませます.
    Android Design Support Libraryの登場はNavigationViewコンポーネントをもたらし、Android 2に下向きに互換性がある.1で、ナビゲーション引き出しを簡単に作成できます.
    gradle構成compile 'com.android.support:design:23.0.1'以降
    dependencies {
        compile fileTree(dir: 'libs', include: ['*.jar'])
        compile 'com.android.support:appcompat-v7:23.0.1'
        compile 'com.android.support:design:23.0.1'
    }

    レイアウト設定
    特に注意:一般的にNavigationViewを使用する場合は、親としてDrawerLayoutが必要です.DrawerLayoutには他のコンポーネントやコンポーネントを含むLayoutが存在するに違いないので、注意してください!NavigationViewをDrawerLayoutの下部に配置してください(もちろん一番下にする必要はありません)、他のコンポーネントやLayoutの上部に表示されます.NavigationViewがイベントを受信してから、メニューを横向きに戻すことができます.そうでなければ、イベントが他のコンポーネントやLayoutにブロックされ、メニューを横取りすることはできません.
    natigation_view_layout.xml
    <android.support.v4.widget.DrawerLayout 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/drawerLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        android:orientation="vertical">
    
        <android.support.design.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            tools:context=".MainActivity">
    
            <android.support.design.widget.AppBarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:theme="@style/AppTheme.AppBarOverlay">
    
                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    android:background="?attr/colorPrimary"
                    android:theme="@style/AppTheme.AppBarOverlay"
                    app:popupTheme="@style/AppTheme.PopupOverlay" />
    
            </android.support.design.widget.AppBarLayout>
    
            <include layout="@layout/menu" />
    
        </android.support.design.widget.CoordinatorLayout>
    
        <android.support.design.widget.NavigationView
            android:id="@+id/navigation"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/navigation_header"
            app:menu="@menu/menu_navigation">
    
        </android.support.design.widget.NavigationView>
    
    </android.support.v4.widget.DrawerLayout>

    navigation_header.xml
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@mipmap/navigation_header_bg" android:orientation="vertical"/>

    menu_navigation.xml
    <menu xmlns:android="http://schemas.android.com/apk/res/android">
        <item
            android:id="@+id/navigation_sub_setting"
            android:icon="@mipmap/icon_clinic_manager"
            android:title="  " />
        <item
            android:id="@+id/navigation_subheader"
            android:title="CaMnter">
            <menu>
                <item
                    android:id="@+id/navigation_sub_plan"
                    android:icon="@mipmap/icon_patient_list_book"
                    android:title="  " />
    
                <item
                    android:id="@+id/navigation_sub_share"
                    android:icon="@mipmap/icon_share"
                    android:title="  " />
                <item
                    android:id="@+id/navigation_sub_time"
                    android:icon="@mipmap/icon_time"
                    android:title="  " />
                <item
                    android:id="@+id/navigation_sub_clear"
                    android:icon="@mipmap/icon_schedule_clean"
                    android:title="    " />
            </menu>
        </item>
    </menu>

    NavigationViewイベント処理
    引き出しを閉じるDrawerLayout.closeDrawer(View drawerView)NavigationViewオプションリスニングイベントNavigationView.setNavigationItemSelectedListener(NavigationView.OnNavigationItemSelectedListener listener)の設定
        private DrawerLayout drawerLayout;
        private NavigationView navigationView;
        private NavigationView.OnNavigationItemSelectedListener navigationViewListener = new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem menuItem) {
                /** * NavigationView       * * id    NavigationView    menu itemid */
                switch (menuItem.getItemId()) {
                    case R.id.navigation_sub_setting:
                        break;
                    case R.id.navigation_subheader:
                        break;
                    case R.id.navigation_sub_plan:
                        break;
                    case R.id.navigation_sub_share:
                        break;
                    case R.id.navigation_sub_time:
                        break;
                    case R.id.navigation_sub_clear:
                        break;
                }
    
                //   
                drawerLayout.closeDrawer(navigationView);
                return false;
            }
        };
    
        private void settingNavigationView(){
            //   item     
            this.navigationView.setNavigationItemSelectedListener(this.navigationViewListener);
        }

    効果図