Android攻城狮ViewFlipper

使用ViewFlipper实现屏幕切换动画效果。
ViewFlipper和ViewPager一样,都是Android自带的一个多页面管理控件,不同的是ViewPager是手动切换页面,而ViewFlipper可以实现子界面的自动切换。只需设置切换时间和切换的动画效果,ViewFlipper里面的视图就会自动循环播放。
------------------------
为ViewFlipper添加View
(1)静态导入:在layout布局文件中直接导入,不需要写额外的Java代码,缺点:直接写死,非常不灵活,所以不推荐使用。
(2)动态导入:addView()方法:
flipper=(ViewFlipper)findViewById(R.i.flipper);
flipper.addView(getImageView(R.drawable.pic1));
flipper.addView(getImageView(R.drawable.pic2));
---------------------------------
ViewFlipper常用的方法:
   1)、SetInAnimation:设置View进入屏幕时候使用的动画
   2)、setOutAnimation:设置View退出屏幕时候使用的动画
   3)、showNext:调用该函数来显示ViewFlipper里面的下一个View
   4)、showPrevious:调用该函数来显示ViewFlipper里面的上一个View
   5)、setFilpInterval:设置View之间切换的时间间隔
   6)、startFlipping:使用上面设置的时间间隔来开始切换所有的View,切换会循环进行
   7)、stopFlipping:停止View切换

实现动画效果的步骤
1. 创建文件夹anim,放置实现动画效果的xml文件。在drawable中放置图片资源。
2. 在 main.xml中放置<ViewFlipper>
3. 在MainActivity中创建 int数组,放置图片id。
4. 初始化ViewFlipper,动态导入子View:
 for (int i=0;i<resId.length;i++){
            flipper.addView(getImageView(resId[i]));
        }
这里自定义了方法
private ImageView getImageView(int resId){
        ImageView image = new ImageView(this);
        //image.setImageResource(resId);//不采取此方法的原因:ImageView的宽高完全取决于图片的宽高,不符合“全屏展示”的要求
        image.setBackgroundResource(resId);//background可以铺满整个屏幕
        return image;
    }
5. 设置动画效果
//设置切换的动画效果
        flipper.setInAnimation(this,R.anim.left_in);//Animation:动画。这里说是页面进入的动画(InAnimation)采用从左进入。
        flipper.setOutAnimation(this,R.anim.left_out);
        flipper.setFlipInterval(3000);//切换的时间间隔,单位毫秒
        flipper.startFlipping();//开启动画
 1 //手机滑动-实现自动播放
 2 public class MainActivity extends Activity {
 3     private ViewFlipper flipper;
 4     //资源图片
 5     private int[] resId = { R.drawable.a, R.drawable.b, R.drawable.c,
 6             R.drawable.d };
 7     private float startX;//手势滑动时,手指落下的起始坐标
 8 
 9     @Override
10     protected void onCreate(Bundle savedInstanceState) {
11         super.onCreate(savedInstanceState);
12         setContentView(R.layout.main);
13         flipper = (ViewFlipper) findViewById(R.id.fliper);
14         // 动态导入的方式为ViewFlipper加载子view
15         for (int i = 0; i < resId.length; i++) {
16             flipper.addView(getImageView(resId[i]));
17         }
18         
19         
20         // 方式一:为ViewFlippe添加动画效果实现自动切换图片
21         
22         // flipper.setInAnimation(this, R.anim.abc_slide_in_bottom);
23         // flipper.setOutAnimation(this, R.anim.abc_slide_out_bottom);
24         //
25         // flipper.setFlipInterval(3000);// 3秒切换 为ViewFlippe视图切换的时间间隔
26         // flipper.startFlipping();// 开始播放
27 
28     }
29     
30        //方式二:支持手势滑动的ViewFlipper 
31     //监控手势滑动事件的处理
32     @Override
33     public boolean onTouchEvent(MotionEvent event) {
34         // TODO Auto-generated method stub
35         switch (event.getAction()) {
36         // 手指落下
37         case MotionEvent.ACTION_DOWN: {
38             startX = event.getX();//获得横向的起始坐标
39             break;
40         }
41 
42         // 手指滑动
43         case MotionEvent.ACTION_MOVE: {
44             // 设置差值大于100,是为了过滤掉微小的滑动
45             if (event.getX() - startX > 50) {
46                 // 向右滑动 看前一页
47                 flipper.setInAnimation(this, R.drawable.left_in);
48                 flipper.setOutAnimation(this, R.drawable.left_out);
49 
50                 flipper.showPrevious();//显示前一页
51 
52             }
53             if (startX - event.getX() > 50) {
54                 // 向左滑动 看后一页
55                 flipper.setInAnimation(this, R.drawable.right_in);
56                 flipper.setOutAnimation(this, R.drawable.right_out);
57 
58                 flipper.showNext();// 显示后一页
59             }
60             break;
61         }
62         // 手指离开
63         case MotionEvent.ACTION_UP: {
64 
65             break;
66         }
67 
68         }
69         return super.onTouchEvent(event);
70     }
71 
72     public ImageView getImageView(int resId) {
73 
74         ImageView image = new ImageView(this);
75         // image.setImageResource(resId); 图片原来的宽高
76         image.setBackgroundResource(resId);// 铺满全屏的
77         return image;
78 
79     }
80 
81 }

 



原文地址:https://www.cnblogs.com/my334420/p/6714753.html