生活随笔
收集整理的這篇文章主要介紹了
Android使用ViewFlipper实现左右滑动效果面
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
在我的博客中,上次是使用ViewPager實現(xiàn)左右滑動的效果的,請看文章:Android使用ViewPager實現(xiàn)左右滑動效果?。
?
這次我來使用ViewFlipper實現(xiàn)這種效果,好了,先看看效果吧:
?
?
?
?
效果看完了就來實現(xiàn)這個效果。
1.布局文件
主界面使用下面的布局:
[html]?view plaincopy
<?xml?version="1.0"?encoding="utf-8"?>?? <FrameLayout?xmlns:android="http://schemas.android.com/apk/res/android"?? ????android:layout_width="fill_parent"?? ????android:layout_height="fill_parent"?? ????android:orientation="vertical"?>?? ?? ????<ViewFlipper?android:id="@+id/ViewFlipper1"?? ????????android:layout_width="fill_parent"??? ????????android:layout_height="fill_parent">?? ????</ViewFlipper>?? ?????? ?????? ?????? ????<LinearLayout?? ????????android:orientation="horizontal"?? ????????android:layout_width="wrap_content"?? ?????????? ????????android:layout_gravity="bottom|center_horizontal"?? ????????android:layout_height="wrap_content"?? ?????????? ????????>?? ????????<ImageView?? ????????????android:layout_width="wrap_content"?? ????????????android:layout_height="wrap_content"?? ????????????android:src="@drawable/da"?? ???????????? ????????????android:id="@+id/imageview1"?? ????????????/>?? ????????<ImageView?? ????????????android:layout_width="wrap_content"?? ????????????android:layout_height="wrap_content"?? ????????????android:src="@drawable/xiao"?? ????????????android:id="@+id/imageview2"?? ????????????/>?? ????????<ImageView?? ????????????android:layout_width="wrap_content"?? ????????????android:layout_height="wrap_content"?? ????????????android:src="@drawable/xiao"?? ????????????android:id="@+id/imageview3"?? ????????????/>?? ????????<ImageView?? ????????????android:layout_width="wrap_content"?? ????????????android:layout_height="wrap_content"?? ????????????android:src="@drawable/xiao"?? ????????????android:id="@+id/imageview4"?? ????????????/>?? ?????????????? ????????</LinearLayout>?? ?? ?? </FrameLayout>??
簡單的介紹一下布局文件:最外層是一個FrameLayout,使用FrameLayout就是為了是的下面的四個點在ViewFlipper上面。LayoutLayout在FrameLayout的下面和水平居中。
2.ViewFlipper的使用
[java]?view plaincopy
flipper?=?(ViewFlipper)?this.findViewById(R.id.ViewFlipper1);?? ????????flipper.addView(addImageView(R.drawable.png1o));?? ????????flipper.addView(addImageView(R.drawable.png2o));?? ????????flipper.addView(addImageView(R.drawable.png3o));?? ?? ????????flipper.addView(addView());??
?
在Activity中聲明一個ViewFlipper的對象,在布局中找到。將三張圖片加到ViewFlipper中,另外再加一個View,這個View是從XML布局文件中得到的。布局文件如下:
[html]?view plaincopy
<?xml?version="1.0"?encoding="utf-8"?>??? <LinearLayout?xmlns:android="http://schemas.android.com/apk/res/android"?? ????android:orientation="vertical"?? ????android:layout_width="fill_parent"?? ????android:layout_height="fill_parent"?? ?????? ????>?? <Button?? ????????android:id="@+id/button"?? ????????android:layout_width="wrap_content"?? ????????android:layout_height="wrap_content"?? ????????android:layout_marginBottom="45dp"???????? ????????android:text="進入程序"?? ????????android:textColor="#3E3E3E"??? ????????android:layout_gravity="center_horizontal"?? ????????/>?? </LinearLayout>???
在這個布局文件中有一個Button,用于跳轉(zhuǎn)Activity用。
?
在Activity中聲明一個GestureDetector對象,在onCreate方法中分配內(nèi)存。
detector = new GestureDetector(this);
使用this為參數(shù),那么就要使得activity類impllements? OnGestureListener接口。重寫幾個方法。覆蓋父類的onTouchEvent方法,在這個方法中如下寫:
[java]?view plaincopy
@Override?? ????public?boolean?onTouchEvent(MotionEvent?event)?{?? ?????????? ????????return?this.detector.onTouchEvent(event);??? ????}??
這樣就使得detector能接受消息響應(yīng)了。
?
在實現(xiàn)OnGestureListener的方法中判斷用戶的滑動來切換界面:
[java]?view plaincopy
@Override?? public?boolean?onFling(MotionEvent?e1,?MotionEvent?e2,?float?velocityX,?? ????????float?velocityY)?{?? ????System.out.println("in------------>>>>>>>");?? ????if?(e1.getX()?-?e2.getX()?>?120)?{?? ????????if?(i?<?3)?{?? ????????????i++;?? ????????????setImage(i);?? ????????????this.flipper.setInAnimation(AnimationUtils.loadAnimation(this,?? ????????????????????R.anim.animation_right_in));?? ????????????this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this,?? ????????????????????R.anim.animation_left_out));?? ????????????this.flipper.showNext();?? ????????}?? ????????return?true;?? ????}??? ????else?if?(e1.getX()?-?e2.getX()?<?-120)?{?? ????????if?(i?>?0)?{?? ????????????i--;?? ????????????setImage(i);?? ????????????this.flipper.setInAnimation(AnimationUtils.loadAnimation(this,?? ????????????????????R.anim.animation_left_in));?? ????????????this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this,?? ????????????????????R.anim.animation_right_out));?? ????????????this.flipper.showPrevious();?? ????????}?? ????????return?true;?? ????}?? ????return?false;?? ?????? }?? ?? void?setImage(int?i)?? {?? ????for(int?j=0;j<4;j++)?? ????{?? ????????if(j!=i)?? ????????iamges[j].setImageResource(R.drawable.xiao);?? ????????else?? ????????????iamges[j].setImageResource(R.drawable.da);?? ????}?? }??
界面切換的時候改變下面的四個小ImageView的圖片。切換的動畫在res/anim文件夾中,這里就不多說了。
?
整個工程的下載:Android使用ViewFlipper實現(xiàn)左右滑動效果面。。
總結(jié)
以上是生活随笔為你收集整理的Android使用ViewFlipper实现左右滑动效果面的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網(wǎng)站內(nèi)容還不錯,歡迎將生活随笔推薦給好友。