android 滑动菜单SlidingMenu的实现

先我们看下面视图:

      

这种效果大家都不陌生,网上好多都说是仿人人网的,估计人家牛逼出来的早吧,我也参考了一一些例子,实现起来有三种方法,我下面简单介绍下:

方法一:其实就是对GestureDetector手势的应用及布局文件的设计.

布局文件main.xml    采用RelativeLayout布局.

 

[java] view plaincopy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:orientation="vertical" >  
  6.   
  7.     <LinearLayout  
  8.         android:id="@+id/layout_right"  
  9.         android:layout_width="fill_parent"  
  10.         android:layout_height="fill_parent"  
  11.         android:layout_marginLeft="50dp"  
  12.         android:orientation="vertical" >  
  13.   
  14.         <AbsoluteLayout  
  15.             android:layout_width="fill_parent"  
  16.             android:layout_height="wrap_content"  
  17.             android:background="@color/grey21"  
  18.             android:padding="10dp" >  
  19.   
  20.             <TextView  
  21.                 android:layout_width="wrap_content"  
  22.                 android:layout_height="wrap_content"  
  23.                 android:text="设置"  
  24.                 android:textColor="@android:color/background_light"  
  25.                 android:textSize="20sp" />  
  26.         </AbsoluteLayout>  
  27.   
  28.         <ListView  
  29.             android:id="@+id/lv_set"  
  30.             android:layout_width="fill_parent"  
  31.             android:layout_height="fill_parent"  
  32.             android:layout_weight="1" >  
  33.         </ListView>  
  34.     </LinearLayout>  
  35.   
  36.     <LinearLayout  
  37.         android:id="@+id/layout_left"  
  38.         android:layout_width="fill_parent"  
  39.         android:layout_height="fill_parent"  
  40.         android:background="@color/white"  
  41.         android:orientation="vertical" >  
  42.   
  43.         <RelativeLayout  
  44.             android:layout_width="fill_parent"  
  45.             android:layout_height="wrap_content"  
  46.             android:background="@drawable/nav_bg" >  
  47.   
  48.             <ImageView  
  49.                 android:id="@+id/iv_set"  
  50.                 android:layout_width="wrap_content"  
  51.                 android:layout_height="wrap_content"  
  52.                 android:layout_alignParentRight="true"  
  53.                 android:layout_alignParentTop="true"  
  54.                 android:src="@drawable/nav_setting" />  
  55.   
  56.             <TextView  
  57.                 android:layout_width="wrap_content"  
  58.                 android:layout_height="wrap_content"  
  59.                 android:layout_centerInParent="true"  
  60.                 android:text="我"  
  61.                 android:textColor="@android:color/background_light"  
  62.                 android:textSize="20sp" />  
  63.         </RelativeLayout>  
  64.   
  65.         <ImageView  
  66.             android:id="@+id/iv_set"  
  67.             android:layout_width="fill_parent"  
  68.             android:layout_height="fill_parent"  
  69.             android:scaleType="fitXY"  
  70.             android:src="@drawable/bg_guide_5" />  
  71.     </LinearLayout>  
  72.   
  73. </RelativeLayout>  

 

layout_right:这个大布局文件,layout_left:距离左边50dp像素.(我们要移动的是layout_left).

看到这个图我想大家都很清晰了吧,其实:我们就是把layout_left这个布局控件整理向左移动,至于移动多少,就要看layout_right有多宽了。layout_left移动到距离左边的边距就是layout_right的宽及-MAX_WIDTH.相信大家都理解.

布局文件就介绍到这里,下面看代码.

 

