Android控件篇ViewFlipper的运用

最新推荐文章于 2017-11-08 09:58:27 发布

Fate_I_C

最新推荐文章于 2017-11-08 09:58:27 发布

阅读量925

点赞数

CC 4.0 BY-SA版权

分类专栏：理解Android知识

本文链接：https://blog.youkuaiyun.com/kagoy/article/details/12966943

理解Android知识专栏收录该内容

27 篇文章

订阅专栏

本文介绍如何在Android中使用ViewFlipper实现两张图片的左右滑动切换效果，并提供了具体的代码实现和动画效果的定制方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实现左右滑动效果，可以自动播放viewFlipper.setAutoStart(true)。

ViewFlipper

extends ViewAnimator
java.lang.Object
   ↳   android.view.View
        ↳   android.view.ViewGroup
           ↳   android.widget.FrameLayout
              ↳   android.widget.ViewAnimator

↳ android.widget.ViewFlipper

对于ViewAnimator的子类有，ViewFlipper, ViewSwitcher，而 ViewSwitcher的子类又有ImageSwitcher, TextSwitcher。下面主要对ViewFlipper的一个运用，是一个对两张图片进行滑动替换的效果。

Java代码如下：

import android.os.Bundle;
import android.util.Log;
import android.view.MotionEvent;
import android.view.Window;
import android.view.WindowManager;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.ViewAnimator;
import android.widget.ViewFlipper;
import android.app.Activity;

public class MainActivity extends Activity {

    public static final String TAG = "ViewFlipper Debug";

    private ViewFlipper viewFlipper = null;
    private float oldTouchValue;

    private int[] imgs = { R.drawable.tt, R.drawable.ff };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // 全屏幕画面
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        requestWindowFeature(Window.FEATURE_NO_TITLE);

        setContentView(R.layout.activity_main);

        viewFlipper = (ViewFlipper) findViewById(R.id.view_img);
    }

    // 事件
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            oldTouchValue = event.getX();
            break;
        case MotionEvent.ACTION_UP:
            float currentX = event.getX();
            // 向右
            if (oldTouchValue < currentX) {
                Log.d("huang", "oldTouchValue:" + oldTouchValue + " currentX:"
                        + currentX);

                // 下面代码注释掉后，如果只是一直向右滑动的话，替换图片是在一瞬间完成的，但是当只要向左滑动了一次（按下面的方式），无论是向左还是向右滑动图片都是从又到左的替换。
                // 不只是不是其中的一个bug
                // Set In 的动画
                // viewFlipper.setInAnimation(AnimationHelper
                // .inFromLeftAnimation());
                //
                // // Set Out
                // viewFlipper.setOutAnimation(AnimationHelper
                // .outToRightAnimation());
                viewFlipper.showNext();
            }
            // 向左
            if (oldTouchValue > currentX) {
                Log.d("huang", "oldTouchValue:" + oldTouchValue + " currentX:"
                        + currentX);

                // Set In 的动画
                // setAnimation使用这个方法，会出现一个空白，从而显得很丑，特别把时间设置长一点时。
                // viewFlipper
                // .setAnimation(AnimationHelper.inFromRightAnimation());
                // viewFlipper.setAnimation(AnimationHelper.outToLeftAnimation());
                // 不会出现空白，图片在移动的过程中，在图片的左边或者右边紧贴着另外一张图片
                // ViewFlipper extends ViewAnimator,ViewAnimator extends
                // FrameLayout
                viewFlipper.setInAnimation(AnimationHelper
                        .inFromRightAnimation());

                // Set Out
                viewFlipper.setOutAnimation(AnimationHelper
                        .outToLeftAnimation());
                viewFlipper.showPrevious();

            }
            break;
        default:
            break;
        }
        return true;
    }
}

动画效果Java代码：

import android.view.animation.AccelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;

public class AnimationHelper {

    public static Animation inFromRightAnimation() {
        Animation inFromRight = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT, +1.0f,//前面四个参数是x轴
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f,//后面四个参数是y轴
                Animation.RELATIVE_TO_PARENT, 0.0f);
        inFromRight.setDuration(3500);
        inFromRight.setInterpolator(new AccelerateInterpolator());

        return inFromRight;
    }

    public static Animation outToLeftAnimation() {
        Animation outToLeft = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, -1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f);
        outToLeft.setDuration(3500);
        outToLeft.setInterpolator(new AccelerateInterpolator());

        return outToLeft;
    }

    public static Animation inFromLeftAnimation() {
        Animation inFromLeft = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT, -1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f);
        inFromLeft.setDuration(3500);
        inFromLeft.setInterpolator(new AccelerateInterpolator());

        return inFromLeft;
    }

    public static Animation outToRightAnimation() {
        Animation outToRight = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, +1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f);
        outToRight.setDuration(3500);
        outToRight.setInterpolator(new AccelerateInterpolator());

        return outToRight;
    }
}