java 导航抽屉 - 带有 ListView 的标题视图

Navigation drawer - Header View with ListView

提问by Psypher

I'm currently creating and defining a navigation drawer. I want now a header view, like their on the google apps, above the item rows. I only found examples with RecyclerViews, and i dont want to use it. I have all finished with a ListView and all other stuff. Maybe someone can help me :) Thanks in advance

我目前正在创建和定义一个导航抽屉。我现在想要一个标题视图，就像他们在谷歌应用程序上一样，位于项目行上方。我只找到了 RecyclerViews 的例子，我不想使用它。我已经完成了一个 ListView 和所有其他的东西。也许有人可以帮助我:) 提前致谢

回答by Psypher

You can create NavigationViewusing android design support library without having pain to create listview or RecyclerView, its all created by android.

您可以NavigationView使用 android 设计支持库进行创建，而无需创建 listview 或 RecyclerView，它们都是由 android 创建的。

To add it to your project you need to add the android design support library to your project, add below line in build.gradle

要将其添加到您的项目中，您需要将 android 设计支持库添加到您的项目中，在 build.gradle 中添加以下行

compile 'com.android.support:design:22.2.0

Check out android design support features here

在此处查看 android 设计支持功能

First create a header(header.xml)

首先创建一个header(header.xml)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="190dp"
    android:background="@drawable/background_material"
    android:orientation="vertical"
    >
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="nyname"
</RelativeLayout>

Next create a menu resource file, the items in the menu will be the items displayed in the drawer(drawer.xml)

接下来创建一个菜单资源文件，菜单中的项目将是抽屉中显示的项目（drawer.xml）

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single">

        <item
            android:id="@+id/first1"
            android:checked="false"
            android:icon="@drawable/icon1"
            android:title="@string/string1" />

        <item
            android:id="@+id/second2"
            android:checked="false"
            android:icon="@drawable/icon2"
            android:title="@string/string2" />
</menu>

Next create a DrawerLayoutfile, within the drawerlayout you can see I have included a Toolbarand a 'FrameLayout`. When the item in the drawerlayout is clicked you can replace fragment.

接下来创建一个DrawerLayout文件，在 drawerlayout 中，您可以看到我包含了一个Toolbar和一个“FrameLayout”。单击抽屉布局中的项目时，您可以替换片段。

Also within it is the NavigationView with these parameters:

其中还有带有这些参数的 NavigationView：

app:headerLayout="@layout/header" 
app:menu="@menu/drawer"
android:layout_gravity="start"

app:headerLayoutis the header.xml that we created in step 1. app:menuis the menu resource item i.e drawer.xml

app:headerLayout是我们在步骤 1 中创建的 header.xml。 app:menu是菜单资源项，即 drawer.xml

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:orientation="vertical"
        >
        <include
            android:id="@+id/toolbar" 
            layout="@layout/tool_bar"
        />
        <FrameLayout
            android:id="@+id/frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </FrameLayout>

    </LinearLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_height="match_parent"
        android:layout_width="wrap_content"
        android:layout_gravity="start"
        app:headerLayout="@layout/header"
        app:menu="@menu/drawer"
        />
</android.support.v4.widget.DrawerLayout>

Next in your MainActivity extend AppcompatActivity,

接下来在您的 MainActivity 中扩展 AppcompatActivity，

public class MainActivity extends AppCompatActivity {
............................................

Intialise NavigationView and call setNavigationItemSelectedListener to get click events,

初始化 NavigationView 并调用 setNavigationItemSelectedListener 获取点击事件，

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

    // Initializing Toolbar and setting it as the actionbar
    toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    //Initializing NavigationView
    navigationView = (NavigationView) findViewById(R.id.navigation_view);

    //Setting Navigation View Item Selected Listener to handle the item click of the navigation menu
    navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {

        // This method will trigger on item Click of navigation menu
        @Override
        public boolean onNavigationItemSelected(MenuItem menuItem) {

            //Checking if the item is in checked state or not, if not make it in checked state
            if(menuItem.isChecked()) menuItem.setChecked(false);
            else menuItem.setChecked(true);

            //Closing drawer on item click
            drawerLayout.closeDrawers();

            //Check to see which item was being clicked and perform appropriate action
            switch (menuItem.getItemId()){
                //Replacing the main content with ContentFragment 
                case R.id.first1:
                    SomeFragment fragment = new SomeFragment();
                    android.support.v4.app.FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
                    fragmentTransaction.replace(R.id.frame,fragment);
                    fragmentTransaction.commit();
                    return true;
                ...................

Step by step procedure to create navigationview go here

创建导航视图的分步过程到这里

How it would look:

看起来如何：