[java] view plaincopy
 
  1. /*** 
  2.      * 初始化view 
  3.      */  
  4.     void InitView() {  
  5.         layout_left = (LinearLayout) findViewById(R.id.layout_left);  
  6.         layout_right = (LinearLayout) findViewById(R.id.layout_right);  
  7.         iv_set = (ImageView) findViewById(R.id.iv_set);  
  8.         lv_set = (ListView) findViewById(R.id.lv_set);  
  9.         lv_set.setAdapter(new ArrayAdapter<String>(this, R.layout.item,  
  10.                 R.id.tv_item, title));  
  11.         lv_set.setOnItemClickListener(new OnItemClickListener() {  
  12.   
  13.             @Override  
  14.             public void onItemClick(AdapterView<?> parent, View view,  
  15.                     int position, long id) {  
  16.                 Toast.makeText(MainActivity.this, title[position], 1).show();  
  17.             }  
  18.         });  
  19.         layout_left.setOnTouchListener(this);  
  20.         iv_set.setOnTouchListener(this);  
  21.         mGestureDetector = new GestureDetector(this);  
  22.         // 禁用长按监听  
  23.         mGestureDetector.setIsLongpressEnabled(false);  
  24.         getMAX_WIDTH();  
  25.     }  

这里要对手势进行监听,我想大家都知道怎么做,在这里我要说明一个方法:

 

 

[java] view plaincopy
 
  1. /*** 
  2.      * 获取移动距离 移动的距离其实就是layout_left的宽度 
  3.      */  
  4.     void getMAX_WIDTH() {  
  5.         ViewTreeObserver viewTreeObserver = layout_left.getViewTreeObserver();  
  6.         // 获取控件宽度  
  7.         viewTreeObserver.addOnPreDrawListener(new OnPreDrawListener() {  
  8.             @Override  
  9.             public boolean onPreDraw() {  
  10.                 if (!hasMeasured) {  
  11.                     window_width = getWindowManager().getDefaultDisplay()  
  12.                             .getWidth();  
  13.                     RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  14.                             .getLayoutParams();  
  15.                     layoutParams.width = window_width;  
  16.                     layout_left.setLayoutParams(layoutParams);  
  17.                     MAX_WIDTH = layout_right.getWidth();  
  18.                     Log.v(TAG, "MAX_WIDTH=" + MAX_WIDTH + "width="  
  19.                             + window_width);  
  20.                     hasMeasured = true;  
  21.                 }  
  22.                 return true;  
  23.             }  
  24.         });  
  25.   
  26.     }  

 

在这里我们要获取屏幕的宽度,并将屏幕宽度设置给layout_left这个控件,为什么要这么做呢,因为如果不把该控件宽度写死的话,那么系统将认为layout_left会根据不同环境宽度自动适应,也就是说我们通过layout_left.getLayoutParams动态移动该控件的时候,该控件会伸缩而不是移动。描述的有点模糊,大家请看下面示意图就明白了.

我们不为layout_left定义死宽度效果:

     

getLayoutParams可以很清楚看到,layout_left被向左拉伸了,并不是我们要的效果.

还有一种解决办法就是我们在配置文件中直接把layout_left宽度写死,不过这样不利于开发,因为分辨率的问题.因此就用ViewTreeObserver进行对layout_left设置宽度.

ViewTreeObserver,这个类主要用于对布局文件的监听.强烈建议同学们参考这篇文章 android ViewTreeObserver详细讲解,相信让你对ViewTreeObserver有更一步的了解.

其他的就是对GestureDetector手势的应用,下面我把代码贴出来:

 

