歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> Android之ViewFlipper滑屏切換效果

Android之ViewFlipper滑屏切換效果

日期:2017/3/1 10:56:15   编辑:Linux編程

設置了三個頁面,布局文件如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <AbsoluteLayout xmlns:Android="http://schemas.android.com/apk/res/android"
  3. android:orientation="vertical" android:layout_width="fill_parent"
  4. android:layout_height="fill_parent" android:background="@drawable/dbj">
  5. <ViewFlipper android:id="@+id/ViewFlipper"
  6. android:layout_width="fill_parent" android:layout_height="fill_parent">
  7. <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
  8. android:orientation="vertical" android:layout_width="fill_parent"
  9. android:layout_height="fill_parent">
  10. <TextView android:text="第 1 頁"
  11. android:textSize="35dp"
  12. android:layout_width="wrap_content"
  13. android:layout_height="wrap_content"
  14. android:layout_x="115dp"
  15. android:layout_y="20dp"/>
  16. </AbsoluteLayout>
  17. <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
  18. android:orientation="vertical" android:layout_width="fill_parent"
  19. android:layout_height="fill_parent">
  20. <TextView android:text="第 2 頁"
  21. android:textSize="35dp"
  22. android:layout_width="wrap_content"
  23. android:layout_height="wrap_content"
  24. android:layout_x="120dp"
  25. android:layout_y="20dp"/>
  26. </AbsoluteLayout>
  27. <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
  28. android:orientation="vertical" android:layout_width="fill_parent"
  29. android:layout_height="fill_parent">
  30. <TextView android:text="第 3 頁"
  31. android:textSize="35dp"
  32. android:layout_width="wrap_content"
  33. android:layout_height="wrap_content"
  34. android:layout_x="120dp"
  35. android:layout_y="20dp"/>
  36. </AbsoluteLayout>
  37. </ViewFlipper>
  38. <ImageButton android:layout_width="35dp"
  39. android:background="@drawable/pre_button" android:layout_height="40dp"
  40. android:id="@+id/preButton1" android:layout_x="101dp"
  41. android:layout_y="404dp">
  42. </ImageButton>
  43. <ImageButton android:layout_width="40dp"
  44. android:background="@drawable/next_button" android:layout_height="40dp"
  45. android:id="@+id/nextButton1" android:layout_x="182dp"
  46. android:layout_y="405dp">
  47. </ImageButton>
  48. </AbsoluteLayout>
主程序實現了OnGestureListener 接口,具體如下:
  1. import android.app.Activity;
  2. import android.os.Bundle;
  3. import android.view.GestureDetector;
  4. import android.view.GestureDetector.OnGestureListener;
  5. import android.view.MotionEvent;
  6. import android.view.View;
  7. import android.view.View.OnClickListener;
  8. import android.view.View.OnTouchListener;
  9. import android.view.animation.AnimationUtils;
  10. import android.widget.ImageButton;
  11. import android.widget.ViewFlipper;
  12. /**
  13. * ViewFlipperTest.java
  14. * @author Cloay
  15. * 2011-6-24
  16. */
  17. public class ViewFlipperTest extends Activity implements OnGestureListener {
  18. private ViewFlipper flipper;
  19. private GestureDetector detector;
  20. private ImageButton pre1Button;
  21. private ImageButton next1Button;
  22. @Override
  23. public void onCreate(Bundle savedInstanceState) {
  24. super.onCreate(savedInstanceState);
  25. setContentView(R.layout.zd);
  26. pre1Button = (ImageButton)findViewById(R.id.preButton1);
  27. pre1Button.setOnTouchListener(new OnTouchListener(){
  28. @Override
  29. public boolean onTouch(View v, MotionEvent event) {
  30. // TODO Auto-generated method stub
  31. if(event.getAction()==MotionEvent.ACTION_DOWN){ //按鈕按下背景圖片
  32. pre1Button.setBackgroundResource(R.drawable.pre_button1);
  33. }
  34. //按鈕up後設置背景圖片,並滑動到前一頁面
  35. else if(event.getAction()==MotionEvent.ACTION_UP){
  36. pre1Button.setBackgroundResource(R.drawable.pre_button);
  37. flipper.setInAnimation(AnimationUtils.loadAnimation(TestFlip.this, R.anim.push_right_in));
  38. flipper.setOutAnimation(AnimationUtils.loadAnimation(TestFlip.this,R.anim.push_right_out));
  39. flipper.showPrevious();
  40. }
  41. return false;
  42. }
  43. });
  44. next1Button = (ImageButton)findViewById(R.id.nextButton1);
  45. next1Button.setOnTouchListener(new OnTouchListener(){
  46. @Override
  47. public boolean onTouch(View v, MotionEvent event) {
  48. // TODO Auto-generated method stub
  49. if(event.getAction()==MotionEvent.ACTION_DOWN){
  50. next1Button.setBackgroundResource(R.drawable.next_button1);
  51. }
  52. //按鈕up後設置背景圖片,並滑動到後一頁面
  53. else if(event.getAction()==MotionEvent.ACTION_UP){
  54. next1Button.setBackgroundResource(R.drawable.next_button);
  55. flipper.setInAnimation(AnimationUtils.loadAnimation(TestFlip.this, R.anim.push_left_in));
  56. flipper.setOutAnimation(AnimationUtils.loadAnimation(TestFlip.this,R.anim.push_left_out));
  57. flipper.showNext();
  58. }
  59. return false;
  60. }
  61. });
  62. detector = new GestureDetector(this);
  63. flipper = (ViewFlipper) this.findViewById(R.id.ViewFlipper);
  64. }
  65. public boolean onDoubleTap(MotionEvent e) {
  66. if(flipper.isFlipping()) {
  67. flipper.stopFlipping();
  68. }else {
  69. flipper.startFlipping();
  70. }
  71. return true;
  72. }
  73. @Override
  74. public boolean onTouchEvent(MotionEvent event) {
  75. return this.detector.onTouchEvent(event);
  76. }
  77. @Override
  78. public boolean onDown(MotionEvent e) {
  79. // TODO Auto-generated method stub
  80. return false;
  81. }
  82. @Override
  83. public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,float velocityY) {
  84. //用戶按下屏幕,快速移動後松開(就是在屏幕上滑動)
  85. //e1:第一個ACTION_DOWN事件(手指按下的那一點)
  86. //e2:最後一個ACTION_MOVE事件 (手指松開的那一點)
  87. //velocityX:手指在x軸移動的速度 單位:像素/秒
  88. //velocityY:手指在y軸移動的速度 單位:像素/秒
  89. if (e1.getX() - e2.getX() > 60) {
  90. this.flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_in));
  91. this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_out));
  92. this.flipper.showNext();
  93. return true;
  94. } else if (e1.getX() - e2.getX() < -60) {
  95. this.flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_in));
  96. this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_out));
  97. this.flipper.showPrevious();
  98. return true;
  99. }
  100. return false;
  101. }
  102. @Override
  103. public void onLongPress(MotionEvent e) {
  104. // TODO Auto-generated method stub
  105. }
  106. @Override
  107. public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
  108. float distanceY) {
  109. // TODO Auto-generated method stub
  110. return false;
  111. }
  112. @Override
  113. public void onShowPress(MotionEvent e) {
  114. // TODO Auto-generated method stub
  115. }
  116. @Override
  117. public boolean onSingleTapUp(MotionEvent e) {
  118. // TODO Auto-generated method stub
  119. return false;
  120. }
  121. }
測試時,鼠標點擊模擬器快速移動松開(就是在屏幕上模擬手指滑動),結果如下:

Copyright © Linux教程網 All Rights Reserved