android的左右侧滑菜单实现

最近看了很多app应用都采用的是左右侧滑,比如网易新闻、凡客等

这里也试着写一下侧滑

首先看一下效果

android的左右侧滑菜单实现

然后给出xml布局代码

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <LinearLayout
	    android:id="@+id/layout"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"
	    android:orientation="horizontal">

         <LinearLayout
	        android:id="@+id/leftMenu"
	        android:layout_width="match_parent"
	        android:layout_height="match_parent" >
        	 <TextView
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:text="@string/left_text" />
   		 </LinearLayout>

         <LinearLayout
	        android:id="@+id/content"
	        android:layout_width="match_parent"
	        android:layout_height="match_parent"
         >

          <RelativeLayout
            android:layout_width="fill_parent"
			android:id="@+id/layout01"
			android:layout_height="wrap_content"
			android:background="@drawable/bg_title"
			android:layout_alignParentTop="true"
			android:gravity="center"
			android:orientation="horizontal">
			<ImageView
		    android:id="@+id/leftBtn"
		    android:layout_alignParentLeft="true"
		    android:layout_height="wrap_content"
		    android:layout_width="wrap_content"
		    android:padding="10dp"
		    android:src="@drawable/home_category"/>
		 	<ImageView
		    android:id="@+id/leftIcon"
		    android:layout_toRightOf="@+id/leftBtn"
		    android:layout_height="wrap_content"
		    android:layout_width="wrap_content"
		    android:src="@drawable/title_icon_line"/>
	    	 <TextView
	            android:id="@+id/home_resource"
				android:text="@string/app_name"
				android:layout_width="fill_parent"
			    android:layout_height="wrap_content"
			    android:textColor="@color/white"
			    android:textSize="@dimen/title_size"
			    android:textStyle="bold"
			  android:padding="10dp"
			    android:gravity="center"/>
	      	<ImageView
		    android:id="@+id/rightIcon"
		    android:layout_toLeftOf="@+id/rightBtn"
		    android:layout_height="wrap_content"
		    android:layout_width="wrap_content"
		    android:src="@drawable/title_icon_line"/>
	 		 <ImageView
	 	   	android:id="@+id/rightBtn"
		     android:padding="10dp"
		    android:layout_alignParentRight="true"
		    android:layout_height="wrap_content"
		    android:layout_width="wrap_content"
		    android:src="@drawable/home_myvancl"
		    />
			</RelativeLayout>
  		  </LinearLayout>

     	  <LinearLayout
	        android:id="@+id/rightMenu"
	        android:layout_width="match_parent"
	        android:layout_height="match_parent"
         	>
	         <TextView
		        android:layout_width="wrap_content"
		        android:layout_height="wrap_content"
		        android:text="@string/right_text" />

   		 </LinearLayout> 	

    </LinearLayout>

</RelativeLayout>

接着写Activity

package com.example.viewdemo;

import android.os.AsyncTask;
import android.os.Bundle;
import android.app.Activity;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
/**
 *
 * TODO
 * @author cuiran
 * @version 1.0.0
 */
public class MainActivity extends Activity implements OnClickListener{
	private static final String TAG="MainActivity";

	private LinearLayout leftMenu;
    private LinearLayout content;
    private LinearLayout rightMenu;

    private LayoutParams leftMenuParams;
    private LayoutParams contentParams;
    private LayoutParams rightMenuParams;

    // menu完全显示时,留给content的宽度值。
    private static final int menuPadding = 120;
    private ImageView leftBtn,rightBtn;

    // 分辨率
    private int disPlayWidth;

    private boolean mIsShow = false;
    private boolean mIsRightShow = false;

    private static final int speed = 50;
    public boolean isMenu=false;
    public boolean isRightMenu=false;

