1

Hello everyone,

I am a newcomer to Android programming and currently working on a practice app that is more or less a patchwork of tutorial codes.

Right now I have navigation drawer below toolbar. I would like to readjust xml hierarchy so that it stays consistent with Material Design guideline and have navigation drawer above toolbar. It seems like a simple enough task, but for the life of me I can't seem to get it.

Can anyone offer any suggestions?

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

    <android.support.v7.widget.Toolbar
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/primary_color"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        apps:title="@string/app_name"/>

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

        <FrameLayout
            android:id="@+id/frame_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
        </FrameLayout>

        <android.support.design.widget.NavigationView
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:apps="http://schemas.android.com/apk/res-auto"
            android:id="@+id/navigation_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            apps:itemTextColor="#000"
            android:fitsSystemWindows="true"
            apps:headerLayout="@layout/navigation_header"
            apps:menu="@menu/drawer_menu"/>

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

</LinearLayout>

package android.dohyun.projectannie;

import android.os.Bundle;
import android.support.design.widget.NavigationView;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;

public class MainActivity extends AppCompatActivity {

    DrawerLayout mDrawerLayout;
    NavigationView mNavigationView;
    FragmentManager mFragmentManager;
    FragmentTransaction mFragmentTransaction;

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

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mNavigationView = (NavigationView) findViewById(R.id.navigation_view);



        mFragmentManager = getSupportFragmentManager();
        mFragmentTransaction = mFragmentManager.beginTransaction();
        mFragmentTransaction.replace(R.id.frame_layout, new NotesFragment()).commit();

        mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem menuItem) {
                mDrawerLayout.closeDrawers();

                if(menuItem.getItemId() == R.id.menu_notes) {
                    FragmentTransaction fragmentTransactionNotes = mFragmentManager.beginTransaction();
                    fragmentTransactionNotes.replace(R.id.frame_layout, new NotesFragment()).commit();
                }
                if(menuItem.getItemId() == R.id.menu_folders) {
                    FragmentTransaction fragmentTransactionFolders = mFragmentManager.beginTransaction();
                    fragmentTransactionFolders.replace(R.id.frame_layout, new FoldersFragment()).commit();
                }
                if(menuItem.getItemId() == R.id.menu_trash) {
                    FragmentTransaction fragmentTransactionTrash = mFragmentManager.beginTransaction();
                    fragmentTransactionTrash.replace(R.id.frame_layout, new TrashFragment()).commit();
                }
                if(menuItem.getItemId() == R.id.menu_settings) {
                    FragmentTransaction fragmentTransactionSettings = mFragmentManager.beginTransaction();
                    fragmentTransactionSettings.replace(R.id.frame_layout, new SettingsFragment()).commit();
                }
                if(menuItem.getItemId() == R.id.menu_info) {
                    FragmentTransaction fragmentTransactionInfo = mFragmentManager.beginTransaction();
                    fragmentTransactionInfo.replace(R.id.frame_layout, new InfoFragment()).commit();
                }

                return false;
            }
        });

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, R.string.app_name, R.string.app_name);

        mDrawerLayout.setDrawerListener(mDrawerToggle);
        mDrawerToggle.syncState();

    }
}

The above code is a slightly modified version of the one found here, written by Ratan: https://androidbelieve.com/navigation-drawer-with-swipe-tabs-using-design-support-library/

Harry Kim
  • 11
  • 3

1 Answers1

0

DrawerLayout is a special FrameLayout that supports navigation drawer.

The child view that doesn't have a layout_gravity is the main view. The child view that has a layout_gravity e.g. android:layout_gravity="start" is the nav drawer.

This means that DrawerLayout should be the top level view group. In other words, put your layout with the Toolbar inside the DrawerLayout.

kris larson
  • 30,387
  • 5
  • 62
  • 74