rahular.github.io

In this post I will be showing you how to create a sliding window for your Android apps. A sliding window is extremely helpful when you have too many options in your app’s menu and want some more real estate to put them in a cleaner way. Doing this was quite a pain until Jeremy Feinstein wrote a beautiful library, which made it so much simpler! So here’s how you do it (I will be using Eclipse).

• First of all you need to download the library which is available here
• Now in Eclipse, go to File — Import — Android — ‘Existing Android code into workspace’
• Browse for the location of the library (it is named ‘library’ inside the master directory)
• Clean build the project just in case there are any errors

• Create a new Android Project in the regular way

  

When you run the project without changing anything, the app should look something like what is shown above. (In case there are is any dependency error, it is likely to be caused by the ‘android-support-v4.jar’ which is automatically referenced in the project. If this error occurs, just delete this file from the ‘libs’ directory of your project.)Next you will have to link the library to your project so as to reuse the existing code. To do this, right clock on your project, go to ‘Properties’ and select ‘Android’ on the left pane. In the ‘library’ section, click on ‘Add’ and add the library imported previously.Now comes a little bit of coding.

Go to values — dimens.xml and add the following

<dimen name="slidingmenu_offset">60dp</dimen> 
<dimen name="shadow_width">15dp</dimen>

In the ‘drawable’ directory, create an XML file called ‘shadow.xml’ and add the following

<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <gradient
        android:centerColor="#11000000"
        android:endColor="#33000000"
        android:startColor="#00000000" />
</shape>

Create a dummy layout and name it ‘slide_view’ into which all the sliding menu content can go

In the ‘onCreate’ method of the main activity, add the following

SlidingMenu menu = new SlidingMenu(this);
menu.setMode(SlidingMenu.LEFT);
menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
menu.setShadowWidthRes(R.dimen.shadow_width);
menu.setShadowDrawable(R.drawable.shadow);
menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
menu.setFadeDegree(0.35f);
menu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
menu.setSecondaryMenu(R.layout.slide_view);

Now when you run the app, it must look something like this

That should do it. All the code is self-explanatory. If you guys have any questions, feel free to comment below and I’ll try to answer them.