How to implement Expandable android navigation drawer with subitems?

Question

How to implement android navigation drawer like this?

TopLevelView1 ~ TopLevelView4 can select and no children
TopVevelView5 can collaspe

My question is

Answer 1

Try something like that

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

    <FrameLayout
        android:id="@+id/drawer_list_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start" >

        <ExpandableListView
            android:id="@+id/drawer_list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"/>
    </FrameLayout>
</android.support.v4.widget.DrawerLayout>

Java code:

drawerListView.setAdapter(new ExpandableListAdapter() {

            @Override
            public void unregisterDataSetObserver(DataSetObserver observer) {
                // TODO Auto-generated method stub

            }

            @Override
            public void registerDataSetObserver(DataSetObserver observer) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onGroupExpanded(int groupPosition) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onGroupCollapsed(int groupPosition) {
                // TODO Auto-generated method stub

            }

            @Override
            public boolean isEmpty() {
                // TODO Auto-generated method stub
                return false;
            }

            @Override
            public boolean isChildSelectable(int groupPosition, int childPosition) {
                // TODO Auto-generated method stub
                return false;
            }

            @Override
            public boolean hasStableIds() {
                // TODO Auto-generated method stub
                return true;
            }

            @Override
            public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
                // TODO Auto-generated method stub
                TextView view = new TextView(getApplicationContext());
                view.setText("group " + groupPosition);
                return view;
            }

            @Override
            public long getGroupId(int groupPosition) {
                // TODO Auto-generated method stub
                return groupPosition;
            }

            @Override
            public int getGroupCount() {
                // TODO Auto-generated method stub
                return 5;
            }

            @Override
            public Object getGroup(int groupPosition) {
                // TODO Auto-generated method stub
                return null;
            }

            @Override
            public long getCombinedGroupId(long groupId) {
                // TODO Auto-generated method stub
                return 0;
            }

            @Override
            public long getCombinedChildId(long groupId, long childId) {
                // TODO Auto-generated method stub
                return 0;
            }

            @Override
            public int getChildrenCount(int groupPosition) {
                // TODO Auto-generated method stub
                return 5;
            }

            @Override
            public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView,
                    ViewGroup parent) {
                TextView view = new TextView(getApplicationContext());
                view.setText("child " + groupPosition);
                return view;
            }

            @Override
            public long getChildId(int groupPosition, int childPosition) {
                // TODO Auto-generated method stub
                return childPosition ;
            }

            @Override
            public Object getChild(int groupPosition, int childPosition) {
                // TODO Auto-generated method stub
                return null;
            }

            @Override
            public boolean areAllItemsEnabled() {
                // TODO Auto-generated method stub
                return false;
            }
        });

Answer 2

For navigation:

• Alternative 1:

  Sliding Menu, which I would definitely go with. Even used by popular application like LinkedIn and Foursquare and easy to implement and use. Full explanation and example source codes: SlidingMenu - GitHub

• Alternative 2:

  Android Navigation Drawer. If you want to fully customise everything yourself without using any libraries, this is your option. You can check codes and how to do it from Android Developers website: Creating a Navigation Drawer

View inside your navigation drawer / sliding menu:

• Alternative 1:

  Android default ExpandableListView. Links: Android Developers , androidhive

• Alternative 2:

  AnimatedExpandableListView, which is implemented from ExpandableListView, but when an item is clicked, the expand is done with a smooth animation which you may prefer to use for a better look. AnimatedExpandableListView