实现页面侧滑的两种方式GestureDetector和ViewPager

页面侧滑的功能在Android的APP里面应用越来越广泛，最近几天也在弄一个APP里面有要实现侧滑功能，下面就通过这两种方法来实现一下。

1.通过GestureDetector来实现此功能，由于现在手机版本更新速度太快，由于SDK17版本把GestureDetector的手势侧滑功能阉割掉了。但是只要手动导入

import android.view.GestureDetector.SimpleOnGestureListener;包还是可以实现的下面直接贴出代码。

用一个基类实现代码跳转的方法，这样可以很好的简化代码。

<pre name="code" class="java">package com.lanzhu1933.mobilesafe;

import android.app.Activity;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.widget.Toast;

public abstract class BaseSetupActivity extends Activity {
//手势识别器
private GestureDetector detector;
protected SharedPreferences sp;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

sp = getSharedPreferences("config", MODE_PRIVATE);
//2.实例化这个手势识别器
detector = new GestureDetector(BaseSetupActivity.this, new SimpleOnGestureListener(){
/**
* 当我们手指在上面滑动的时候回调
*/
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2,
float velocityX, float velocityY) {

//屏蔽在X滑动很慢的情
if(Math.abs(velocityX)<100){
Toast.makeText(getApplicationContext(), "滑动得太慢了", 0).show();
return true;
}
//屏蔽斜划
if(Math.abs((e2.getRawY()- e1.getRawY()))>100){
Toast.makeText(getApplicationContext(), "不能这样划", 1).show();
return true;
}

if((e2.getRawX()- e1.getRawX())>200){
showPre();
return true;

}
if((e1.getRawX()- e2.getRawX())>200){
//显示下一个页面
showNext();
return true;

}
return super.onFling(e1, e2, velocityX, velocityY);
}

});
}

protected  abstract void showNext() ;
protected  abstract void showPre() ;

public void next(View view ){
showNext();

}

public void previous(View view ){
showPre() ;
}

//3.使用手势识别器
@Override
public boolean onTouchEvent(MotionEvent event) {
detector.onTouchEvent(event);
return super.onTouchEvent(event);
}
}

<pre name="code" class="java">package com.lanzhu1933.mobilesafe;

import android.content.Intent;
import android.os.Bundle;
import android.view.GestureDetector;

public class Setup1Activity extends BaseSetupActivity {

protected static final String TAG = "Setup1Activity";
//手势识别器
private GestureDetector detector;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_setup1);

}

@Override
protected void showNext() {
Intent intent = new Intent(this,Setup2Activity.class);
startActivity(intent);
finish();
//该方法要在finish();和startActivity后执行
overridePendingTransition(R.anim.tran_in, R.anim.tran_out);

}

@Override
protected void showPre() {

}

}

<pre name="code" class="java">package com.lanzhu1933.mobilesafe;

import com.lanzhu1933.mobilesafe.ui.SettingItemView;

import android.content.Intent;
import android.content.SharedPreferences.Editor;
import android.os.Bundle;
import android.telephony.TelephonyManager;
import android.text.TextUtils;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Toast;

public class Setup2Activity extends BaseSetupActivity {

private SettingItemView siv_setup2_sim;
/**
* 读取手机SIM的信息
*/
private TelephonyManager tm;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_setup2);
tm = (TelephonyManager) getSystemService(TELEPHONY_SERVICE);
siv_setup2_sim = (SettingItemView) findViewById(R.id.siv_setup2_sim);

String sim = sp.getString("sim", null);
if(TextUtils.isEmpty(sim)){//如果勾选，既已经绑定
siv_setup2_sim.setChecked(false);
}else{//没有勾选就没有绑定
siv_setup2_sim.setChecked(true);
}
siv_setup2_sim.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View v) {
String sim  = tm.getSimSerialNumber();
Editor editor	= sp.edit();
if(siv_setup2_sim.isChecked()){
siv_setup2_sim.setChecked(false);
/**
* 得到Sim序列号
*/
editor.putString("sim", null);
editor.commit();
}else{
siv_setup2_sim.setChecked(true);
/**
* 得到Sim序列号
*/
editor.putString("sim", sim);
editor.commit();
}
}
});
}

@Override
protected void showNext() {
//取出是否绑定SIM卡
String sim = sp.getString("sim", null);
if(TextUtils.isEmpty(sim)){
Toast.makeText(this, "请勾选绑定SIM卡", 1).show();
return;

}
Intent intent = new Intent(this, Setup3Activity.class);
startActivity(intent);
finish();
overridePendingTransition(R.anim.tran_in, R.anim.tran_out);

}

@Override
protected void showPre() {
Intent intent = new Intent(this, Setup1Activity.class);
startActivity(intent);
finish();
overridePendingTransition(R.anim.tran_pre_in, R.anim.tran_pre_out);

}

}

package com.lanzhu1933.mobilesafe;

import android.content.Intent;
import android.os.Bundle;

public class Setup3Activity extends BaseSetupActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_setup3);
}

@Override
protected void showNext() {
Intent intent = new Intent(this,Setup4Activity.class);
startActivity(intent);
finish();
overridePendingTransition(R.anim.tran_in, R.anim.tran_out);

}

@Override
protected void showPre() {
Intent intent = new Intent(this,Setup2Activity.class);
startActivity(intent);
finish();
overridePendingTransition(R.anim.tran_pre_in, R.anim.tran_pre_out);

}

}

