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 }