Android实现网易新闻客户端侧滑菜单

通过自定义View来实现这种功能。

代码如下：

SlideMenu.java

 package com.jackie.slidemenu.view;

 import android.content.Context;
 import android.graphics.Canvas;
 import android.util.AttributeSet;
 import android.view.MotionEvent;
 import android.view.View;
 import android.view.ViewConfiguration;
 import android.view.ViewGroup;
 import android.widget.Scroller;

 public class SlideMenu extends ViewGroup {

     private int mMostRecentX;       // 最后一次x轴的偏移量

     private final int MENU_SCREEN = 0;      // 菜单界面
     private final int MAIN_SCREEN = 1;      // 主界面
     private int mCurrentScreen = MAIN_SCREEN;       // 当前屏幕显示的是主界面
     private Scroller mScroller;

     private int touchSlop;

     public SlideMenu(Context context, AttributeSet attrs) {
         super(context, attrs);
         mScroller = new Scroller(context);

         touchSlop = ViewConfiguration.get(context).getScaledTouchSlop();
     }

     /**
      * 测量出所有子布局的宽和高
      */
     @Override
     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
         super.onMeasure(widthMeasureSpec, heightMeasureSpec);

         measureView(widthMeasureSpec, heightMeasureSpec);
     }

     /**
      * 测量所有子布局的宽和高
      * @param widthMeasureSpec 父布局也就是ViewGroup的宽度测量规格
      * @param heightMeasureSpec 父布局也就是ViewGroup的高度测量规格
      */
     private void measureView(int widthMeasureSpec, int heightMeasureSpec) {
         // 测量菜单的宽和高
         View menuView = getChildAt(0);
         menuView.measure(menuView.getLayoutParams().width, heightMeasureSpec);

         // 测量主界面的宽和高
         View mainView = getChildAt(1);
         mainView.measure(widthMeasureSpec, heightMeasureSpec);      // 主界面的宽和高和父控件viewgroup的宽高一样
     }

     @Override
     protected void onLayout(boolean changed, int l, int t, int r, int b) {
         // 布置菜单的位置
         View menuView = getChildAt(0);
         menuView.layout(-menuView.getMeasuredWidth(), 0, 0, b);

         // 布置主界面的位置
         View mainView = getChildAt(1);
         mainView.layout(0, 0, r, b);
     }

     @Override
     public boolean onTouchEvent(MotionEvent event) {
         switch (event.getAction()) {
         case MotionEvent.ACTION_DOWN:
             mMostRecentX = (int) event.getX();
             break;
         case MotionEvent.ACTION_MOVE:
             // 最新的x轴偏移量
             int moveX = (int) event.getX();

             // 增量值
             int deltaX = mMostRecentX - moveX;

             // 把最新的x轴偏移量赋值给成员变量
             mMostRecentX = moveX;

             // 得到x轴移动后的偏移量
             int newScrollX = getScrollX() + deltaX;

             if(newScrollX < -getChildAt(0).getWidth()) {     // 当前屏幕x轴的偏移量超过了菜单的左边界
                 // 回到菜单的左边界位置
                 scrollTo(-getChildAt(0).getWidth(), 0);
             } else if(newScrollX > 0) {      // 超过了主界面的右边界
                 // 回到主界面的右边界
                 scrollTo(0, 0);
             } else {
                 scrollBy(deltaX, 0);
             }
             break;
         case MotionEvent.ACTION_UP:
             int scrollX = getScrollX();     // x轴最新的偏移量

             int menuXCenter = -getChildAt(0).getWidth() / 2;        // 菜单x轴的中心点

             if(scrollX > menuXCenter) {  // 切换到主界面
                 mCurrentScreen = MAIN_SCREEN;
             } else {    // 切换到菜单界面
                 mCurrentScreen = MENU_SCREEN;
             }
             switchScreen();
             break;
         default:
             break;
         }
         return true;
     }

     /**
      * 根据mCurrentScreen切换屏幕
      */
     private void switchScreen() {
         int scrollX = getScrollX(); // 当前x轴的偏移量
         int dx = 0;

         if(mCurrentScreen == MAIN_SCREEN) { // 切换到主界面
 //          scrollTo(0, 0);
             dx = 0 - scrollX;
         } else if(mCurrentScreen == MENU_SCREEN) {  // 切换到菜单界面
 //          scrollTo(-getChildAt(0).getWidth(), 0);
             dx = -getChildAt(0).getWidth() - scrollX;
         }

         mScroller.startScroll(scrollX, 0, dx, 0, Math.abs(dx) * 5);

         invalidate();       // invalidate -> drawChild -> child.draw -> computeScroll
     }

     /**
      * invalidate出发此方法, 更新屏幕的x轴的偏移量
      */
     @Override
     public void computeScroll() {
         if(mScroller.computeScrollOffset()) {       // 判断是否正在模拟数据中, true 正在进行 false 数据模拟完毕
             scrollTo(mScroller.getCurrX(), 0);

             invalidate();       // 引起computeScroll的调用
         }
     }

     /**
      * 是否显示菜单
      * @return
      */
     public boolean isShowMenu() {
         return mCurrentScreen == MENU_SCREEN;
     }

     /**
      * 隐藏菜单
      */
     public void hideMenu() {
         mCurrentScreen = MAIN_SCREEN;
         switchScreen();
     }

     /**
      * 显示菜单
      */
     public void showMenu() {
         mCurrentScreen = MENU_SCREEN;
         switchScreen();
     }

     /**
      * 拦截事件的方法
      */
     @Override
     public boolean onInterceptTouchEvent(MotionEvent ev) {
         switch (ev.getAction()) {
         case MotionEvent.ACTION_DOWN:
             mMostRecentX = (int) ev.getX();
             break;
         case MotionEvent.ACTION_MOVE:

             int diffX = (int) (ev.getX() - mMostRecentX);
             if(Math.abs(diffX) > touchSlop) {
                 return true;
             }
             break;
         default:
             break;
         }
         return super.onInterceptTouchEvent(ev);
     }

 }

MainActivity.java

 package com.jackie.slidemenu;

 import com.jackie.slidemenu.view.SlideMenu;

 import android.os.Bundle;
 import android.app.Activity;
 import android.view.Menu;
 import android.view.View;
 import android.view.View.OnClickListener;
 import android.view.Window;
 import android.widget.TextView;
 import android.widget.Toast;

 public class MainActivity extends Activity implements OnClickListener {

     private SlideMenu mSlideMenu;

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         // 去除标题, 需要在setContentView之前调用
         requestWindowFeature(Window.FEATURE_NO_TITLE);
         setContentView(R.layout.activity_main);


         mSlideMenu = (SlideMenu) findViewById(R.id.slidemenu);
         findViewById(R.id.iv_slidemenu_main_back).setOnClickListener(this);


     }

     @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;
     }

     @Override
     public void onClick(View v) {
         if(mSlideMenu.isShowMenu()) {
             mSlideMenu.hideMenu();
         } else {
             mSlideMenu.showMenu();
         }
     }

     public void click(View v) {
         TextView tv = (TextView) v;
         Toast.makeText(this, tv.getText(), 0).show();
     }