ViewFlipper实现多页面切换

原创

wx5aae83353cec4 2022-09-12 10:12:53 ©著作权

©著作权归作者所有：来自51CTO博客作者wx5aae83353cec4的原创作品，请联系作者获取转载授权，否则将追究法律责任

1、屏幕切换指的是在同一个Activity内屏幕见的切换，最长见的情况就是在一个FrameLayout内有多个页面，比如一个系统设置页面；一个个性化设置页面。
2、介绍ViewFilpper类
ViewFlipper
extends ViewAnimator
java.lang.Object
↳ android.view.View

↳ android.view.ViewGroup

↳ android.widget.FrameLayout

↳ android.widget.ViewAnimator

↳ android.widget.ViewFlipper
Class Overview
Simple ViewAnimator that will animate between two or more views that have been added to it. Only one child is shown at a time. If requested, can automatically flip between each child at a regular interval.

意思是：简单的ViewAnimator之间,两个或两个以上的view加上动画效果。只有一个小孩会显示在一个时间。如果需要,每个孩子能自动翻转之间在固定的时间间隔。

该类继承了Framelayout类，ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。

该类有如下几个和动画相关的函数：

setInAnimation：设置View进入屏幕时候使用的动画，该函数有两个版本，一个接受单个参数，类型为android.view.animation.Animation；一个接受两个参数，类型为Context和int，分别为Context对象和定义Animation的resourceID。

setOutAnimation: 设置View退出屏幕时候使用的动画，参数setInAnimation函数一样。

showNext：调用该函数来显示FrameLayout里面的下一个View。

showPrevious：调用该函数来显示FrameLayout里面的上一个View。

3、首选看一下定义四个动画的xml文件：

in_left_right.xml——从左到右进入屏幕

[html] 
   view plain
   copy 

1. <?xml version="1.0" encoding="utf-8"?>
2. <set
3. xmlns:android="http://schemas.android.com/apk/res/android"
4. >
5. 
6. <translate
7. android:fromXDelta="-100%p"
8. android:toXDelta="0"
9. android:duration="2000"
10. />
11. 
12. </set>

out_left_right.xml——从左到右出去屏幕

[html] 
   view plain
   copy 
1. <?xml version="1.0" encoding="utf-8"?>
2. <set
3. xmlns:android="http://schemas.android.com/apk/res/android"
4. >
5. 
6. <translate
7. android:fromXDelta="0"
8. android:toXDelta="100%p"
9. android:duration="2000"
10. />
11. 
12. </set>

in_right_left.xml——从右到左进入屏幕

[html] 
   view plain
   copy 
1. <?xml version="1.0" encoding="utf-8"?>
2. <set
3. xmlns:android="http://schemas.android.com/apk/res/android"
4. >
5. 
6. <translate
7. android:fromXDelta="100%p"
8. android:toXDelta="0"
9. android:duration="2000"
10. />
11. 
12. </set>

out_right_left.xml——从右到左出去屏幕

[html] 
   view plain
   copy 
1. <?xml version="1.0" encoding="utf-8"?>
2. <set
3. xmlns:android="http://schemas.android.com/apk/res/android"
4. >
5. 
6. <translate
7. android:fromXDelta="0"
8. android:toXDelta="-100%p"
9. android:duration="2000"
10. />
11. 
12. </set>

4、定义main.xml文件

[html] 
   view plain
   copy 
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"
4. android:layout_height="fill_parent"
5. android:background="#ffffff"
6. android:orientation="vertical"
7. android:padding="15dp" >
8. 
9. <ViewFlipper
10. android:id="@+id/flipper"
11. android:layout_width="fill_parent"
12. android:layout_height="fill_parent" >
13. 
14. <!-- 第一个页面 -->
15. <LinearLayout
16. android:id="@+id/layout1"
17. android:layout_width="fill_parent"
18. android:layout_height="fill_parent"
19. android:orientation="vertical">
20. 
21. <Spinner
22. android:id="@+id/spinner"
23. android:layout_width="fill_parent"
24. android:layout_height="wrap_content" />
25. 
26. <com.tiantang.testandroid1.MyTextView
27. android:id="@+id/mytext"
28. android:layout_width="fill_parent"
29. android:layout_height="wrap_content"
30. android:clickable="true"
31. android:ellipsize="marquee"
32. android:focusable="true"
33. android:focusableInTouchMode="true"
34. android:lines="1"
35. android:marqueeRepeatLimit="marquee_forever"
36. android:scrollHorizontally="true"
37. android:text="1234567890987654321234556778909876765453234567898765322"
38. android:textColor="#000000"
39. android:textSize="20dp" />
40. </LinearLayout>
41. <!-- 第二个页面 -->
42. <SlidingDrawer
43. android:id="@+id/drawer"
44. android:layout_width="fill_parent"
45. android:layout_height="fill_parent"
46. android:content="@+id/content"
47. android:handle="@+id/handle" >
48. 
49. <ImageView
50. android:id="@id/handle"
51. android:layout_width="50dp"
52. android:layout_height="50dp"
53. android:src="@drawable/info" />
54. 
55. <ImageView
56. android:id="@id/content"
57. android:layout_width="fill_parent"
58. android:layout_height="fill_parent"
59. android:src="@drawable/confirm_bg" />
60. </SlidingDrawer>
61. </ViewFlipper>
62. 
63. </LinearLayout>