[java] view plaincopy
 
  1. package com.jj.slidingmenu;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.AsyncTask;  
  5. import android.os.Bundle;  
  6. import android.util.Log;  
  7. import android.view.GestureDetector;  
  8. import android.view.KeyEvent;  
  9. import android.view.MotionEvent;  
  10. import android.view.View;  
  11. import android.view.ViewTreeObserver;  
  12. import android.view.ViewTreeObserver.OnPreDrawListener;  
  13. import android.view.Window;  
  14. import android.view.View.OnTouchListener;  
  15. import android.widget.AdapterView;  
  16. import android.widget.AdapterView.OnItemClickListener;  
  17. import android.widget.ArrayAdapter;  
  18. import android.widget.ImageView;  
  19. import android.widget.LinearLayout;  
  20. import android.widget.ListView;  
  21. import android.widget.RelativeLayout;  
  22. import android.widget.Toast;  
  23. import android.widget.LinearLayout.LayoutParams;  
  24.   
  25. /*** 
  26.  * 滑动菜单 
  27.  *  
  28.  * @author jjhappyforever... 
  29.  *  
  30.  */  
  31. public class MainActivity extends Activity implements OnTouchListener,  
  32.         GestureDetector.OnGestureListener {  
  33.     private boolean hasMeasured = false;// 是否Measured.  
  34.     private LinearLayout layout_left;  
  35.     private LinearLayout layout_right;  
  36.     private ImageView iv_set;  
  37.     private ListView lv_set;  
  38.   
  39.     /** 每次自动展开/收缩的范围 */  
  40.     private int MAX_WIDTH = 0;  
  41.     /** 每次自动展开/收缩的速度 */  
  42.     private final static int SPEED = 30;  
  43.   
  44.     private GestureDetector mGestureDetector;// 手势  
  45.     private boolean isScrolling = false;  
  46.     private float mScrollX; // 滑块滑动距离  
  47.     private int window_width;// 屏幕的宽度  
  48.   
  49.     private String TAG = "jj";  
  50.   
  51.     private String title[] = { "待发送队列""同步分享设置""编辑我的资料""找朋友""告诉朋友",  
  52.             "节省流量""推送设置""版本更新""意见反馈""积分兑换""精品应用""常见问题""退出当前帐号" };  
  53.   
  54.     /*** 
  55.      * 初始化view 
  56.      */  
  57.     void InitView() {  
  58.         layout_left = (LinearLayout) findViewById(R.id.layout_left);  
  59.         layout_right = (LinearLayout) findViewById(R.id.layout_right);  
  60.         iv_set = (ImageView) findViewById(R.id.iv_set);  
  61.         lv_set = (ListView) findViewById(R.id.lv_set);  
  62.         lv_set.setAdapter(new ArrayAdapter<String>(this, R.layout.item,  
  63.                 R.id.tv_item, title));  
  64.         lv_set.setOnItemClickListener(new OnItemClickListener() {  
  65.   
  66.             @Override  
  67.             public void onItemClick(AdapterView<?> parent, View view,  
  68.                     int position, long id) {  
  69.                 Toast.makeText(MainActivity.this, title[position], 1).show();  
  70.             }  
  71.         });  
  72.         layout_left.setOnTouchListener(this);  
  73.         iv_set.setOnTouchListener(this);  
  74.         mGestureDetector = new GestureDetector(this);  
  75.         // 禁用长按监听  
  76.         mGestureDetector.setIsLongpressEnabled(false);  
  77.         getMAX_WIDTH();  
  78.     }  
  79.   
  80.     /*** 
  81.      * 获取移动距离 移动的距离其实就是layout_left的宽度 
  82.      */  
  83.     void getMAX_WIDTH() {  
  84.         ViewTreeObserver viewTreeObserver = layout_left.getViewTreeObserver();  
  85.         // 获取控件宽度  
  86.         viewTreeObserver.addOnPreDrawListener(new OnPreDrawListener() {  
  87.             @Override  
  88.             public boolean onPreDraw() {  
  89.                 if (!hasMeasured) {  
  90.                     window_width = getWindowManager().getDefaultDisplay()  
  91.                             .getWidth();  
  92.                     RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  93.                             .getLayoutParams();  
  94.                     // layoutParams.width = window_width;  
  95.                     layout_left.setLayoutParams(layoutParams);  
  96.                     MAX_WIDTH = layout_right.getWidth();  
  97.                     Log.v(TAG, "MAX_WIDTH=" + MAX_WIDTH + "width="  
  98.                             + window_width);  
  99.                     hasMeasured = true;  
  100.                 }  
  101.                 return true;  
  102.             }  
  103.         });  
  104.   
  105.     }  
  106.   
  107.     @Override  
  108.     public void onCreate(Bundle savedInstanceState) {  
  109.         super.onCreate(savedInstanceState);  
  110.         requestWindowFeature(Window.FEATURE_NO_TITLE);  
  111.         setContentView(R.layout.main);  
  112.         InitView();  
  113.   
  114.     }  
  115.   
  116.     // 返回键  
  117.     @Override  
  118.     public boolean onKeyDown(int keyCode, KeyEvent event) {  
  119.         if (KeyEvent.KEYCODE_BACK == keyCode && event.getRepeatCount() == 0) {  
  120.             RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  121.                     .getLayoutParams();  
  122.             if (layoutParams.leftMargin < 0) {  
  123.                 new AsynMove().execute(SPEED);  
  124.                 return false;  
  125.             }  
  126.         }  
  127.   
  128.         return super.onKeyDown(keyCode, event);  
  129.     }  
  130.   
  131.     @Override  
  132.     public boolean onTouch(View v, MotionEvent event) {  
  133.         // 松开的时候要判断,如果不到半屏幕位子则缩回去,  
  134.         if (MotionEvent.ACTION_UP == event.getAction() && isScrolling == true) {  
  135.             RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  136.                     .getLayoutParams();  
  137.             // 缩回去  
  138.             if (layoutParams.leftMargin < -window_width / 2) {  
  139.                 new AsynMove().execute(-SPEED);  
  140.             } else {  
  141.                 new AsynMove().execute(SPEED);  
  142.             }  
  143.         }  
  144.   
  145.         return mGestureDetector.onTouchEvent(event);  
  146.     }  
  147.   
  148.     @Override  
  149.     public boolean onDown(MotionEvent e) {  
  150.         mScrollX = 0;  
  151.         isScrolling = false;  
  152.         // 将之改为true,不然事件不会向下传递.  
  153.         return true;  
  154.     }  
  155.   
  156.     @Override  
  157.     public void onShowPress(MotionEvent e) {  
  158.   
  159.     }  
  160.   
  161.     /*** 
  162.      * 点击松开执行 
  163.      */  
  164.     @Override  
  165.     public boolean onSingleTapUp(MotionEvent e) {  
  166.         RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  167.                 .getLayoutParams();  
  168.         // 左移动  
  169.         if (layoutParams.leftMargin >= 0) {  
  170.             new AsynMove().execute(-SPEED);  
  171.         } else {  
  172.             // 右移动  
  173.             new AsynMove().execute(SPEED);  
  174.         }  
  175.   
  176.         return true;  
  177.     }  
  178.   
  179.     /*** 
  180.      * e1 是起点,e2是终点,如果distanceX=e1.x-e2.x>0说明向左滑动。反之亦如此. 
  181.      */  
  182.     @Override  
  183.     public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,  
  184.             float distanceY) {  
  185.         isScrolling = true;  
  186.         mScrollX += distanceX;// distanceX:向左为正,右为负  
  187.         RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  188.                 .getLayoutParams();  
  189.         layoutParams.leftMargin -= mScrollX;  
  190.         if (layoutParams.leftMargin >= 0) {  
  191.             isScrolling = false;// 拖过头了不需要再执行AsynMove了  
  192.             layoutParams.leftMargin = 0;  
  193.   
  194.         } else if (layoutParams.leftMargin <= -MAX_WIDTH) {  
  195.             // 拖过头了不需要再执行AsynMove了  
  196.             isScrolling = false;  
  197.             layoutParams.leftMargin = -MAX_WIDTH;  
  198.         }  
  199.         layout_left.setLayoutParams(layoutParams);  
  200.         return false;  
  201.     }  
  202.   
  203.     @Override  
  204.     public void onLongPress(MotionEvent e) {  
  205.   
  206.     }  
  207.   
  208.     @Override  
  209.     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,  
  210.             float velocityY) {  
  211.         return false;  
  212.     }  
  213.   
  214.     class AsynMove extends AsyncTask<Integer, Integer, Void> {  
  215.   
  216.         @Override  
  217.         protected Void doInBackground(Integer... params) {  
  218.             int times = 0;  
  219.             if (MAX_WIDTH % Math.abs(params[0]) == 0)// 整除  
  220.                 times = MAX_WIDTH / Math.abs(params[0]);  
  221.             else  
  222.                 times = MAX_WIDTH / Math.abs(params[0]) + 1;// 有余数  
  223.   
  224.             for (int i = 0; i < times; i++) {  
  225.                 publishProgress(params[0]);  
  226.                 try {  
  227.                     Thread.sleep(Math.abs(params[0]));  
  228.                 } catch (InterruptedException e) {  
  229.                     e.printStackTrace();  
  230.                 }  
  231.             }  
  232.   
  233.             return null;  
  234.         }  
  235.   
  236.         /** 
  237.          * update UI 
  238.          */  
  239.         @Override  
  240.         protected void onProgressUpdate(Integer... values) {  
  241.             RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left  
  242.                     .getLayoutParams();  
  243.             // 右移动  
  244.             if (values[0] > 0) {  
  245.                 layoutParams.leftMargin = Math.min(layoutParams.leftMargin  
  246.                         + values[0], 0);  
  247.                 Log.v(TAG, "移动右" + layoutParams.rightMargin);  
  248.             } else {  
  249.                 // 左移动  
  250.                 layoutParams.leftMargin = Math.max(layoutParams.leftMargin  
  251.                         + values[0], -MAX_WIDTH);  
  252.                 Log.v(TAG, "移动左" + layoutParams.rightMargin);  
  253.             }  
  254.             layout_left.setLayoutParams(layoutParams);  
  255.   
  256.         }  
  257.   
  258.     }  
  259.   
  260. }  

