マテリアルデザインのナビゲーションビュー

NavigationView（ナビゲーションビュー）には2つの部分があり、ヘッドはレイアウトをロードでき、メニューバーはメニューファイルをロードできます。通常、DrawerLayoutで使用されます。NavigationViewは、設計サポートライブラリによって提供されます。最初に依存ライブラリを追加します。

    compile 'com.android.support:design:24.2.1'
    compile 'de.hdodenhof:circleimageview:2.1.0'

2つの依存関係ライブラリがここに追加されます。1つはデザインサポートライブラリ、2つ目はオープンソースコントロールで、画像を円形に表示するために使用されます。

次に、メニューファイルとヘッダーレイアウトファイルを記述して、NavigationViewのヘッダーとメニューバーを読み込みます。

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/call"
            android:icon="@drawable/nav_call"
            android:title="电话"
            />
        <item
            android:id="@+id/friends"
            android:icon="@drawable/nav_friends"
            android:title="好友"
            />
        <item
            android:id="@+id/location"
            android:icon="@drawable/nav_location"
            android:title="位置"
            />
        <item
            android:id="@+id/mail"
            android:icon="@drawable/nav_mail"
            android:title="邮件"
            />
    </group>
</menu>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="180dp"
    android:background="?attr/colorPrimary"
    android:padding="10dp">

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/circleImageView"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="33dp"
        android:src="@drawable/mn" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/circleImageView"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="13dp"
        android:text="我在等待，一个有你的未来！"
        android:textColor="#fff"
        android:textSize="12sp" />

</RelativeLayout>

メニューファイルでは、最初にグループを記述し、設定グループのみ選択できます。CircleImageView（画像が円に変更されます）とTextViewがレイアウトファイルに配置されます。

メインレイアウトファイルにNavigationViewコントロールを追加します。

<RelativeLayout 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_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.administrator.navigtionviewtest1.MainActivity">

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/nav_menu"></android.support.design.widget.NavigationView>
</RelativeLayout>

app：headerLayout =” @ layout / nav_header”はヘッダービューをロードします
app：menu =” @ menu / nav_menu”はメニューオプションをロードします

xmlns：app =” http://schemas.android.com/apk/res-auto”は新しい名前空間を追加することに注意してください

次に、コードに論理イベントを記述します。

public class MainActivity extends AppCompatActivity {

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

        NavigationView navigationView = (NavigationView) findViewById(R.id.navigation_view);
        navigationView.setCheckedItem(R.id.call);//设置默认选中项
        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            //设置点击事件
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                Toast.makeText(MainActivity.this, "" + item.getTitle(), Toast.LENGTH_SHORT).show();
                return true;
            }
        });
    }
}