ViewFlipper左右拨动模版,包含Listview,ScrollView的拨动

       初学Android,编写这个MyViewFlipper真是费了好多劲,不足之处还望海涵。

       首先用到的资源,四个动画。

       

push_left_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromXDelta="100%p"
        android:toXDelta="0" />
</set>

push_left_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
      <translate android:fromXDelta="0" android:toXDelta="-100%p"  
        android:duration="500" />  
</set>

push_right_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
      <translate android:fromXDelta="-100%p" android:toXDelta="0"  
        android:duration="500" />  
</set>

push_right_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="100%p" />

</set>

MyViewFlipper代码:直接上代码,自己理解哈!其中很多小细节,非常蹊跷!国内的安卓技术论坛咋感觉都是千篇一律的一大抄。解决这些问题,英语提高不少。

package my.android.test;

import java.util.Map;
import android.content.Context;
import android.util.AttributeSet;
import android.view.GestureDetector.OnGestureListener;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.widget.Toast;
import android.widget.ViewFlipper;

/**
 * @author TMajier 使用示例: addView:增加视图 setTotalDataNum:如果是数据集的滑动切换,需要传入数据的总数
 *         setIsAllowMove:设置是否允许翻页 loadPreviousDate:加载上一页数据时处理方法
 *         loadNextDate:加载下一页数据时处理方法
 */
public class MyViewFlipper extends ViewFlipper implements OnGestureListener {
	private static final int FLING_MIN_DISTANCE = 100;
	private static final int FLING_MIN_VELOCITY = 100;
	int viewCount = 0;
	int currentIndex = 0; // 当前视图索引
	private int totalDataNum = 0; // 数据总数。若无数据可不设置
	private Boolean isAllowCycle = false; // 是否允许循环翻页
	Map<String, Object> collection = null;
	private GestureDetector mGestureDetector;
	private Context mContext;
	/**
	 * 加载下一页数据
	 */
	private MyViewFlipperLoadData loadNextDate;

	/**
	 * 加载上一页数据
	 */
	private MyViewFlipperLoadData loadPreviousDate;

	public MyViewFlipper(Context context) {
		super(context);
		mContext = context;
	}

	public MyViewFlipper(Context arg0, AttributeSet arg1) {
		super(arg0, arg1);
		mContext = arg0;
	}

	/**
	 * 初始化ViewFlipper
	 * 
	 * @param totalNum
	 *            数据总数(数据总数确定情况下设置;默认值为0)
	 * @param isAllowCycle
	 *            是否允许循环(数据总数确定情况下设置;默认值为true)
	 * @param currentIndex
	 *            当前数据索引(数据总数确定情况下设置;默认值为0)
	 * @param views
	 *            需要加入viewflipper的视图集合
	 * @param loadPreviousData
	 *            在触发上一页操作时数据绑定
	 * @param loadNextData
	 *            在触发下一页操作时数据绑定
	 */
	public void setMyViewFlipper(int totalNum, Boolean isAllowCycle,
			int currentIndex, View[] views,
			MyViewFlipperLoadData loadPreviousData,
			MyViewFlipperLoadData loadNextData) {
		mGestureDetector = new GestureDetector(this);
		setChildTouchListener(this);
		// ViewFlipper本身来说并没有拖动事件,所以要加上这句话,不然是不会执行滑动事件的。这个问题比较畸形,找了好久。
		setLongClickable(true);
		this.totalDataNum = totalNum;
		this.isAllowCycle = isAllowCycle;
		this.currentIndex = currentIndex;
		this.loadPreviousDate = loadPreviousData;
		this.loadNextDate = loadNextData;
		this.viewCount = views.length;
		for (int i = 0; i < views.length; i++) {
			this.addView(views[i]);
		}
		
		this.setDisplayedChild(currentIndex);
	}

	/**
	 * 设置子控件监听事件
	 * 
	 * @param view
	 */
	public void setChildTouchListener(View view) {
		view.setOnTouchListener(new OnTouchListener() {

			public boolean onTouch(View v, MotionEvent event) {
				mGestureDetector.onTouchEvent(event);
				return false;
			}
		});
	}

	@Override
	public void showPrevious() {
		if (isAllowCycle || (!isAllowCycle && currentIndex > 0)) {
			currentIndex--;
			int index = Math.abs(currentIndex) % viewCount;
			loadPreviousDate.loadData(index);
			this.setInAnimation(AnimationUtils.loadAnimation(this.getContext(),
					R.anim.push_right_in));
			this.setOutAnimation(AnimationUtils.loadAnimation(
					this.getContext(), R.anim.push_right_out));
			super.showPrevious();
		} else {
			Toast.makeText(mContext, "已经是第一页了!", Toast.LENGTH_SHORT).show();
		}
	}