界面4

package com.lanzhu1933.mobilesafe;

import android.content.Intent;
import android.content.SharedPreferences;
import android.content.SharedPreferences.Editor;
import android.os.Bundle;

public class Setup4Activity extends BaseSetupActivity {

private SharedPreferences sp;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_setup4);
sp = getSharedPreferences("config", MODE_PRIVATE);
}

@Override
protected void showNext() {
Editor editor = sp.edit();
editor.putBoolean("configed", true);
editor.commit();
Intent intent = new Intent(this,LostFindActivity.class);
startActivity(intent);
finish();
overridePendingTransition(R.anim.tran_in, R.anim.tran_out);

}
@Override
protected void showPre() {
Intent intent = new Intent(this,Setup3Activity.class);
startActivity(intent);
finish();
overridePendingTransition(R.anim.tran_pre_in, R.anim.tran_pre_out);

}

}

2.Viewpager实现侧滑

package com.lanzhu1994;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;

public class Viewpager extends Activity {

private static final String TAG = "ViewPager";
ViewPager mViewPager;
private ImageView imageView;
private ImageView[] imageViews;
private Button button;
private ArrayList<View> pageViews;
// 包裹小圆点的LinearLayout
private ViewGroup group;
// 导航页图片资源
public int[] guides = new int[] { R.drawable.guidepage1,
R.drawable.guidepage2, R.drawable.guidepage3, R.drawable.guidepage4 };

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);// 设置无标题
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);// 去掉信息栏
setContentView(R.layout.viewpager);
mViewPager = (ViewPager) findViewById(R.id.viewFlipper);
button = (Button) findViewById(R.id.button1);
group = (ViewGroup) findViewById(R.id.viewGroup);
imageViews = new ImageView[guides.length];
initWithPageGuideMode();
}

/**
* 程序导航页效果
*/
public void initWithPageGuideMode() {

List<View> mList = new ArrayList<View>();
LayoutInflater inflat = LayoutInflater.from(this);
// 先添加一个最左侧空的view
View item = inflat.inflate(R.layout.pageguide, null);
for (int i = 0; i < guides.length; i++) {
LinearLayout layout = new LinearLayout(this);
LayoutParams ltp = new LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT);
ite
b931
m = inflat.inflate(R.layout.pageguide, null);
item.setBackgroundResource(guides[i]);
layout.addView(item, ltp);
mList.add(layout);
Log.v(TAG,"输出图片的I的值："+i+"------>");
}

/**
* 添加导航页小圆圈
*/
imageViews = new ImageView[mList.size()];
for (int i = 0; i < mList.size(); i++) {
LinearLayout.LayoutParams margin = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
//设置每个小圆点距离左边的间距
margin.setMargins(20, 0, 0, 0);
imageView = new ImageView(Viewpager.this);
//设置每个小圆点的宽高
imageView.setLayoutParams(new LayoutParams(15, 15));
imageViews[i] = imageView;
if (i==0) {
// 默认选中第一张图片
imageViews[i]
.setBackgroundResource(R.drawable.page_indicator_focused);
} else {
//其他图片都设置未选中状态
imageViews[i]
.setBackgroundResource(R.drawable.page_indicator_unfocused);
}
group.addView(imageViews[i], margin);
}

// 经过遍历，此时item是最后一个view，设置button
Button btn = (Button) item.findViewById(R.id.button1);
btn.setVisibility(View.VISIBLE);
// btn.setOnClickListener(this)，设置最后一个页面上button的监听
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent();
intent.setClass(Viewpager.this, MainActivity.class);
startActivity(intent);
}
});
// ViewPager最重要的设置Adapter，这和ListView一样的原理
MViewPageAdapter adapter = new MViewPageAdapter(mList);
mViewPager.setAdapter(adapter);
mViewPager.setOnPageChangeListener(adapter);
mViewPager.setCurrentItem(1);

}

/**
* 内部类，继承PagerAdapter，当然你也可以直接 new PageAdapter
*
* @author zych
*
*/
class MViewPageAdapter extends PagerAdapter implements OnPageChangeListener {

private List<View> mViewList;

public MViewPageAdapter(List<View> views) {
mViewList = views;
}

@Override
public int getCount() {
return mViewList.size();
}

@Override
public boolean isViewFromObject(View arg0, Object arg1) {

return arg0 == arg1;
}

@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(mViewList.get(position), 0);
return mViewList.get(position);
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mViewList.get(position));
}

@Override
public void onPageScrollStateChanged(int arg0) {

}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {

}

@Override
public void onPageSelected(int position) {

//			if (position == 0) {
//				mViewPager.setCurrentItem(1);
//			} else if (position == mViewList.size() - 1) {
//				mViewPager.setCurrentItem(position - 1);
//				Toast.makeText(getApplicationContext(), "页面即将跳转",
//						Toast.LENGTH_SHORT).show();
//				// 应该在这里跳转到MainActivity
//				// startActivity(intent);
//			}
//遍历数组让当前选中图片下的小圆点设置颜色
for (int i = 0; i < imageViews.length; i++) {
imageViews[position]
.setBackgroundResource(R.drawable.page_indicator_focused);

if (position != i) {
imageViews[i]
.setBackgroundResource(R.drawable.page_indicator_unfocused);
}
}

}

}

}