上面代码注释已经很明确,相信大家都看的明白,我就不过多解释了。

 

效果图:截屏出来有点卡,不过在手机虚拟机上是不卡的.

 

源码下载

 

怎么样,看着还行吧,我们在看下面一个示例:

 

简单说明一下,当你滑动的时候左边会跟着右边一起滑动,这个效果比上面那个酷吧,上面那个有点死板,其实实现起来也比较容易,只需要把我们上面那个稍微修改下,对layout_right也进行时时更新,这样就实现了这个效果了,如果上面那个理解了,这个很轻松就解决了,在这里我又遇到一个问题:此时的listview的item监听不到手势,意思就是我左右滑动listview他没有进行滑动。

本人对touch众多事件监听拦截等熟悉度不够,因此这里我用到自己写的方法,也许比较麻烦,如果有更好的解决办法,请大家一定要分享哦,再次 thanks for you 了.

具体解决办法:我们重写listview,对此listview进行手势监听,我们自定义一个接口来实现,具体代码如下:

 

[java] view plaincopy
 
  1. package com.jj.slidingmenu;  
  2.   
  3. import android.content.Context;  
  4. import android.util.AttributeSet;  
  5. import android.util.Log;  
  6. import android.view.GestureDetector;  
  7. import android.view.MotionEvent;  
  8. import android.view.GestureDetector.OnGestureListener;  
  9. import android.view.View;  
  10. import android.widget.ListView;  
  11. import android.widget.Toast;  
  12.   
  13. public class MyListView extends ListView implements OnGestureListener {  
  14.   
  15.     private GestureDetector gd;  
  16.     // 事件状态  
  17.     public static final char FLING_CLICK = 0;  
  18.     public static final char FLING_LEFT = 1;  
  19.     public static final char FLING_RIGHT = 2;  
  20.     public static char flingState = FLING_CLICK;  
  21.   
  22.     private float distanceX;// 水平滑动的距离  
  23.   
  24.     private MyListViewFling myListViewFling;  
  25.   
  26.     public static boolean isClick = false;// 是否可以点击  
  27.   
  28.     public void setMyListViewFling(MyListViewFling myListViewFling) {  
  29.         this.myListViewFling = myListViewFling;  
  30.     }  
  31.   
  32.     public float getDistanceX() {  
  33.         return distanceX;  
  34.     }  
  35.   
  36.     public char getFlingState() {  
  37.         return flingState;  
  38.     }  
  39.   
  40.     private Context context;  
  41.   
  42.     public MyListView(Context context) {  
  43.         super(context);  
  44.   
  45.     }  
  46.   
  47.     public MyListView(Context context, AttributeSet attrs) {  
  48.         super(context, attrs);  
  49.         this.context = context;  
  50.         gd = new GestureDetector(this);  
  51.     }  
  52.   
  53.     /** 
  54.      * 覆写此方法,以解决ListView滑动被屏蔽问题 
  55.      */  
  56.     @Override  
  57.     public boolean dispatchTouchEvent(MotionEvent event) {  
  58.         myListViewFling.doFlingOver(event);// 回调执行完毕.  
  59.         this.gd.onTouchEvent(event);  
  60.   
  61.         return super.dispatchTouchEvent(event);  
  62.     }  
  63.   
  64.     @Override  
  65.     public boolean onTouchEvent(MotionEvent ev) {  
  66.         /*** 
  67.          * 当移动的时候 
  68.          */  
  69.         if (ev.getAction() == MotionEvent.ACTION_DOWN)  
  70.             isClick = true;  
  71.         if (ev.getAction() == MotionEvent.ACTION_MOVE)  
  72.             isClick = false;  
  73.         return super.onTouchEvent(ev);  
  74.     }  
  75.   
  76.     @Override  
  77.     public boolean onDown(MotionEvent e) {  
  78.         int position = pointToPosition((int) e.getX(), (int) e.getY());  
  79.         if (position != ListView.INVALID_POSITION) {  
  80.             View child = getChildAt(position - getFirstVisiblePosition());  
  81.         }  
  82.         return true;  
  83.     }  
  84.   
  85.     @Override  
  86.     public void onShowPress(MotionEvent e) {  
  87.   
  88.     }  
  89.   
  90.     @Override  
  91.     public boolean onSingleTapUp(MotionEvent e) {  
  92.   
  93.         return false;  
  94.     }  
  95.   
  96.     @Override  
  97.     public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,  
  98.             float distanceY) {  
  99.         // 左滑动  
  100.         if (distanceX > 0) {  
  101.             flingState = FLING_RIGHT;  
  102.             Log.v("jj""左distanceX=" + distanceX);  
  103.             myListViewFling.doFlingLeft(distanceX);// 回调  
  104.             // 右滑动.  
  105.         } else if (distanceX < 0) {  
  106.             flingState = FLING_LEFT;  
  107.             Log.v("jj""右distanceX=" + distanceX);  
  108.             myListViewFling.doFlingRight(distanceX);// 回调  
  109.         }  
  110.   
  111.         return false;  
  112.     }  
  113.   
  114.     /*** 
  115.      * 上下文菜单 
  116.      */  
  117.     @Override  
  118.     public void onLongPress(MotionEvent e) {  
  119.         // System.out.println("Listview long press");  
  120.         // int position = pointToPosition((int) e.getX(), (int) e.getY());  
  121.         // if (position != ListView.INVALID_POSITION) {  
  122.         // View child = getChildAt(position - getFirstVisiblePosition());  
  123.         // if (child != null) {  
  124.         // showContextMenuForChild(child);  
  125.         // this.requestFocusFromTouch();  
  126.         // }  
  127.         //  
  128.         // }  
  129.     }  
  130.   
  131.     @Override  
  132.     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,  
  133.             float velocityY) {  
  134.   
  135.         return false;  
  136.     }  
  137.   
  138.     /*** 
  139.      * 回调接口 
  140.      *  
  141.      * @author jjhappyforever... 
  142.      *  
  143.      */  
  144.     interface MyListViewFling {  
  145.         void doFlingLeft(float distanceX);// 左滑动执行  
  146.   
  147.         void doFlingRight(float distanceX);// 右滑动执行  
  148.   
  149.         void doFlingOver(MotionEvent event);// 拖拽松开时执行  
  150.   
  151.     }  
  152.   
  153. }  