	@Override
	public void showNext() {
		if (isAllowCycle || (!isAllowCycle && currentIndex < totalDataNum - 1)) {
			currentIndex++;
			int index = Math.abs(currentIndex) % viewCount;
			loadNextDate.loadData(index);
			this.setInAnimation(AnimationUtils.loadAnimation(this.getContext(),
					R.anim.push_left_in));
			this.setOutAnimation(AnimationUtils.loadAnimation(
					this.getContext(), R.anim.push_left_out));
			super.showNext();
		} else {
			Toast.makeText(mContext, "已经是最后一页了!", Toast.LENGTH_SHORT).show();
		}
	}

	/**
	 * 返回数组当前索引
	 */
	public int getCurrentDataIndex() {
		if ((totalDataNum == 0)) {
			return 0;
		} else {
			return (totalDataNum + currentIndex % totalDataNum) % totalDataNum;
		}
	}

	public interface MyViewFlipperLoadData {
		/**
		 * 在执行上一页或下一页时对View进行数据加载 当前view索引
		 * 
		 * @param index
		 *            当前视图索引
		 */
		void loadData(int index);
	}

	public boolean onDown(MotionEvent e) {
		// TODO Auto-generated method stub
		return false;
	}

	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
			float velocityY) {
		if (e1.getX() - e2.getX() > FLING_MIN_DISTANCE
				&& Math.abs(velocityX) > FLING_MIN_VELOCITY) {

			this.showNext();
		} else if (e2.getX() - e1.getX() > FLING_MIN_DISTANCE
				&& Math.abs(velocityX) > FLING_MIN_VELOCITY) {
			this.showPrevious();
		}
		return false;
	}

	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub

	}

	public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
			float distanceY) {
		// TODO Auto-generated method stub
		return false;
	}

	public void onShowPress(MotionEvent e) {
		// TODO Auto-generated method stub

	}

	public boolean onSingleTapUp(MotionEvent e) {
		// TODO Auto-generated method stub
		return false;
	}

}
使用方法:

               

package my.android.test;

import java.util.zip.Inflater;

import my.android.test.MyViewFlipper.MyViewFlipperLoadData;
import my.android.test.R.id;
import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.ScrollView;
import android.widget.SlidingDrawer;
import android.widget.TextView;
import android.widget.ViewFlipper;
import android.widget.LinearLayout.LayoutParams;

public class SwitchPageActivity extends Activity {
	ScrollLayout sl = null;
	MyViewFlipper myViewFlipper = null;
	String[] strings = { "第一章", "第二章", "第三章", "第四章", "第五章", "第六章", "第七章",
			"第八章", "第九章" };
	int totalNum = 9;
	ViewElement[] viewElements = new ViewElement[2];

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		useMyViewFlipper();
	}

	private void useMyViewFlipper() {
		setContentView(R.layout.switcher1);
		myViewFlipper = (MyViewFlipper) findViewById(id.myViewFlipper1);
		LayoutInflater layoutInflater = this.getLayoutInflater();
		View view = layoutInflater.inflate(R.layout.bb, null);
		View view2 = layoutInflater.inflate(R.layout.bb, null);
		viewElements[0] = new ViewElement(view);
		viewElements[1] = new ViewElement(view2);
		myViewFlipper.setMyViewFlipper(totalNum, false, 4, new View[] { view,
				view2 }, loadViewData, loadViewData);
	}

	MyViewFlipperLoadData loadViewData = new MyViewFlipperLoadData() {
		public void loadData(int index) {
			viewElements[index].textView.setText(strings[myViewFlipper
					.getCurrentDataIndex()]);
		}
	};
	
	public class ViewElement {
		TextView textView;
		ScrollView sl;

		public ViewElement(View view) {
			this.textView = (TextView) view.findViewById(id.tv);
			this.sl = (ScrollView) view.findViewById(id.ScrollView1);
			// ScrollView滑动时触发切换事件
			myViewFlipper.setChildTouchListener(this.sl);
		}
	}
}

其中用到的两个布局文件:

switch1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
   
    android:orientation="vertical" android:id="@+id/ll">



    <my.android.test.MyViewFlipper
        android:id="@+id/myViewFlipper1"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

    </my.android.test.MyViewFlipper>

</LinearLayout>

bb.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#abcdef"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="这个不在scrollview中" android:textColor="#000" android:textSize="46sp"/>

    <ScrollView
        android:id="@+id/ScrollView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#cdcdcd" >


        <LinearLayout
            android:id="@+id/linearLayout2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >

               <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:text="TextView"
            android:textColor="#000"
            android:textSize="30sp" />

               <TextView
                   android:id="@+id/TextView02"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView01"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView03"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView04"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView05"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView06"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView07"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView08"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView09"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView10"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView11"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView12"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView13"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView14"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView15"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView16"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView17"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView18"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView19"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView20"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView21"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView22"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView23"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView24"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView25"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView26"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView27"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView28"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView29"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView30"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView31"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/TextView32"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

               <TextView
                   android:id="@+id/textView1"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:text="TextView" />

        </LinearLayout>
     
    </ScrollView>

</LinearLayout>

以上代码,没有涉及到其他的引用。拷贝过去就能用!不明白csdn为什么不让贴源码?

posted @ 2012-05-29 12:26  TMajier  阅读(306)  评论(0编辑  收藏  举报