Customize NavigationView item

Question

How to customize NavigationView item in android support design library? For example I want customize text View of item or image View of Item I want add xml Layout for every row of navigationView List, like ListView Adapter. Please help me.

Answer 1

You can just create a custom view entirely for the navigationView. In the below example Im using a fragment container inside the navigation view and then customizing the fragment how I want.

In your Activity Layout

<androidx.drawerlayout.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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".view_controllers.diagrams.DiagramEditorScreen"
    android:id="@+id/diagramEditorMainDrawerLayout"
>
.... {your activity layout}
    <com.google.android.material.navigation.NavigationView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:id="@+id/diagramEditorSlideInMenuNavigationView"
            app:itemTextColor="@color/white"
    >
        <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/diagramEditorSlideInMenuFragmentHolder"
        >
        </FrameLayout>
    </com.google.android.material.navigation.NavigationView>
</androidx.drawerlayout.widget.DrawerLayout>

Layout for fragment that I use inside navigationView

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
>


    <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@string/tools"
            android:textAllCaps="true"
            android:gravity="start"
            android:layout_marginStart="10dp"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="2dp"
            android:layout_marginEnd="10dp"
            android:fontFamily="@font/trade_gothic_next_lt_pro_bd"
            android:textColor="@color/mediumGray"
            android:textSize="16sp"
    />
    <View
            android:layout_width="match_parent"
            android:layout_height="2dp"
            android:background="@color/mediumGray"
            android:layout_marginStart="10dp"
    />


    <androidx.recyclerview.widget.RecyclerView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:id="@+id/fragmentBrushesRecyclerView"
            android:layout_weight="1"
            android:layout_marginTop="10dp"
    >
    </androidx.recyclerview.widget.RecyclerView>


</LinearLayout>

In your Activity onCreate method add listeners

val actionDrawerToggle = ActionBarDrawerToggle(this, diagramEditorMainDrawerLayout, R.string.open, R.string.close)
diagramEditorMainDrawerLayout.addDrawerListener(actionDrawerToggle)
actionDrawerToggle.syncState()

and when you are ready to show the navigationView you can just replace the fragment within the navigationView and openDrawer() . I use this functionality to replace navigationView with several different fragments.

supportFragmentManager.beginTransaction()
    .replace(R.id.diagramEditorSlideInMenuFragmentHolder, {your-fragment}, {your-fragment-tag})
    .commit()

diagramEditorMainDrawerLayout.openDrawer(GravityCompat.START)

Note: The above is done with androidX. if you are not using androidX, your layout call to navigationView should be

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

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