Разработка модального навигационного ящика в Android Studio

Question

Я работаю над пользовательским интерфейсом для личного проекта (приложение для сканирования OCR).Моя цель - создать модальный навигационный ящик (как определено Material Design: https://material.io/design/components/navigation-drawer.html#modal-drawer), но я не уверен, как.

Я хочу, чтобы навигационный ящик выглядел так: https://imgur.com/Ccn6xwe

В настоящее время я смог кодировать: https://imgur.com/258AzB4

Файл макета (main_nav_drawer.xml):

<android.support.v4.widget.DrawerLayout

    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/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar" />

</FrameLayout>


<android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="false"
        app:menu="@menu/main_nav_drawer_drawer"/>

Файл макета (main_nav_drawer_drawer.xml) для пунктов меню (в res / menu):

<menu 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"
  tools:showIn="navigation_view">

<group android:checkableBehavior="single">
    <item
        android:id="@+id/nav_Home"
        android:title="@string/nav_Home"
        android:onClick="onHomeClick"/>
    <item
        android:id="@+id/nav_Scanner"
        android:title="@string/nav_Scanner"
        android:onClick="onScannerlick"/>
    <item
        android:id="@+id/nav_MyFiles"
        android:title="@string/nav_Files"
        android:onClick="onFileClick"/>
    <item
        android:id="@+id/nav_Settings"
        android:title="@string/nav_Settings"
        android:onClick="onSettingsClick"/>
    <item
        android:id="@+id/nav_Share"
        android:title="@string/nav_Share"
        android:onClick="onShareClick"/>
</group>

Я создал действие Navigation Drawer в папке res, которое автоматически генерировало эти файлы макетов вместе с другим макетомфайлы (я не понимаю назначение этих файлов):

app_bar_main_nav_drawer.xml

content_main_nav_drawer.xml

Моя активность в области навигации (в Java) выглядит следующим образом:

public class MainNavDrawer extends AppCompatActivity
    implements NavigationView.OnNavigationItemSelectedListener {

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

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);


    FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
    fab.setOnClickListener(new View.OnClickListener()

    {

        @Override
        public void onClick(View view)

        {
            Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                    .setAction("Action", null).show();
        }

    });

    DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
    ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
            this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
    drawer.addDrawerListener(toggle);
    toggle.syncState();

    NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
    navigationView.setNavigationItemSelectedListener(this);
}

@Override
public void onBackPressed() {
    DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
    if (drawer.isDrawerOpen(GravityCompat.START)) {
        drawer.closeDrawer(GravityCompat.START);
    } else {
        super.onBackPressed();
    }
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main_nav_drawer, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item)
{
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}

@SuppressWarnings("StatementWithEmptyBody")
@Override
public boolean onNavigationItemSelected(MenuItem item) {
    // Handle navigation view item clicks here.
    int id = item.getItemId();

    if (id == R.id.nav_scanner)

    {

        // Handle the camera action

    }

    else if (id == R.id.nav_home)

    {



    }

    else if (id == R.id.nav_about)

    {



    }

    else if (id == R.id.nav_myfiles)

    {



    }

    else if (id == R.id.nav_settings)

    {



    }

    DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
    drawer.closeDrawer(GravityCompat.START);
    return true;

    }
 }

Для контекста моя домашняя страница выглядит следующим образом: https://imgur.com/6nxvLxM

В чем мне нужна помощь: мне удалось удалить заголовок из ящика навигации, но я не знаю, какотформатировать пункты меню для достижения моей цели дизайна, и я не знаю, как добавить значок меню (три строкиs) так, что когда пользователь нажимает его, он открывает навигационную панель, которая частично покрывает любую страницу, на которой он находится.