Top to bottom smooth sliding menu design in android like web designing slider menus.
Sliding drawer is is used to add smooth simple sliding drawer navigational menus on android applications. Sliding drawer works same as web designing sliding menus. It controlled by simple handle button automatically generated by SlidingDrawer tag. Sliding drawer always works inside layout and best work on linear layout. Sliding drawer contains handle buttons and after it another layout tag and all of hidden menus implements on there. So here is the complete step by step tutorial for Android Sliding Drawer example tutorial.
Working structure of Sliding drawer menus:
Android Sliding Drawer example tutorial for top to bottom or up to down in android.
Note: I am using two images first is an arrow image to display sliding drawer on arrow image click and another image is a sample image set in sliding drawer open. To test this application in your own compute using my code please put all below two images in res -> drawable folder.
Code for MainActivity.java file.
package com.android_examples.com.slidingdrawer; import android.annotation.SuppressLint; import android.annotation.TargetApi; import android.app.Activity; import android.os.Build; import android.os.Bundle; import android.view.DragEvent; import android.view.View; import android.view.View.OnClickListener; import android.view.View.OnDragListener; import android.widget.Button; import android.widget.SlidingDrawer; import android.widget.SlidingDrawer.OnDrawerCloseListener; import android.widget.SlidingDrawer.OnDrawerOpenListener; import android.widget.Toast; @SuppressWarnings("deprecation") public class MainActivity extends Activity { SlidingDrawer slidingdrawer; Button SlidingButton; @TargetApi(Build.VERSION_CODES.HONEYCOMB) @SuppressLint("NewApi") @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); slidingdrawer = (SlidingDrawer)findViewById(R.id.slidingDrawer1); SlidingButton = (Button)findViewById(R.id.handle); slidingdrawer.setOnDrawerOpenListener(new OnDrawerOpenListener() { @Override public void onDrawerOpened() { Toast.makeText(MainActivity.this, "Sliding drawer open", Toast.LENGTH_LONG).show(); } }); slidingdrawer.setOnDrawerCloseListener(new OnDrawerCloseListener() { public void onDrawerClosed() { Toast.makeText(MainActivity.this, "Sliding drawer close", Toast.LENGTH_LONG).show(); } }); } }
Code for activity_main.xml layout file.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="wrap_content" android:layout_height="wrap_content" tools:context="com.android_examples.com.slidingdrawer.MainActivity" android:orientation="vertical" > <SlidingDrawer android:id="@+id/slidingDrawer1" android:layout_width="wrap_content" android:layout_height="350dp" android:content="@+id/content" android:handle="@+id/handle" android:orientation="vertical" android:rotation="180" > <Button android:id="@+id/handle" android:layout_width="wrap_content" android:layout_height="50sp" android:background="@drawable/arrow_icon" /> <LinearLayout android:id="@+id/content" android:layout_width="wrap_content" android:layout_height="wrap_content" android:rotation="180" > <!-- PUT HERE ANY WIDGETS OR BUTTONS, IMAGES, TEXTVIEW, EDITTEXT BOX, SEARCH BOX --> <!-- TO OPEN INTO SLIDING DRAWER. --> <ImageView android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/sample_image" /> </LinearLayout> </SlidingDrawer> </LinearLayout>
Screenshot: