Android仿UC浏览器左右上下滚动功能

本文要解决在侧滑菜单右边加个文本框，并能实现文本的上下滑动和菜单的左右滚动。这里推荐可以好好看看android的触摸事件的分发机制，这里我就不详细讲了，我只讲讲这个应用。要实现的功能就像UC浏览器（或其它手机浏览器）的左右滚动，切换网页，上下滚动，拖动内容。
本文的效果：

一、功能要求与实现
1、功能要求：
（1）手指一开始按着屏幕左右移动时，只能左右滚动菜单，如果这时手指一直按着，而且上下移动了，那么菜单显示部分保持不变，但文本框也不上下移动！
（2）手指一开始按着屏幕上下移动时，只能上下滚动文本框，如果这时手指一直按着，而且左右移动了，那么文本框显示部分保持不变，但菜单也不左右移动！
2、初步实现：
      左边的菜单项增加一个listview，为右边的内容项添加一个textview，并且为了能让它实现上下滚动的功能，给textview加了个scrollview。
       这种效果肯定是不对的，你看，我们手指上下禾移动文本时，如果还左右移动了，菜单也显示出来了。

3、修改实现
这时我就想从触摸事件的分发入手，这里因为我是把ScrollView的触摸事件注册到LinearLayout。（LinearLayout中包含了ScrollView，不懂看下面的布局）中去，所以触摸事件会先传递给LinearLayout。
分以下两种情况：
（1）如果是手指左右移动，则把触摸事件传给LinearLayout。函数onTouch返回true,表示触摸事件不再传递下去，那么ScrollView就动不了了
（2）如果是手指上下移动，触摸事件先传给LinearLayout，但LinearLayout不做任何处理，直接传递给ScrollView，ScrollView来处理触摸事件。
这是修改后的效果：

二、布局与代码
1、布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:id="@+id/layout"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="horizontal"tools:context=".MainActivity" ><LinearLayout android:id="@+id/menu" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="@drawable/menu" > <！-- 添加一个ListView控件 --><ListViewandroid:id="@+id/menuList"android:layout_width="fill_parent"android:layout_height="fill_parent"/></LinearLayout><LinearLayout android:id="@+id/content" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <ScrollViewandroid:id="@+id/scrollview"android:layout_width="fill_parent"android:layout_height="wrap_content" > <TextView android:id="@+id/content_text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/text1" android:textSize="22px" /></ScrollView></LinearLayout></LinearLayout>

2、代码