而在MainActivity.java里面实现该接口,我这么一说,我想有的同学们都明白了,具体实现起来代码有点多,我把代码上传到网上,大家可以下载后用心看,我想大家都能够明白的.(在这里我鄙视一下自己,肯定通过对手势监听拦截实现对listview的左右滑动,但是自己学业不经,再次再说一下,如有好的解决方案,请一定要分享我一下哦.)

另外有一个问题:当listivew超出一屏的时候,此时的listview滑动的时候可以上下左右一起滑动,在此没有解决这个问题,如有解决请分享我哦.

 

效果图:

 

源码下载

 

补充说明:上面这个例子有点小BUG,就是右边菜单过长的话,我不仅可以上下滑动,同时也可以左右滑动,这点肯定不是我们想要的效果,其实下面已经解决了这个问题,就是我们自定义一个布局文件,在布局文件中进行对Touch事件监听.效果比上面好的多,至于网上别的样式,我想大家都应该可以效仿实现,这里就不一一讲解了,关键:大家要明白原理,遇到问题知道怎么处理,话费时间长没关系,只要可以搞定.(网上有的朋友说这个有重影,有的布局会变形,其实和我们的布局有关,因为我们用的是AbsoluteLayout布局,但是只要你懂得怎么用,那些问题都不是问题.)

 

