NavigationView y diseño personalizado


82

Estoy usando las Bibliotecas de soporte de diseños NavigationViewcomo esta:

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

    <!-- put your main layout here -->
    <include layout="@layout/drawer_main_layout"/>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_height="match_parent"
        android:layout_width="wrap_content"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/drawer_view"/>

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

Y he configurado este menú:

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

    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav_home"
            android:icon="@drawable/ic_dashboard"
            android:title="Home" />
        <item
            android:id="@+id/nav_messages"
            android:icon="@drawable/ic_event"
            android:title="Messages" />
        <item
            android:id="@+id/nav_friends"
            android:icon="@drawable/ic_headset"
            android:title="Friends" />
        <item
            android:id="@+id/nav_discussion"
            android:icon="@drawable/ic_forum"
            android:title="Discussion" />
    </group>

    <item android:title="Sub items">
        <menu>
            <item
                android:icon="@drawable/ic_dashboard"
                android:title="Sub item 1" />
            <item
                android:icon="@drawable/ic_forum"
                android:title="Sub item 2" />
        </menu>
    </item>

</menu>

¿Hay alguna forma de usar NavigationView con un diseño en lugar de un menú?


¿No puede simplemente usar la vista de encabezado, el archivo nav_header?
— RuAware

Quiero la vista del encabezado y quiero que en lugar del menú use un diseño personalizado
— Panayiotis Irakleous

Respuestas:


186

Así es como lo resolví y funcioné perfectamente:

<android.support.design.widget.NavigationView
    android:id="@+id/navigation"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true">

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

        <include layout="@layout/nav_header" />

        <ListView
            android:id="@+id/lst_menu_items"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />
    </LinearLayout>
</android.support.design.widget.NavigationView>

¡Manera perfecta! Estaba cansado de encontrar esto, pero estúpido de mi parte, ¿por qué no intenté expandir las etiquetas de cierre? ¡Buena esa! ¡Necesitaba un ListView explicable en realidad!
— sud007

2
¿Esto dibuja la vista del encabezado debajo de la barra de estado?
— marilion91

Sí, seguro, ya que sigue siendo parte de NavigationView.
— Hamzeh Soboh

esta es la única solución de trabajo basada en XML que he encontrado hasta ahora. +1
— michnovka

¿Alguien podría dar un enlace de referencia para esta solución? porque intenté esto pero tengo problemas.
— realpranav

34

Sí, puede ... Como yo lo he hecho ... Simplemente tome su diseño personalizado dentro de NavigationView

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer"
    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.NavigationView
        android:id="@+id/navView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start">

        <ListView
            android:entries="@array/test"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

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

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

El código anterior funciona para mí ... Pero no olvide eliminar app:menude NavigationView. De lo contrario, se superpondrá a su vista personalizada en los elementos del menú.


1
La vista de lista aparece sobre la vista de encabezado. ¿Cómo ponerlo debajo de headerview?
— Sudheesh Mohan

Si está usando ListViewuna vista secundaria, no puede usar NavigationView'sHeader. Entonces, si está utilizando ListView, puede agregar headerView en formato ListView.
— Moinkhan

1
Cuando agregué headerview en Listview, headerview desapareció. código <ListView app: headerLayout = "@ layout / nav_header" android: entries = "@ array / test" android: layout_width = "match_parent" android: layout_height = "match_parent" />
— Sudheesh Mohan

Bro, actualmente, la biblioteca de soporte de diseño tiene errores ... Puedes hacerlo. Si desea agregar headerview, lo ha inflado y agregado en listview programáticamente ..
— Moinkhan

7
¿Qué ofrece NavigationView más si usamos ListView dentro de él con una fila personalizada como lo estamos haciendo hasta ahora?
— Davideas
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.