package com.example.learningjava; import java.util.ArrayList; import java.util.HashMap; import java.util.Map; import com.example.learningjava.R.string; import android.R.integer; import android.R.menu; import android.os.AsyncTask; import android.os.Build; import android.os.Bundle; import android.annotation.SuppressLint; import android.annotation.TargetApi; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.ArrayAdapter; import android.widget.LinearLayout.LayoutParams; import android.widget.ListView; import android.widget.ScrollView; import android.widget.Toast; import android.app.Activity; import android.content.Context; import android.util.AttributeSet; import android.util.DisplayMetrics; import android.util.Log; import android.view.GestureDetector; import android.view.Menu; import android.view.MotionEvent; import android.view.VelocityTracker; import android.view.View; import android.view.View.OnTouchListener; import android.view.Window; import android.widget.LinearLayout;public class MainActivity extends Activity implements OnTouchListener{private LinearLayout menuLayout;//菜单项private LinearLayout contentLayout;//内容项private LayoutParams menuParams;//菜单项目的参数private LayoutParams contentParams;//内容项目的参数contentLayout的宽度值private int disPlayWidth;//手机屏幕分辨率private float xDown;//手指点下去的横坐标private float xMove;//手指移动的横坐标private float xUp;//记录手指上抬后的横坐标private float yDown;//手指点下去的纵坐标private float yMove;//手指移动的纵坐标private VelocityTracker mVelocityTracker; // 用于计算手指滑动的速度。private float velocityX;//手指左右移动的速度public static final int SNAP_VELOCITY = 400; //滚动显示和隐藏menu时，手指滑动需要达到的速度。 private boolean menuIsShow = false;//初始化菜单项不可翙private static final int menuPadding=160;//menu完成显示，留给content的宽度private ListView menuListView;//菜单列表的内容private ScrollView scrollView;// 文本框的滚动条private boolean wantToScrollText=false;//想要下下滚动文本内容private boolean wantToScrollTextMenu=false;private boolean oneFucction=false;//确保函数只被调用一次protected void onCreate（Bundle savedInstanceState） { super.onCreate（savedInstanceState）; requestWindowFeature（Window.FEATURE_NO_TITLE）; setContentView（R.layout.activity_main）; initLayoutParams（）; initMenuList（）; initScrollView（）;}/***初始化Layout并设置其相应的参数*/private void initLayoutParams（）{//得到屏幕的大小 DisplayMetrics dm = new DisplayMetrics（）; getWindowManager（）.getDefaultDisplay（）.getMetrics（dm）; disPlayWidth =dm.widthPixels; //获得控件 menuLayout = （LinearLayout） findViewById（R.id.menu）; contentLayout = （LinearLayout） findViewById（R.id.content）; findViewById（R.id.layout）.setOnTouchListener（this）; //获得控件参数 menuParams=（LinearLayout.LayoutParams）menuLayout.getLayoutParams（）; contentParams = （LinearLayout.LayoutParams） contentLayout.getLayoutParams（）; //初始化菜单和内容的宽和边距 menuParams.width = disPlayWidth - menuPadding; menuParams.leftMargin = 0 - menuParams.width; contentParams.width = disPlayWidth; contentParams.leftMargin=0; //设置参数 menuLayout.setLayoutParams（menuParams）; contentLayout.setLayoutParams（contentParams）;}/*** 初始化菜单列表内容*/private void initMenuList（）{final String[] strs = new String[] { "第1章 Java概述 ", "第2章 理解面向对象", "第3章 数据类型和运算符", "第4章 流程控制和数组", "第5章 面向对象（上）"}; menuListView = （ListView） findViewById（R.id.menuList）; menuListView.setAdapter（new ArrayAdapter<String>（this,android.R.layout.simple_list_item_1, strs））;//为ListView绑定适配器 //启动列表点击监听事件 menuListView.setOnItemClickListener（new OnItemClickListener（） {@Overridepublic void onItemClick（AdapterView<?> arg0, View arg1, int arg2,long arg3） {Toast.makeText（getApplicationContext（）,"您选择了" + strs[arg2], Toast.LENGTH_SHORT）.show（）; } }）; }/*** 初始化scrollView*/public void initScrollView（）{ scrollView = （ScrollView）this.findViewById（R.id.scrollview）; scrollView.setOnTouchListener（this）;//绑定监听侧滑事件的View，即在绑定的View进行滑动才可以显示和隐藏左侧布局。 这句非常重要，不要设置它的触摸事件 了，要不会吞掉布局的触摸事件} @Overridepublic boolean onTouch（View v, MotionEvent event）{ acquireVelocityTracker（event）; if （event.getAction（）==MotionEvent.ACTION_DOWN） {xDown=event.getRawX（）;yDown=event.getRawY（）;return false; } else if（event.getAction（）==MotionEvent.ACTION_MOVE） {if（wantToScrollText）//当前想滚动显示文本 return false;xMove=event.getRawX（）;yMove=event.getRawY（）;if（menuIsShow）{ isScrollToShowMenu（）; return true;}if（！oneFucction）{oneFucction=true;//这个if只能被调用一次if（Math.abs（xDown-xMove）<Math.abs（yDown-yMove）） { wantToScrollText=true; return false; }} isScrollToShowMenu（）; } else if（event.getAction（）==MotionEvent.ACTION_UP）{oneFucction=false;if（wantToScrollText）{wantToScrollText=false;return false;} xUp=event.getRawX（）;isShowMenu（）;releaseVelocityTracker（）; } else if （event.getAction（）==MotionEvent.ACTION_CANCEL） { releaseVelocityTracker（）;return false; } return true;//false时才能把触摸事件再传给scroll}/*** 根据手指按下的距离，判断是否滚动显示菜单*/private void isScrollToShowMenu（）{ int distanceX = （int） （xMove - xDown）;if （！menuIsShow） {scrollToShowMenu（distanceX）; }else{scrollToHideMenu（distanceX）; }}/*** 手指抬起之后判断是否要显示菜单*/private void isShowMenu（）{ velocityX =getScrollVelocity（）; if（wantToShowMenu（））{if（shouldShowMenu（））{ showMenu（）;}else{ hideMenu（）;} } else if（wantToHideMenu（））{if（shouldHideMenu（））{ hideMenu（）;}else{ showMenu（）;} } }/***想要显示菜单,当向右移动距离大于0并且菜单不可见*/private boolean wantToShowMenu（）{ return ！menuIsShow&&xUp-xDown>0;}/***想要隐藏菜单,当向左移动距离大于0并且菜单可见*/private boolean wantToHideMenu（）{ return menuIsShow&&xDown-xUp>0;}/***判断应该显示菜单,当向右移动的距离超过菜单的一半或者速度超过给定值*/private boolean shouldShowMenu（）{ return xUp-xDown>menuParams.width/2||velocityX>SNAP_VELOCITY;}/***判断应该隐藏菜单,当向左移动的距离超过菜单的一半或者速度超过给定值*/private boolean shouldHideMenu（）{ return xDown-xUp>menuParams.width/2||velocityX>SNAP_VELOCITY;}/*** 显示菜单栏*/private void showMenu（）{ new showMenuAsyncTask（）.execute（50）; menuIsShow=true;}/*** 隐藏菜单栏*/private void hideMenu（）{ new showMenuAsyncTask（）.execute（-50）; menuIsShow=false;}/***指针按着时，滚动将菜单慢慢显示出来*@param scrollX 每次滚动移动的距离*/private void scrollToShowMenu（int scrollX）{ if（scrollX>0&&scrollX<= menuParams.width） menuParams.leftMargin =-menuParams.width+scrollX; menuLayout.setLayoutParams（menuParams）;}/***指针按着时，滚动将菜单慢慢隐藏出来*@param scrollX 每次滚动移动的距离*/private void scrollToHideMenu（int scrollX）{ if（scrollX>=-menuParams.width&&scrollX<0） menuParams.leftMargin=scrollX; menuLayout.setLayoutParams（menuParams）;} /*** 创建VelocityTracker对象，并将触摸content界面的滑动事件加入到VelocityTracker当中。* @param event 向VelocityTracker添加MotionEvent*/private void acquireVelocityTracker（final MotionEvent event） { if（null == mVelocityTracker） {mVelocityTracker = VelocityTracker.obtain（）; } mVelocityTracker.addMovement（event）;}/*** 获取手指在content界面滑动的速度。* @return 滑动速度，以每秒钟移动了多少像素值为单位。*/private int getScrollVelocity（） { mVelocityTracker.computeCurrentVelocity（1000）; int velocity = （int） mVelocityTracker.getXVelocity（）; return Math.abs（velocity）;}/*** 释放VelocityTracker*/private void releaseVelocityTracker（） { if（null ！= mVelocityTracker） {mVelocityTracker.clear（）;mVelocityTracker.recycle（）;mVelocityTracker = null; }}/****：模拟动画过程，让肉眼能看到滚动的效果**/class showMenuAsyncTask extends AsyncTask<Integer, Integer, Integer>{@Override protected Integer doInBackground（Integer... params） {int leftMargin = menuParams.leftMargin;while （true）{// 根据传入的速度来滚动界面，当滚动到达左边界或右边界时，跳出循环。 leftMargin += params[0]; if （params[0] > 0 && leftMargin > 0） {leftMargin= 0;break; } else if （params[0] < 0 && leftMargin <-menuParams.width） {leftMargin=-menuParams.width;break; } publishProgress（leftMargin）; try {Thread.sleep（40）;//休眠一下，肉眼才能看到滚动效果 } catch （InterruptedException e） {e.printStackTrace（）; }}return leftMargin; } @Override protected void onProgressUpdate（Integer... value） {menuParams.leftMargin = value[0];menuLayout.setLayoutParams（menuParams）; }@Override protected void onPostExecute（Integer result） {menuParams.leftMargin = result;menuLayout.setLayoutParams（menuParams）; } } }

三、原理与说明
原理：
1、将ScrollView的触摸事件注册到LinearLayout中去。（LinearLayout中包含了ScrollView，不懂看布局）
2、首先判断手势是想要左右运动还是上下运动，如果是左右运动，那么LinearLayout得到触摸事件，即函数OnTouch返回true;如果想上下运动，即函数OnTouch返回false;
这里要注意的是，手势判断只一次，什么意思呢？就是说你第1次按下，到你一直按着，这中间只判断一次你的手势想要做的运动。
3、手指离开屏幕后，再来恢复所有的参数。

这是为大家分享的源码，请下载：Android仿UC浏览器左右上下滚动功能，希望本文所述对大家学习Android软件编程有所帮助。