更正后源码下载

 

 

由于篇符较长,先说到这里,其实android 自定义ViewGroup和对view进行切图动画实现滑动菜单SlidingMenu也可以实现.具体参考下一篇文章:android 自定义ViewGroup和对view进行切图动画实现滑动菜单SlidingMenu

 

/*********************************************************************************************/

 

下面介绍下:

android 滑动菜单SlidingMenu之拓展(解决ListView滑动冲突)

                

 

 

百度新闻客户端可以手势左划右划,而操作的对象是一个ListView,大家都知道SlidingMenu里的ListView加手势GestureDetector就是蛋疼的操作,但是百度人家就这么搞,而且做的相当棒,其他的应用我很少见到如此的,不得不说,牛逼有牛逼的道理.

网上我搜查了,没有找到类似的案例,只能自己琢磨了,功夫不负有心人啊,终于实现了,方法比较笨戳,下面我简单讲解下:

实现原理:Touch事件的拦截与分发.

在项目中,由于点击不同的菜单要显示不同的内容,所以右边最好弄成活动布局,就是添加一个Linerlayout,动态添加相应布局,这样扩展比较容易.但是这个Linerlayout我们要自己定义,因为我们要拦截一些Touch事件.(实现:当我们上下滑动,ListView上下滑动,当我们左右滑动ListView禁止上下滑动,进行左右滑动)

 

 

