Monday, 12 May 2014

how to create side menu in android example

main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:layout_weight="1" >

    <!-- Menu Panel -->

    <RelativeLayout
        android:id="@+id/menuPanel"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:background="#1e232a"
        android:orientation="vertical" >

        <RelativeLayout
            android:id="@+id/Nevigstion"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="#e84c3d" >
         </RelativeLayout>

    <!-- Sliding Panel -->

    <LinearLayout
        android:id="@+id/slidingPanel"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@android:color/white"
        android:clickable="false"
        android:gravity="left"
        android:longClickable="false"
        android:orientation="vertical" >

        <RelativeLayout
            android:id="@+id/header"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="#3598db"
            android:gravity="center_vertical" >
               <ImageButton
                android:id="@+id/menuView_Button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_marginLeft="10dp" />
        </RelativeLayout>

        <!-- Rel_mainroot -->

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

            <!-- Home -->

            <RelativeLayout
                android:id="@+id/rel_home"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:background="#ededed" >
            </RelativeLayout>
        </RelativeLayout>
    </LinearLayout>
</FrameLayout>

CollapseAnimation.java

import android.view.animation.AccelerateDecelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.LinearLayout;
import android.widget.FrameLayout.LayoutParams;

public class CollapseAnimation extends TranslateAnimation implements TranslateAnimation.AnimationListener{
  
    private LinearLayout slidingLayout;
    int panelWidth;

    public CollapseAnimation(LinearLayout layout, int width, int fromXType, float fromXValue, int toXType,
            float toXValue, int fromYType, float fromYValue, int toYType, float toYValue) {
      
        super(fromXType, fromXValue, toXType, toXValue, fromYType, fromYValue, toYType, toYValue);
      
        //Initialize
        slidingLayout = layout;
          panelWidth = width;
        setDuration(400);
        setFillAfter( false );
        setInterpolator(new AccelerateDecelerateInterpolator());
        setAnimationListener(this);
      
        //Clear left and right margins
        LayoutParams params = (LayoutParams) slidingLayout.getLayoutParams();
             params.rightMargin = 0;
             params.leftMargin = 0;
             slidingLayout.setLayoutParams(params);
             slidingLayout.requestLayout();     
             slidingLayout.startAnimation(this);
            
    }
    public void onAnimationEnd(Animation animation) {
  
    }

    public void onAnimationRepeat(Animation animation) {
      
    }

    public void onAnimationStart(Animation animation) {
      
    }
}

 ExpandAnimation.java
 
import android.view.Gravity;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.LinearLayout;
import android.widget.FrameLayout.LayoutParams;

public class ExpandAnimation extends TranslateAnimation implements Animation.AnimationListener{

    private LinearLayout slidingLayout;
    int panelWidth;
  
    public ExpandAnimation(LinearLayout layout, int width, int fromXType, float fromXValue, int toXType,
            float toXValue, int fromYType, float fromYValue, int toYType, float toYValue) {
      
        super(fromXType, fromXValue, toXType, toXValue, fromYType, fromYValue, toYType, toYValue);
      
        //Initialize
        slidingLayout = layout;
        panelWidth = width;
        setDuration(400);
          setFillAfter( false );
          setInterpolator(new AccelerateDecelerateInterpolator());
          setAnimationListener(this);
          slidingLayout.startAnimation(this);
    }

    public void onAnimationEnd(Animation arg0) {
      
        //Create margin and align left
        LayoutParams params = (LayoutParams) slidingLayout.getLayoutParams();
             params.leftMargin = panelWidth;
             params.gravity = Gravity.LEFT;     
             slidingLayout.clearAnimation();
             slidingLayout.setLayoutParams(params);
             slidingLayout.requestLayout();
                  
    }

    public void onAnimationRepeat(Animation arg0) {
      
    }

    public void onAnimationStart(Animation arg0) {
      
    }
}

MainActivity.java

 public class MainActivity extends Activity implements OnClickListener {

   private static LinearLayout slidingPanel;
    private static boolean isExpanded;
    private DisplayMetrics metrics;
    private RelativeLayout headerPanel;
    private RelativeLayout menuPanel;
    private static int panelWidth;  

   FrameLayout.LayoutParams menuPanelParameters;
    FrameLayout.LayoutParams slidingPanelParameters;
    LinearLayout.LayoutParams headerPanelParameters;
    LinearLayout.LayoutParams listViewParameters;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        this.requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.main);

        metrics = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(metrics);
        panelWidth = (int) ((metrics.widthPixels) * 0.75);

        headerPanel = (RelativeLayout) findViewById(R.id.header);
        headerPanelParameters = (LinearLayout.LayoutParams) headerPanel.getLayoutParams();
        headerPanelParameters.width = metrics.widthPixels;
        headerPanel.setLayoutParams(headerPanelParameters);

        menuPanel = (RelativeLayout) findViewById(R.id.menuPanel);
        menuPanelParameters = (FrameLayout.LayoutParams) menuPanel.getLayoutParams();
        menuPanelParameters.width = panelWidth;
        menuPanel.setLayoutParams(menuPanelParameters);

        slidingPanel = (LinearLayout) findViewById(R.id.slidingPanel);
        slidingPanelParameters = (FrameLayout.LayoutParams) slidingPanel.getLayoutParams();
        slidingPanelParameters.width = metrics.widthPixels;
        slidingPanel.setLayoutParams(slidingPanelParameters);


        menuView_Button.setOnClickListener(this);

          }

@Override
    public void onClick(View v) {

 if (v == menuView_Button) {

            if (!isExpanded) {
                isExpanded = true;

                // Expand            
                new ExpandAnimation(slidingPanel, panelWidth,
                        Animation.RELATIVE_TO_SELF, 0.0f,
                        Animation.RELATIVE_TO_SELF, 0.75f, 0, 0.0f, 0, 0.0f);
            } else {
                isExpanded = false;

                // Collapse

                new CollapseAnimation(slidingPanel, panelWidth,
                        TranslateAnimation.RELATIVE_TO_SELF, 0.75f,
                        TranslateAnimation.RELATIVE_TO_SELF, 0.0f, 0, 0.0f, 0,
                        0.0f);
            }
        }
     }
}

No comments:

Post a Comment