Navigation drawer in android is not full screen

Question

Since the google has introduced the navigation drawer, I tried to use this component to create a facebook-like menu. The problem is , the visual effect is seems to be different.

The google one has the action bar retain when the drawer is open while the facebook one does not.Instead, the whole screen has pushed to right side

I have found there are some lib can achieve this, but since I prefer not include third party lib in the project, are there any way to achieve this ? Thanks

Code based on navigation drawer tutorial

protected void setupMenu(List<String> list, final ListView menu) {
        Adapter customAdapter = new Adapter(getActionBar().getThemedContext(),
                R.layout.item, list);
        menu.setAdapter(customAdapter);
        menu.setOnItemClickListener(new OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    final int pos, long id) {
                String selected = ((TextView) view.findViewById(R.id.itemTxt))
                        .getText().toString();
                // define pass data
                final Bundle bData = new Bundle();
                bData.putString("itemSelect", selected);

                drawer.setDrawerListener(new DrawerLayout.SimpleDrawerListener() {
                    @Override
                    public void onDrawerClosed(View drawerView) {
                        super.onDrawerClosed(drawerView);
                        FragmentTransaction tx = getSupportFragmentManager()
                                .beginTransaction();
                        tx.replace(R.id.mainContent, Fragment.instantiate(
                                MainActivity.this,
                                "com.example.utilities.ContentPage", bData));
                        tx.commit();
                    }
                });

                drawer.closeDrawer(menu);
            }
        });

    }

Answer 1

Well creating a custom navigation drawer is the best solution for you. I understand you do not want to use third party but this can be a quick solution to your problem Sliding Menu Lib link.

Answer 2

Hope this Helps.

  <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="true"
        >
        <include
            layout="@layout/nav_header_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"

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

Remove the last two lines in the default code

app:headerLayout="@layout/nav_header_main"
app:menu="@menu/activity_main_drawer"

Answer 3

Here is a quick solution that worked for me :

<include
        android:id="@+id/left_drawer"
        android:orientation="vertical"
        **android:layout_width="320dp"**
        android:layout_height="match_parent"
        android:layout_gravity="start"
        layout="@layout/drawer"/>

Set width of included layout . For devices with different screen size you can dynamically set the width of this included layout .

All the best !!!!

Answer 4

If you will check source code of DrawerLayout, you will see, that resposnible for this minimum margin is the variable mMinDrawerMargin

So, there are atleast 2 solutions(tricks) 1. extend DrawerLayout and set this variable to 0 with reflection. call this method from all constructors.

private void init() {
    try {
        Field declaredField = getClass().getSuperclass().getDeclaredField("mMinDrawerMargin");
        declaredField.setAccessible(true);

        declaredField.setInt(declaredField, 0);
    } catch (NoSuchFieldException e) {
        e.printStackTrace();
    } catch (IllegalAccessException e) {
        e.printStackTrace();
    }
}

2. not so tricky

overryde onMeasure method like this

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    // taken from parents logic
    float density = this.getResources().getDisplayMetrics().density;
    int minMargin = (int) (64.0F * density + 0.5F);

    int widthMode = MeasureSpec.getMode(widthMeasureSpec);
    int widthSize = MeasureSpec.getSize(widthMeasureSpec);

    int newWidth = MeasureSpec.makeMeasureSpec(widthSize + minMargin, widthMode);

    super.onMeasure(newWidth, heightMeasureSpec);
}

I also created sample project here https://bitbucket.org/wnc_21/fsnavigationdrawer

Answer 5

this problem is caused by margin so we have to reset the width : i solved this problem by implementing DrawerListener and wrapping ListView inside a LinearLayout for making rooms for other views beside list view

here is my listener

public class NavigationDrawer implements DrawerLayout.DrawerListener {

    private DrawerLayout mDrawerLayout;
    protected boolean expanded = false;

    NavigationDrawer(Activity activity) {
        this.activity = activity;
    }

    public NavigationDrawer bindDrawerLayout(int id) {
        mDrawerLayout = (DrawerLayout) activity.findViewById(id);
        mDrawerLayout.setDrawerListener(this);
        return this;
    }


    @Override
    public void onDrawerSlide(View drawerView, float slideOffset) {
        if (!expanded) {
            Log.i("margin", "here we are");
            LinearLayout layout = (LinearLayout) findViewById(R.id.left_drawer);
            layout.getLayoutParams().width = getResources().getDisplayMetrics().widthPixels;
            layout.requestLayout();
            expanded = true;
        }
    }

    @Override
    public void onDrawerOpened(View drawerView) {
    }

    @Override
    public void onDrawerClosed(View drawerView) {
    }

    @Override
    public void onDrawerStateChanged(int newState) {

    }

}

here is my layout :

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/application_drawer_layout"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:background="#ffffff">

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

    <LinearLayout
        android:id="@+id/left_drawer"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="start"
        android:background="#000000"
        android:orientation="vertical">

        <ListView
            android:id="@+id/application_left_drawer"
            android:layout_width="fill_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:background="#111"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp" />
    </LinearLayout>
</android.support.v4.widget.DrawerLayout>

Answer 6

If you want to implement like facebook sliding menu, then you to use androids SlidingPaneLayout instead of NavigationDrawer.

<android.support.v4.widget.SlidingPaneLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout android:layout_width="250dp"
        android:layout_height="match_parent"
        android:background="#CC00FF00" />

    <LinearLayout android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="match_parent"
        android:background="#CC0000FF" >
        // add toolbar and other required layouts
    </LinearLayout>
</android.support.v4.widget.SlidingPaneLayout>

add toolbar instead of actionbar and apply no actionbar theme.