[java] view plaincopy
 
  1. package com.hytrip.ui.custom;  
  2.   
  3. import android.content.Context;  
  4. import android.util.AttributeSet;  
  5. import android.util.Log;  
  6. import android.view.GestureDetector;  
  7. import android.view.MotionEvent;  
  8. import android.view.View;  
  9. import android.view.GestureDetector.SimpleOnGestureListener;  
  10. import android.widget.LinearLayout;  
  11.   
  12. /*** 
  13.  * 行程详情的自定义布局 
  14.  *  
  15.  * @author zhangjia 
  16.  *  
  17.  */  
  18. public class JourneyLinearLayout extends LinearLayout {  
  19.     private GestureDetector mGestureDetector;  
  20.     View.OnTouchListener mGestureListener;  
  21.   
  22.     private boolean isLock = true;  
  23.   
  24.     private OnScrollListener onScrollListener;// 自定义接口  
  25.   
  26.     private boolean b;  
  27.   
  28.     public JourneyLinearLayout(Context context) {  
  29.         super(context);  
  30.     }  
  31.   
  32.     public void setOnScrollListener(OnScrollListener onScrollListener) {  
  33.         this.onScrollListener = onScrollListener;  
  34.     }  
  35.   
  36.     public JourneyLinearLayout(Context context, AttributeSet attrs) {  
  37.         super(context, attrs);  
  38.         mGestureDetector = new GestureDetector(new MySimpleGesture());  
  39.     }  
  40.   
  41.     @Override  
  42.     public boolean dispatchTouchEvent(MotionEvent ev) {  
  43.         Log.e("jj""dispatchTouchEvent...");  
  44.         // 获取手势返回值  
  45.         b = mGestureDetector.onTouchEvent(ev);  
  46.         // 松开手要执行一些操作。(关闭 or 打开)  
  47.         if (ev.getAction() == MotionEvent.ACTION_UP) {  
  48.             onScrollListener.doLoosen();  
  49.         }  
  50.         return super.dispatchTouchEvent(ev);  
  51.     }  
  52.   
  53.     @Override  
  54.     public boolean onInterceptTouchEvent(MotionEvent ev) {  
  55.         Log.e("jj""onInterceptTouchEvent...");  
  56.         super.onInterceptTouchEvent(ev);  
  57.         return b;  
  58.     }  
  59.     /*** 
  60.      * 在这里我简单说明一下 
  61.      */  
  62.     @Override  
  63.     public boolean onTouchEvent(MotionEvent event) {  
  64.         Log.e("jj""onTouchEvent...");  
  65.         isLock = false;  
  66.         return super.onTouchEvent(event);  
  67.     }  
  68.   
  69.     /*** 
  70.      * 自定义手势执行 
  71.      *  
  72.      * @author zhangjia 
  73.      *  
  74.      */  
  75.     class MySimpleGesture extends SimpleOnGestureListener {  
  76.   
  77.         @Override  
  78.         public boolean onDown(MotionEvent e) {  
  79.             Log.e("jj""onDown...");  
  80.             isLock = true;  
  81.             return super.onDown(e);  
  82.         }  
  83.   
  84.         @Override  
  85.         public boolean onScroll(MotionEvent e1, MotionEvent e2,  
  86.                 float distanceX, float distanceY) {  
  87.   
  88.             if (!isLock)  
  89.                 onScrollListener.doScroll(distanceX);  
  90.   
  91.             // 垂直大于水平  
  92.             if (Math.abs(distanceY) > Math.abs(distanceX)) {  
  93.                 // Log.e("jjj", "ll...垂直...");  
  94.                 return false;  
  95.             } else {  
  96.                 // Log.e("jjj", "ll...水平...");  
  97.                 // Log.e("jj", "distanceX===" + distanceX);  
  98.                 return true;  
  99.             }  
  100.   
  101.         }  
  102.     }  
  103.   
  104.     /*** 
  105.      * 自定义接口 实现滑动... 
  106.      *  
  107.      * @author zhangjia 
  108.      *  
  109.      */  
  110.     public interface OnScrollListener {  
  111.         void doScroll(float distanceX);// 滑动...  
  112.   
  113.         void doLoosen();// 手指松开后执行...  
  114.     }  
  115.   
  116. }  

 

 

