How to build Navigation Drawer?

Question

i'm trying to learn the navigation drawer but having a hard time learning the FrameLayout .

On the android website, it says a

FrameLayout to contain the main content (populated by a Fragment at runtime)

How would i include multiple fragments in the main_content? Lets say i have fragments A , B and C

Example;

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!-- The main content view -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <!-- The navigation drawer -->
    <ListView android:id="@+id/left_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp"
        android:background="#111"/>
</android.support.v4.widget.DrawerLayout>

The Fragment;

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="80dp"
    android:background="#8b0404"
    android:gravity="start">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="50dp"
        android:background="@drawable/logo"
        android:layout_alignTop="@+id/fragment"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="8dp"
        android:layout_marginLeft="150dp"
        />

</RelativeLayout>

I think your drawer layout is missing layout_gravity="start" — EpicPandaForce
– EpicPandaForce, Commented Jun 19, 2016 at 12:31

Kaushal Kishor · Accepted Answer · 2016-06-20 12:01:02Z

In activity.xml use the below code

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
tools:context=".MainActivity">
<include layout="@layout/toolbar" />

<android.support.v4.widget.DrawerLayout
    android:layout_width="match_parent"
    android:id="@+id/drawerLayout"
    android:layout_height="match_parent">

    <!-- activity view -->

    <!-- navigation drawer -->
    <RelativeLayout
        android:layout_gravity="left|start"
        android:layout_width="240dp"
       android:layout_height="match_parent">

        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:background="#e8e5e5"
            android:layout_height="match_parent"
            android:divider="#eee"
            android:dividerHeight="1dp" />
    </RelativeLayout>

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

In Activity.java use this one.

public class MainActivity extends ActionBarActivity {
private Toolbar toolbar;
private DrawerLayout drawerLayout;
private ActionBarDrawerToggle drawerToggle;
private ListView leftDrawerList;
private ArrayAdapter<String> navigationDrawerAdapter;
private String[] leftSliderData =
    {"item2",
    "item 2",
       .
       .
       .

   };

    private Integer[] imageId = {
    R.drawable.ic_1,
    R.drawable.ic_2,
    R.drawable.ic_3,
    R.drawable.ic_4,
    R.drawable.ic_5
    };

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

    leftDrawerList = (ListView) findViewById(R.id.left_drawer);
    CustomList adapter = new CustomList(MainActivity.this, leftSliderData,        imageId);

toolbar = (Toolbar) findViewById(R.id.toolbar);
drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
  leftDrawerList.setAdapter(adapter);

leftDrawerList.setSelector(R.drawable.list_bg);

leftDrawerList.setOnItemClickListener(new AdapterView.OnItemClickListener() {

    @Override
    public void onItemClick(AdapterView<?> parent, View view,
                            int position, long id) {
      //  Toast.makeText(MainActivity.this, "You Clicked at " +leftSliderData[+ position], Toast.LENGTH_SHORT).show();

        if (position == 0) {

            Intent in = new Intent(MainActivity.this, Activity1.class);
            startActivity(in);

        }

        if (position == 1) {

            Intent in = new Intent(MainActivity.this, Activity2.class);
            startActivity(in);

        }

        if(position == 2){

            Intent in = new Intent(MainActivity.this, Activity3.class);
            startActivity(in);

        }
        if(position == 3){

            Intent in = new Intent(MainActivity.this, Activity4.class);
            startActivity(in);

        }
        if(position == 4){

            Intent inw = new Intent(MainActivity.this, Activity5.class);
            startActivity(in);

        }

        if(position == 5){

            Intent in = new Intent(MainActivity.this, Activity6.class);
            startActivity(in);

        }
    }
});
 if (toolbar != null) {
    toolbar.setTitle("");
    setSupportActionBar(toolbar);
    toolbar.setLogo(R.drawable.small_logo);
}


drawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close) {

    @Override
    public void onDrawerClosed(View drawerView) {
        super.onDrawerClosed(drawerView);

    }

    @Override
    public void onDrawerOpened(View drawerView) {
        super.onDrawerOpened(drawerView);

    }
};
drawerLayout.setDrawerListener(drawerToggle);

}


@Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
drawerToggle.syncState();
}

@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
drawerToggle.onConfigurationChanged(newConfig);
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    onBackPressed();
    return true;
        }

@Override
public void onBackPressed() {

    Intent intent = new Intent(Intent.ACTION_MAIN);
    intent.addCategory(Intent.CATEGORY_HOME);
    intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
    startActivity(intent);

}

}

Evgeniy Mishustin · Accepted Answer · 2016-06-19 12:30:42Z

1

   <!-- The main content view -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
<fragment .../>
<fragment .../>
....
</FrameLayout>

FrameLayout is only a container - it may contain anything you want.

answered Jun 19, 2016 at 12:30

Evgeniy Mishustin

3,8144 gold badges48 silver badges89 bronze badges

Collectives™ on Stack Overflow

How to build Navigation Drawer?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related