5、java代码实现：

[java] 
   view plain
   copy 
  
1. package com.tiantang.testandroid1;
2. 
3. import android.app.Activity;
4. import android.content.Context;
5. import android.os.Bundle;
6. import android.view.GestureDetector;
7. import android.view.GestureDetector.OnGestureListener;
8. import android.view.LayoutInflater;
9. import android.view.MotionEvent;
10. import android.view.View;
11. import android.view.View.OnTouchListener;
12. import android.view.ViewGroup;
13. import android.widget.ArrayAdapter;
14. import android.widget.BaseAdapter;
15. import android.widget.Button;
16. import android.widget.EditText;
17. import android.widget.ListView;
18. import android.widget.RadioButton;
19. import android.widget.SlidingDrawer;
20. import android.widget.Spinner;
21. import android.widget.TextView;
22. import android.widget.ViewFlipper;
23. 
24. public class TestAndroid1Activity extends Activity {
25. /** Called when the activity is first created. */
26. private Spinner spinner;
27. 
28. private ViewFlipper flipper;
29. private MyAdapter adapter;
30. private TextView text;
31. private SlidingDrawer drawer;
32. private GestureDetector detector;
33. 
34. @Override
35. public void onCreate(Bundle savedInstanceState) {
36. super.onCreate(savedInstanceState);
37. setContentView(R.layout.main);
38. spinner = (Spinner) findViewById(R.id.spinner);
39. drawer = (SlidingDrawer) findViewById(R.id.drawer);
40. flipper = (ViewFlipper) findViewById(R.id.flipper);
41. new String[]{"1234567890987654321234556778909876765453234567898765322"};
42. new ArrayAdapter<String>(this, R.layout.mytext, strs);
43. spinner.setAdapter(adapter);
44. 
45. true);
46. new OnTouchListener() {
47. @Override
48. public boolean onTouch(View v, MotionEvent event) {
49. // TODO Auto-generated method stub
50. detector.onTouchEvent(event);
51. return false;
52. }
53. });
54. new GestureDetector(this, new OnGestureListener(){
55. @Override
56. public boolean onDown(MotionEvent e) {
57. //用户轻触屏幕。（单击）
58. return true;
59. }
60. 
61. @Override
62. public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
63. //用户按下屏幕，快速移动后松开（就是在屏幕上滑动）
64. //e1:第一个ACTION_DOWN事件（手指按下的那一点）
65. //e2:最后一个ACTION_MOVE事件 （手指松开的那一点）
66. //velocityX:手指在x轴移动的速度 单位：像素/秒
67. //velocityY:手指在y轴移动的速度 单位：像素/秒
68. 
69. int x = (int) (e2.getX() - e1.getX());
70. if(x>0){
71. this,R.anim.in_left_right );
72. this,R.anim.out_left_right );
73. flipper.showPrevious();
74. else{
75. this,R.anim.in_right_left );
76. this,R.anim.out_right_left );
77. flipper.showNext();
78. }
79. return true;
80. }
81. @Override
82. public void onLongPress(MotionEvent e) {
83. // TODO Auto-generated method stub
84. //用户长按屏幕
85. 
86. }
87. @Override
88. public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
89. // TODO Auto-generated method stub
90. return false;//用户按下屏幕并拖动
91. 
92. }
93. @Override
94. public void onShowPress(MotionEvent e) {
95. // TODO Auto-generated method stub
96. //用户轻触屏幕，尚末松开或拖动，注意，强调的是没有没有松开或者拖动状态
97. }
98. @Override
99. public boolean onSingleTapUp(MotionEvent e) {
100. // TODO Auto-generated method stub
101. return false;//用户轻触屏幕后松开。
102. }
103. });
104. }