Drawer Menu

Projekt erstellen

• Sprache Java wählen

Dependencies prüfen

In Android Studio unter

• Gradle Scripts
  • build.gradle

ist die Dependency

'com.google.android.material:material:1.5.0'

erforderlich.

Menü erstellen

Über Rechtsklick auf res

• New
  • Android Resource File

erstellen

/menu/navigation_menu.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav_home"
            android:title="home" />
        <item
            android:id="@+id/nav_firstFragment"
            android:title="first fragment" />
        <item
            android:id="@+id/nav_secondFragment"
            android:title="secound fragment" />
        <item
            android:id="@+id/nav_settings"
            android:title="Settings" />
        <item android:title="-"/>
    </group>
</menu>

strings xml anpassen

/res/values/strings.xml

<resources>
    <!-- to toggle the open close button of the navigation drawer -->
    <string name="nav_open">Open</string>
    <string name="nav_close">Close</string>
</resources>

Fragments erstellen

• New
  • Fragment
    • Fragment (Blank)

MainActivity anpassen

MainActivity xml

/res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.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/dlMain"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <!-- in the Frame the fragments will be replaced -->
    <FrameLayout
        android:id="@+id/flContent"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <!-- include the menu created in the menu folder -->
    <com.google.android.material.navigation.NavigationView
        android:id="@+id/nvView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/navigation_menu"
        tools:ignore="VisualLintBounds" />

</androidx.drawerlayout.widget.DrawerLayout>

MainActivity java

import androidx.annotation.NonNull;
import androidx.appcompat.app.ActionBarDrawerToggle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.drawerlayout.widget.DrawerLayout;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import android.os.Bundle;
import android.view.MenuItem;
import com.google.android.material.navigation.NavigationView;

public class MainActivity extends AppCompatActivity {

    // main menu
    private DrawerLayout drawerLayout;
    private ActionBarDrawerToggle actionBarDrawerToggle;
    private NavigationView navigationView;

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

        // drawer layout instance to toggle the menu icon to open and close
        drawerLayout = findViewById(R.id.dlMain);
        actionBarDrawerToggle = new ActionBarDrawerToggle(this, drawerLayout, R.string.nav_open, R.string.nav_close);

        // pass the Open and Close toggle for the drawer layout listener to toggle the button
        drawerLayout.addDrawerListener(actionBarDrawerToggle);
        actionBarDrawerToggle.syncState();

        // make the navigation drawer icon always appear on the action bar
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        // setup the navigation in an own methode
        navigationView = findViewById(R.id.nvView);
        setupDrawerContent(navigationView);

        // sets the fragment on startup
        selectDrawerItem(navigationView.getMenu().findItem(R.id.nav_home));
    }

    // function to implement the item click listener callback to open and close the navigation drawer if the icon is clicked
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        if (actionBarDrawerToggle.onOptionsItemSelected(item)) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    // if an item in the navigation is clicked, call the selectDrawerItem methode
    private void setupDrawerContent(@NonNull NavigationView navigationView) {
        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                selectDrawerItem(item);
                return true;
            }
        });
    }

    private void selectDrawerItem(MenuItem item) {
        Fragment fragment = null;
        Class fragmentClass;

        // select the navigation and set the right fragment class
        int itemId = item.getItemId();
        if (itemId == R.id.nav_home)
            fragmentClass = HomeFragment.class;
        else if (itemId == R.id.nav_firstFragment)
            fragmentClass = FirstFragment.class;
        else if (itemId == R.id.nav_secondFragment)
            fragmentClass = SecondFragment.class;
        else
            fragmentClass = HomeFragment.class;

        // create a new fragment instance
        try {
            fragment = (Fragment) fragmentClass.newInstance();
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        } catch (InstantiationException e) {
            e.printStackTrace();
        }

        // replace the right fragment in the frame layout
        FragmentManager fragmentManager = getSupportFragmentManager();
        fragmentManager.beginTransaction()
                .replace(R.id.flContent, fragment)
                .commit();

        item.setChecked(true);

        setTitle(item.getTitle());

        // close the navigation after selecting an item
        drawerLayout.close();
    }
}

Standard Drawer von Android Studio verwenden

In Android Studio gibt es eine Standardvorlage für ein Drawer Menü.

Diese ist Standardmäßig nicht lauffähig. Damit es funktioniert muss folgendes im build.gradle file hinzugefügt werden.

dependencies {

    constraints {
        implementation("org.jetbrains.kotlin:kotlin-stdlib-jdk7:1.8.0") {
            because("kotlin-stdlib-jdk7 is now a part of kotlin-stdlib")
        }
        implementation("org.jetbrains.kotlin:kotlin-stdlib-jdk8:1.8.0") {
            because("kotlin-stdlib-jdk8 is now a part of kotlin-stdlib")
        }
    }

...

Neuen Menüpunkt erstellen

1. Neues Fragment hinzufügen
2. Fragment der Navigation hinzufügen

/res/navigation.xml

<fragment
    android:id="@+id/nav_test"
    android:name="de.devcodemonkey.ap.praxiswoche.myapplication.TestFragment"
    android:label="Test"
    tools:layout="@layout/fragment_test"/>

3. Menü item hinzufügen

/res/menu/activity_main_drawer.xml

<item
    android:id="@+id/nav_test"
    android:icon="@drawable/ic_menu_slideshow"
    android:title="@string/test" />