程序结构图:
ViewFliper中的代码
- 1.package com.scnu.mc.myviewfliper;
- 2.
- 3.import Android.app.Activity;
- 4.import android.os.Bundle;
- 5.import android.view.MotionEvent;
- 6.import android.widget.ViewFlipper;
- 7.
- 8.public class ViewFliper extends Activity {
- 9.
- 10. ViewFlipper viewFlipper = null;
- 11. float startX;
- 12.
- 13. @Override
- 14. public void onCreate(Bundle savedInstanceState) {
- 15. super.onCreate(savedInstanceState);
- 16. setContentView(R.layout.main);
- 17.
- 18. init();
- 19. }
- 20.
- 21. private void init() {
- 22. viewFlipper = (ViewFlipper) this.findViewById(R.id.viewFlipper);
- 23. }
- 24.
- 25. @Override
- 26. public boolean onTouchEvent(MotionEvent event) {
- 27. switch (event.getAction()) {
- 28. case MotionEvent.ACTION_DOWN:
- 29. startX = event.getX();
- 30. break;
- 31. case MotionEvent.ACTION_UP:
- 32.
- 33. if (event.getX() > startX) { // 向右滑动
- 34. viewFlipper.setInAnimation(this, R.anim.in_left2right);
- 35. viewFlipper.setOutAnimation(this, R.anim.out_left2right);
- 36. viewFlipper.showNext();
- 37. } else if (event.getX() < startX) { // 向左滑动
- 38. viewFlipper.setInAnimation(this, R.anim.in_right2left);
- 39. viewFlipper.setOutAnimation(this, R.anim.out_right2left);
- 40. viewFlipper.showPrevious();
- 41. }
- 42. break;
- 43. }
- 44.
- 45. return super.onTouchEvent(event);
- 46. }
- 47.
- 48.}
main.xml代码
- 1.<?xml version="1.0" encoding="utf-8"?>
- 2.<LinearLayout xmlns:Android="http://schemas.android.com/apk/res/android"
- 3. Android:layout_width="fill_parent" android:layout_height="fill_parent"
- 4. Android:orientation="vertical">
- 5. <ViewFlipper Android:id="@+id/viewFlipper"
- 6. Android:layout_width="fill_parent" android:layout_height="fill_parent">
- 7. <!-- 第一个页面 -->
- 8. <LinearLayout Android:layout_width="fill_parent"
- 9. Android:layout_height="fill_parent" android:gravity="center">
- 10. <ImageView Android:layout_width="wrap_content"
- 11. Android:layout_height="wrap_content" android:src="@drawable/a1" />
- 12. </LinearLayout>
- 13. <!-- 第二个页面 -->
- 14. <LinearLayout Android:layout_width="fill_parent"
- 15. Android:layout_height="fill_parent" android:gravity="center">
- 16. <ImageView Android:layout_width="wrap_content"
- 17. Android:layout_height="wrap_content" android:src="@drawable/a2"
- 18. Android:gravity="center" />
- 19. </LinearLayout>
- 20. <!-- 第三个页面 -->
- 21. <LinearLayout Android:layout_width="fill_parent"
- 22. Android:layout_height="fill_parent" android:gravity="center">
- 23.
- 24. <ImageView Android:layout_width="wrap_content"
- 25. Android:layout_height="wrap_content" android:src="@drawable/a3"
- 26. Android:gravity="center" />
- 27. </LinearLayout>
- 28. <!-- 第四个页面 -->
- 29. <LinearLayout Android:layout_width="fill_parent"
- 30. Android:layout_height="fill_parent" android:gravity="center">
- 31.
- 32. <ImageView Android:layout_width="wrap_content"
- 33. Android:layout_height="wrap_content" android:src="@drawable/a4"
- 34. Android:gravity="center" />
- 35. </LinearLayout>
- 36. </ViewFlipper>
- 37.</LinearLayout>
4个动画效果的xml文件
in_left2right----从左到右进入屏幕
- 1.<?xml version="1.0" encoding="utf-8"?>
- 2.<set xmlns:Android="http://schemas.android.com/apk/res/android" >
- 3. <translate
- 4. Android:duration="30"
- 5. Android:fromXDelta="-100%p"
- 6. Android:toXDelta="0" />
- 7.</set>
in_right2left----从右至左进入屏幕
- 1.<?xml version="1.0" encoding="utf-8"?>
- 2.<set xmlns:Android="http://schemas.android.com/apk/res/android" >
- 3. <translate
- 4. Android:duration="30"
- 5. Android:fromXDelta="100%p"
- 6. Android:toXDelta="0" />
- 7.</set>
out_left2right----从左到右退出屏幕
- 1.<?xml version="1.0" encoding="utf-8"?>
- 2.<set xmlns:Android="http://schemas.android.com/apk/res/android" >
- 3. <translate
- 4. Android:duration="30"
- 5. Android:fromXDelta="0"
- 6. Android:toXDelta="100%p" />
- 7.</set>
out_right2left----从右至左退出屏幕
- 1.<?xml version="1.0" encoding="utf-8"?>
- 2.<set xmlns:Android="http://schemas.android.com/apk/res/android" >
- 3. <translate
- 4. Android:duration="30"
- 5. Android:fromXDelta="0"
- 6. Android:toXDelta="-100%p" />
- 7.</set>
注:fromXDelta和toXDelta代表控件相对应parent的偏移距离,个人理解是"100%p"代表控件向右跑到屏幕的外面,"-100%p"代表控件向左跑到屏幕的外部。下面附上个人理解的图。