ViewFlipper左右撥動模版,包含Listview,ScrollView的撥動

來源:互聯網
上載者:User

       初學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;}});}@Overridepublic 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();}}@Overridepublic 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 stubreturn 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 stubreturn false;}public void onShowPress(MotionEvent e) {// TODO Auto-generated method stub}public boolean onSingleTapUp(MotionEvent e) {// TODO Auto-generated method stubreturn 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];@Overrideprotected void onCreate(Bundle savedInstanceState) {// TODO Auto-generated method stubsuper.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為什麼不讓貼源碼?

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.