	@SuppressWarnings("deprecation")
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		initView();
	}

	/**初始化视图
	 * TODO
	 */
	private void initView() {
		// TODO Auto-generated method stub
		disPlayWidth = getWindowManager().getDefaultDisplay().getWidth();
		leftMenu = (LinearLayout) findViewById(R.id.leftMenu);
		leftMenu.setOnClickListener(this);
        content = (LinearLayout) findViewById(R.id.content);
        content.setOnClickListener(this);
        rightMenu = (LinearLayout) findViewById(R.id.rightMenu);
        rightMenu.setOnClickListener(this);

        leftMenuParams = (LayoutParams) leftMenu.getLayoutParams();
        contentParams = (LayoutParams) content.getLayoutParams();
        rightMenuParams= (LayoutParams) rightMenu.getLayoutParams();

        leftMenuParams.width = disPlayWidth - menuPadding;
        contentParams.width = disPlayWidth;
        rightMenuParams.width = disPlayWidth - menuPadding;

        leftBtn=(ImageView)findViewById(R.id.leftBtn);
        rightBtn=(ImageView)findViewById(R.id.rightBtn);

        leftBtn.setOnClickListener(this);
        rightBtn.setOnClickListener(this);

        showMenu(mIsShow);
        showRightMenu(mIsRightShow);
	}

	/**
	 * 显示界面
	 * TODO
	 * @param isShow
	 */
	private void showMenu(boolean isShow)
    {
        if (isShow)
        {
            mIsShow = true;
            leftMenuParams.leftMargin = 0;
        } else
        {
            mIsShow = false;
            leftMenuParams.leftMargin = 0 - leftMenuParams.width;
        }
        leftMenu.setLayoutParams(leftMenuParams);
    }

	private void showRightMenu(boolean isShow)
    {
        if (isShow)
        {
        	mIsRightShow = true;
        	contentParams.leftMargin = 0 ;
        } else
        {
        	mIsRightShow = false;
        	contentParams.leftMargin  =  0;
        }
        content.setLayoutParams(contentParams);
    }

	  /**
	   *
	   * TODO 控制左侧View
	   * @author cuiran
	   * @version 1.0.0
	   */
    class showMenuAsyncTask extends AsyncTask<Integer, Integer, Integer>
    {

        @Override
        protected Integer doInBackground(Integer... params)
        {
            int leftMargin =leftMenuParams.leftMargin;
            Log.i(TAG, "leftMargin="+leftMargin);
            while (true)
            {
                leftMargin += params[0];
                if (params[0] > 0 && leftMargin >= 0)
                {
                    break;
                } else if (params[0] < 0 && leftMargin <= -leftMenuParams.width)
                {
                    break;
                }

                Log.i(TAG, "doInBackground:leftMargin"+leftMargin);
                publishProgress(leftMargin);
                try
                {
                    Thread.sleep(30);
                } catch (InterruptedException e)
                {
                    e.printStackTrace();
                }
            }
            return leftMargin;
        }

        @Override
        protected void onProgressUpdate(Integer... values)
        {
            super.onProgressUpdate(values);
            leftMenuParams.leftMargin = values[0];
            leftMenu.setLayoutParams(leftMenuParams);
        }

        @Override
        protected void onPostExecute(Integer result)
        {
            super.onPostExecute(result);
            leftMenuParams.leftMargin = result;
            leftMenu.setLayoutParams(leftMenuParams);
        }

    }

    /**
	   *
	   * TODO 控制右侧View
	   * @author cuiran
	   * @version 1.0.0
	   */
  class showRightMenuAsyncTask extends AsyncTask<Integer, Integer, Integer>
  {

      @Override
      protected Integer doInBackground(Integer... params)
      {
          int leftMargin =contentParams.leftMargin;
          while (true)
          {
        	  leftMargin += params[0];
        	  if (params[0] > 0 && leftMargin >= 0)
              {
                  break;
              } else if (params[0] < 0 && leftMargin <= -contentParams.width+menuPadding)
              {
                  break;
              }
              publishProgress(leftMargin);
              try
              {
                  Thread.sleep(30);
              } catch (InterruptedException e)
              {
                  e.printStackTrace();
              }
          }
          return leftMargin;
      }

      @Override
      protected void onProgressUpdate(Integer... values)
      {

          super.onProgressUpdate(values);
          contentParams.leftMargin = values[0];
          content.setLayoutParams(contentParams);
      }

      @Override
      protected void onPostExecute(Integer result)
      {
    	  Log.i(TAG, "onPostExecute");
          super.onPostExecute(result);
          contentParams.leftMargin = result;
          content.setLayoutParams(contentParams);
      }

  }

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

	/* (non-Javadoc)
	 * @see android.view.View.OnClickListener#onClick(android.view.View)
	 */
	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		  switch (v.getId())
	        {
	        case R.id.leftMenu:
	        	isMenu=false;
	        	 new showMenuAsyncTask().execute(-speed);
	            break;
	        case R.id.leftBtn:

	        	if(isMenu){
	        		isMenu=false;
	        		 new showMenuAsyncTask().execute(-speed);
	        	}else{
	        		isMenu=true;
	        		new showMenuAsyncTask().execute(speed);
	        	}

		         break;
	        case R.id.rightBtn:
	        	Log.i(TAG, "点击rightBtn");
	        	if(isRightMenu){
	        		isRightMenu=false;
	        		new showRightMenuAsyncTask().execute(speed);
	        	}else{
	        		isRightMenu=true;
	        		 new showRightMenuAsyncTask().execute(-speed);
	        	}
	        	break;
	        case R.id.content:

	            break;
	        }
	}

}

源码下载地址为:https://github.com/cayden/viewdemo

上一篇:动手动脑(lesson 4)


下一篇:Invitation Cards POJ - 1511 (双向单源最短路)