How to convert my slide menu like foursquare menu?

Question

Right now I have a sliding menu as follows,

I want to style it like foursquare sliding menu,

Here is my layout

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

      <Button
          android:id="@+id/oneButton"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_alignParentLeft="true"
          android:layout_alignParentTop="true"
          android:layout_marginLeft="5dp"
          android:layout_marginTop="5dp"
           android:drawableLeft="@drawable/ic_dashboard"
             android:gravity="left|center_vertical"
          android:text="@string/duo_dashboard" />

      <Button
          android:id="@+id/twoButton"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_alignParentLeft="true"
          android:layout_alignParentRight="true"
          android:layout_below="@+id/oneButton"
          android:layout_marginLeft="5dp"
          android:drawableLeft="@drawable/ic_settings"
          android:gravity="left|center_vertical"
          android:text="@string/title_settings" />

       <Button
          android:id="@+id/threeButton"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_alignParentLeft="true"
          android:layout_alignParentRight="true"
          android:layout_below="@+id/twoButton"
          android:layout_marginLeft="5dp"
          android:drawableLeft="@drawable/ic_todo"
          android:gravity="left|center_vertical"
          android:text="@string/title_todo" />

  </RelativeLayout>
</LinearLayout> </RelativeLayout>

Answer 1

Just a raw guess here. The line splitter can probably be achieved by the divider property like so.

 <ListView
        android:id="@+id/left_drawer"
        android:layout_width="250dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:choiceMode="singleChoice"
        android:divider="@drawable/gradientshape" <!--thats what im talking about-->
        android:dividerHeight="0.5dp" />

Where gradientshape must be a gradient xml file like so

 <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<gradient
    android:startColor="@color/dark_black" <!--use whatever colors you like-->
    android:endColor="@color/light_grey"
    android:type="linear"
    android:angle="270" /> </shape>

EDIT: Just looked at the foursquare resources the coloring and line shadows are actually achieved by a 9 patch image

Answer 2

Provided by Android: Displaying the navigation drawer

http://developer.android.com/design/patterns/navigation-drawer.html