sliding menu using jfeinstein10 library

Question

I created a sample application to test how sliding menu works. Shown below in the screenshot is what i get as of now. But when I click on the categories button (shown in image below) I should get a secondary menu as shown in the zomato app's screenshot below. How can I do this ? Am I proceeding in the correct way or not?

my SlidingFragmentActivity :

@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        con = this;
        setSlidingActionBarEnabled(false);
        setContentView(R.layout.main);
        sm = getSlidingMenu();
        sm.setMode(SlidingMenu.RIGHT);
        sm.setShadowDrawable(R.drawable.shadowright);
        sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_NONE);
        sm.setBehindScrollScale(1.0f);
        sm.setShadowWidthRes(R.dimen.shadow_width);
        sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);
        sm.setFadeDegree(0.5f);
        //sm.setSecondaryMenu(R.layout.properties);
        //sm.setSecondaryShadowDrawable(R.drawable.shadow);
        setTitle("Sliding Bar");

        // set the Behind View
        setBehindContentView(R.layout.menu_frame);
        FragmentTransaction t = this.getSupportFragmentManager()
                .beginTransaction();
        mFrag = new SampleListFragment();
        t.replace(R.id.menu_frame, mFrag);
        t.commit();
    }

my SampleListFragment :

public class SampleListFragment extends SherlockFragment {
    private static final String[] Radio_buttons = new String[] { "Distance",
            "Rating" };

    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.list, container, false);
        ListView radio_list = (ListView) view.findViewById(R.id.RadioList);
        Button categories = (Button) view.findViewById(R.id.sampleButton);
        radio_list
                .setAdapter(new ArrayAdapter<String>(MainActivity.con,
                        android.R.layout.simple_list_item_single_choice,
                        Radio_buttons));

        radio_list.setItemsCanFocus(true);
        radio_list.setChoiceMode(ListView.CHOICE_MODE_SINGLE);
        categories.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                MainActivity.sm.showSecondaryMenu();
            }
        });
        return view;
    }
}

main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="Sliding menu demo...!!!" />

</RelativeLayout>

menu_frame.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/menu_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

list.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/scroller"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fillViewport="true" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#ffffff"
                android:paddingLeft="10dp"
                android:text="SEARCH"
                android:textColor="#FF3300"
                android:textSize="20dp" >
            </TextView>
        </LinearLayout>

        <RelativeLayout
            android:id="@+id/searchTextLayout"
            android:layout_width="match_parent"
            android:layout_height="50dip"
            android:layout_marginBottom="20dip"
            android:layout_marginLeft="20dip"
            android:layout_marginRight="20dip"
            android:layout_marginTop="20dip" >

            <ImageButton
                android:id="@+id/searchTextButton"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentLeft="true"
                android:background="#685E5C"
                android:scaleType="fitCenter"
                android:src="@drawable/abs__ic_search" />

            <EditText
                android:id="@+id/searchText"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_toRightOf="@id/searchTextButton"
                android:background="@drawable/background_black_border_full"
                android:padding="8dp"
                android:textColor="@android:color/white" />
        </RelativeLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#ffffff"
                android:paddingLeft="10dp"
                android:text="SORT BY"
                android:textColor="#FF3300"
                android:textSize="20dp" >
            </TextView>
        </LinearLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="134dp" >

            <ListView
                android:id="@+id/RadioList"
                android:layout_width="match_parent"
                android:layout_height="fill_parent" >
            </ListView>
        </RelativeLayout>

        <Button
            android:id="@+id/sampleButton"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Categories" />

    </LinearLayout>

</ScrollView>

Answer 1

SlidingMenu does NOT do this, zomato uses a custom implementation.

SlidingMenu will let you have a menu on the left and the right, but not two on either side.

I would look at using a view pager or a custom implementation. EitherWay I don't know of anything out of the box to do this. I might be worth looking at Android Views for inspiration.

Answer 2

It's a bit late, but still let me post my answer in case it will help someone in future. If you want to show another menu you can use

setMode(SlidingMenu.LEFT_RIGHT);
setSecondaryMenu(R.layout.yourSecondMenu);

and in your button click

showSecondaryMenu(true);

and perform your actions in that class.