There does not exist an API for this use case, which means, that it should be handled manually. Instead of inflating menu items from resources (/res/menu), you should provide your custom layout via app:headerLayout, which simulates those menu items: this layout contains both header sections and menu items sections constructed with ordinary layout.
So, having defined your root layout like this:
<?xml version="1.0" encoding="utf-8"?>
<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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#7e25d1" />
<android.support.design.widget.NavigationView
android:id="@+id/navigation_view"
android:layout_width="300dp"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/navigation_view" />
</android.support.v4.widget.DrawerLayout>
Where navigation_view.xml is:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="@+id/include"
layout="@layout/header"
android:layout_width="match_parent"
android:layout_height="190dp" />
<FrameLayout
android:id="@+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
And header.xml is:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="190dp"
android:background="@drawable/background_material">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/profile_image"
android:layout_width="60dp"
android:layout_height="0dp"
android:layout_marginLeft="24dp"
android:layout_marginStart="16dp"
android:layout_marginTop="40dp"
android:src="@drawable/profile"
app:civ_border_color="#FF000000"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="4dp"
android:text="John Doe"
android:textColor="#FFF"
android:textSize="14sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="@+id/email"
app:layout_constraintLeft_toLeftOf="@+id/profile_image"
app:layout_constraintStart_toStartOf="@+id/profile_image" />
<TextView
android:id="@+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="john.doe@gmail.com"
android:textColor="#fff"
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="@+id/username"
app:layout_constraintStart_toStartOf="@+id/username" />
<ImageButton
android:id="@+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:background="?selectableItemBackgroundBorderless"
android:src="@drawable/ic_arrow_drop_down_black_24dp"
android:tint="#ffffff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</android.support.constraint.ConstraintLayout>
Then in activity:
public class MainActivity extends AppCompatActivity {
boolean initial = true;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
NavigationView navigationView = (NavigationView) findViewById(R.id.navigation_view);
View headerView = navigationView.getHeaderView(0);
ImageButton arrow = headerView.findViewById(R.id.arrow);
ViewGroup frame = headerView.findViewById(R.id.frame);
frame.setOnClickListener(v -> toggle(arrow, frame));
changeContent(frame);
arrow.setOnClickListener(v -> toggle(arrow, frame));
}
private void toggle(ImageButton arrow, ViewGroup frame) {
initial = !initial;
arrow.setImageDrawable(ContextCompat.getDrawable(MainActivity.this, initial ? R.drawable.ic_arrow_drop_down_black_24dp : R.drawable.ic_arrow_drop_up_black_24dp));
changeContent(frame);
}
private void changeContent(ViewGroup frame) {
frame.removeAllViews();
getLayoutInflater().inflate(initial ? R.layout.content1 : R.layout.content2, frame);
}
}
You'll get this output:
Provide your layout for content_1 and content_2 layout files to fit your use case.
