kiko-lp kiko-lp - 2 months ago 11
Android Question

how to implement an items list in a Slidingmenu?

I'd like to set an items list to a SlidingMenu is there any tutorial?
I'm using https://github.com/jfeinstein10/SlidingMenu

Answer

You could find it in the ExampleListActivity in the library.

To have a List item to a sliding menu firstly you will need a FrameLayout on your main.

MainActivity.xml (in layout folder)

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

After that create a leftlist.xml ( The list on the left menu)

<?xml version="1.0" encoding="utf-8"?>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/list_padding"
android:paddingRight="@dimen/list_padding" />

After that create a menu_frame.xml (to hold the list on the left)

<?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" />

And a row.xml (CUstomize the view for each row)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal" >

<TextView
    android:id="@+id/row_title1"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:padding="10dp"

</LinearLayout>

Then have a SampleListFragment.java (to write the name of the list)

   public class SampleListFragment extends ListFragment {

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    return inflater.inflate(R.layout.leftlist, null);
}

public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
    SampleAdapter adapter = new SampleAdapter(getActivity());
    adapter.add(new SampleItem("menu left A"));
    adapter.add(new SampleItem("menu left B"));
    adapter.add(new SampleItem("menu left C"));
    adapter.add(new SampleItem("menu left D"));
    adapter.add(new SampleItem("menu left A"));
    setListAdapter(adapter);

}

private class SampleItem {
    public String tag;
    public int iconRes;
    public SampleItem(String tag, int iconRes) {
        this.tag = tag; 
        this.iconRes = iconRes;
    }
}

public class SampleAdapter extends ArrayAdapter<SampleItem> {

    public SampleAdapter(Context context) {
        super(context, 0);
    }

    public View getView(int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            convertView = LayoutInflater.from(getContext()).inflate(R.layout.row, null);
        }
        ImageView icon = (ImageView) convertView.findViewById(R.id.row_icon);
        icon.setImageResource(getItem(position).iconRes);
        TextView title = (TextView) convertView.findViewById(R.id.row_title);
        title.setText(getItem(position).tag);

        return convertView;
    }

}
   }

You will need a baseactivity to show the effects of the sliding / action bar BaseActivity.java (Configure how your sliding menu effects)

   public class BaseActivity extends SlidingFragmentActivity {
SlidingMenu menu;
private int mTitleRes;
protected ListFragment mFrag;

public BaseActivity(int titleRes) {
    mTitleRes = titleRes;
}

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setTitle(mTitleRes);

    // set the Behind View
    setBehindContentView(R.layout.menu_frame);
    if (savedInstanceState == null) {
        FragmentTransaction t = this.getSupportFragmentManager().beginTransaction();
        mFrag = new SampleListFragment();
        t.replace(R.id.menu_frame, mFrag);
        t.commit();
    } else {
        mFrag = (ListFragment)this.getSupportFragmentManager().findFragmentById(R.id.menu_frame);
    }

    // customize the SlidingMenu
    SlidingMenu sm = getSlidingMenu();
    sm.setShadowWidthRes(R.dimen.shadow_width);
    sm.setShadowDrawable(R.drawable.shadow);
    sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);
    sm.setFadeDegree(0.35f);
    sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);



}


   }

Then on your MainActivity.java extends baseactivity(Just call the left menu in your oncreate)

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

          getSlidingMenu().setMode(SlidingMenu.LEFT);
    getSlidingMenu().setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);

    getSupportFragmentManager()
    .beginTransaction()
    .replace(R.id.menu_frame, new SampleListFragment())
    .commit();
    }

This is how I do it for my application I am not sure if it's the right or wrong method but feel free to ask if you have any questions. And of course you will have to copy the shadow.xml and shadowright.xml at res/drawable folder to your application