说明1:顺序:dispatchTouchEvent》GestureDetector》onInterceptTouchEvent》onTouchEvent.

说明2:onInterceptTouchEvent 返回true,则拦截孩子touch事件,执行当前OnTouch事件,而返回false,则不执行OnTouch事件,事件传递给孩子执行。。。

 

因为onInterceptTouchEvent 是用于拦截Touch的,不适用于执行一些操作,所以把注入手势操作方法分发事件dispatchTouchEvent中.

下面是自定义的一个接口(方法1:滑动中。。。方法2:松开自动合拢。。。),用于实现手势移动操作,在SlidingMenuActivity.java中实现其接口.

(写的比较凌乱,但是如果你仔细看的话一定会明白的,弄懂事件的传递对你自定义想实现一些牛叉View会有帮助的.鄙人正在研究中...)

    

 因为是模型,所以样子很丑,不过重要的是实现方法.

弄懂上面那个,下面我们在深入看一下:最上面最后一张图片,我们在滑动中间图片的时候ListView肯定是不要进行左划或者右划,是不是有点头大了,其实分析好了,也不难,我们只要对上面那个自定义类稍微修调一下:我们在滑动左右滑动判断一下,如果是ListView的HeadView,那么我们就不进行手势操作,这样ViewPager就可以左右滑动,而ListView就不会左右滑动了,如果不是HeadView还照常就Ok了,简单吧。

下面是示例图:

                     

 

   左右拖拽图片局域(ListView未受影响)                左右拖拽(非图片)局域

 

 @jj120522  这个大大才是原创,转载学习。

 

posted @ 2013-07-12 10:16  谈笑风生膜法师  阅读(4379)  评论(0编辑  收藏  举报