从零开始水安卓——高级UI组件4（ViewFlipper）

目录

 

ViewFlipper

概述

补充

实现

activity_main.xml

MainActivity

---

ViewFlipper

概述

感觉应该接在上一篇上，又成功多水了一篇文章

ImageSwitcher和TextSwitcher可以简单理解为切换图片和文字

而这个ViewFlipper实现的效果有点类似，它是切换整个视图（屏幕切换）

继承自ViewAnimator

补充

在ImageSwitcher和TextSwitcher对动画效果也有一定的提及如：

setInAnimation

setOutAnimation

再介绍两个相关方法

showNext() 显示FrameLayout里的下一个View

showPrevious 显示FrameLayou里的上一个View

实现

activity_main.xml

首先还是布局的配置，和前面两个的不太一样，在布局中需要把各个视图先定义好。

即在ViewFlipper中写若干个布局...每一个布局都相当于一个界面...

测试的话就简单的用图片来测试了...自备图片资源文件(加什么都可以）

 

MainActivity

首先还是绑定组件，既然要滑动离不开OnTouch，实际上Activity也有OnTouchEvent事件，所以这里选择了重写Activity的OnTouchEvent方法。

然后float startX,endX 不能少

onTouch和之前类似，需要注意的是，这里自定义了四个动画（xml文件，定义好存放于res/目录下，建个anim文件夹）

in_leftright.xml（从左到右进，含义下面类似，不赘述）

in_rightleft.xml

out_rightleft.xml

out_leftright.xml

代码比较短，根据英文含义大概也能看出意思，不是本文的重点，就跳过这四个代码的分析了。

然后通过

setOutAnimation和setInAnimation

使用我们写好的动画...

然后viewFlipper.showNext()

然后是上一页的话....把动画取反，showNext?showPrevious

代码如下:

package com.example.viewflipper;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.widget.ViewFlipper;

public class MainActivity extends AppCompatActivity {
    private ViewFlipper viewFlipper;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewFlipper = findViewById(R.id.viewFlipper);
    }
    float startX,endX;
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        int action = event.getAction();
        if(action==MotionEvent.ACTION_DOWN){
            startX = event.getX();
        }else if(action==MotionEvent.ACTION_UP) {
            if(startX>endX){
                viewFlipper.setInAnimation(this,R.anim.in_rightleft);
                viewFlipper.setOutAnimation(this,R.anim.out_rightleft);
                viewFlipper.showNext();
            }else if(endX>startX){
                viewFlipper.setInAnimation(this,R.anim.in_leftright);
                viewFlipper.setOutAnimation(this,R.anim.out_leftright);
                viewFlipper.showPrevious();
            }
        }
        return super.onTouchEvent(event);
    }
}

效果的话..依旧不太好测试..HaHa 勉强放一张切换过程中的图吧