android - 创建使图像相互淡入淡出并转换的幻灯片放映

Question

我正在尝试创建类似于 this 的图像幻灯片放映

我找到了 this tutorial它向我展示了如何使图像相互淡入淡出，效果非常好，但我找不到任何示例如何使其同时进行移动/缩放，因此我正在尝试对其进行调整。

我已经添加了一个缩放动画并将它与 alpha 动画一起放在一个动画集中，但是我无法让它正常工作，它只是在每个其他图像上做动画，然后当缩放开始时它缩放一个方式和切换，然后以另一种方式缩放。

我是 Android 的新手，之前没有做过任何动画，所以很难理解这个例子是如何工作的。因此我很难修改它。

谁能帮我弄清楚我做错了什么？我开始拔头发了!

我的java代码是:

  public class TopListActivity extends Activity {

    ImageView slide_0;
    ImageView slide_1;

    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.test2);

        slide_0 = (ImageView) findViewById(R.id.slide_1);
        slide_1 = (ImageView) findViewById(R.id.slide_2);

    }

    private static class AnimationTimer extends TimerTask implements
            AnimationListener {

        TopListActivity topList;
        Vector<BitmapDrawable> images;
        int count = 0;

        public AnimationTimer(TopListActivity _topList) {
            this.topList = _topList;

            this.images = new Vector<BitmapDrawable>();

            Resources resources = topList.getResources();
            images.add((BitmapDrawable) resources.getDrawable(R.drawable.one));
            images.add((BitmapDrawable) resources.getDrawable(R.drawable.two));
            images.add((BitmapDrawable) resources.getDrawable(R.drawable.three));
            images.add((BitmapDrawable) resources.getDrawable(R.drawable.four));
            images.add((BitmapDrawable) resources.getDrawable(R.drawable.five));
            images.add((BitmapDrawable) resources.getDrawable(R.drawable.six));

            if (this.images.size() > 0) {
                this.topList.slide_0.setBackgroundDrawable(this.images.get(0));

                if (this.images.size() > 1) {
                    this.topList.slide_1.setBackgroundDrawable(this.images
                            .get(1));
                }

            }

            this.count = 1;
        }

        public void launch() {
            if (this.images.size() >= 2) {
                (new Timer(false)).schedule(this, 100);
            }
        }

        @Override
        public void run() {
            this.doit();
            this.cancel();
        }

        private void doit() {
            if ((this.count % 2) == 0) {
                AnimationSet set = new AnimationSet(false);


                AlphaAnimation animation = new AlphaAnimation(1.0f, 0.0f);
                animation.setStartOffset(5000);
                animation.setDuration(3000);
                animation.setFillAfter(true);

                ScaleAnimation zoom = new ScaleAnimation(1, 1.20f, 1, 1.20f);
                zoom.setStartOffset(0);
                zoom.setDuration(8000);
                zoom.setFillAfter(true);

                set.addAnimation(animation);
                set.addAnimation(zoom);
                set.setAnimationListener(this);

                this.topList.slide_1.startAnimation(set);
            } else {

                AnimationSet set = new AnimationSet(false);

                AlphaAnimation animation = new AlphaAnimation(0.0f, 1.0f);
                animation.setStartOffset(5000);
                animation.setDuration(3000);
                animation.setFillAfter(true);

                ScaleAnimation zoom = new ScaleAnimation(1.20f, 1, 1.20f, 1);
                zoom.setStartOffset(0);
                zoom.setDuration(8000);
                zoom.setFillAfter(true);

                set.addAnimation(animation);
                set.addAnimation(zoom);
                set.setAnimationListener(this);

                this.topList.slide_1.startAnimation(set);
            }
        }

        public void onAnimationEnd(Animation animation) {
            if ((this.count % 2) == 0) {
                this.topList.slide_1.setBackgroundDrawable(this.images
                        .get((this.count + 1) % (this.images.size())));
            } else {
                this.topList.slide_0.setBackgroundDrawable(this.images
                        .get((this.count + 1) % (this.images.size())));
            }

            this.count++;
            this.doit();

        }

        public void onAnimationRepeat(Animation animation) {
        }

        public void onAnimationStart(Animation animation) {
        }
    }

    @Override
    public void onResume() {
        super.onResume();

        (new AnimationTimer(this)).launch();
    }
}

我的布局是:

    <FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/frame"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/slide_1"
        android:layout_gravity="center_vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <ImageView
        android:id="@+id/slide_2"
        android:layout_gravity="center_vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</FrameLayout>

Answer 1

终于对它进行了排序......它非常冗长，因为由于有多个动画，我无法掌握动画结束事件......所以可能不是最好的方法，但它有效，我很高兴!

对于任何想知道如何......或想对其进行调整以使其变得更好的人，请点击此处:

主要 Activity (MyTransition.java):

import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.LinearLayout;

import java.util.Vector;

public class MyTransition extends AppCompatActivity {

    ImageView slide_0;
    ImageView slide_1;
    ImageView lastSlide;
    Vector<Integer> imageIds;
    LinearLayout linLayout;
    int count = 0;

    private Handler transparencyHandler = new Handler();
    private Handler timerHandler = new Handler();
    private Runnable transparencyTimer = new Runnable() {
        public void run() {
            if (lastSlide == slide_0) {
                slide_1.setBackgroundColor(getResources().getColor(android.R.color.transparent));
                slide_1.setImageResource(0);
            } else {
                slide_0.setBackgroundColor(getResources().getColor(android.R.color.transparent));
                slide_0.setImageResource(0);
            }
        }
    };
    private Runnable timer = new Runnable() {
        public void run() {
            if (lastSlide == slide_0) {
                slide_1.setImageResource(0);
                slide_1.setImageResource(imageIds.get((count + 1)
                        % (imageIds.size())));
                slide_1.startAnimation(AnimationUtils
                        .loadAnimation(MyTransition.this,
                                R.anim.transition_down));
                lastSlide = slide_1;
            } else {
                slide_0.setImageResource(0);
                slide_0.setImageResource(imageIds.get((count + 1)
                        % (imageIds.size())));
                slide_0.startAnimation(AnimationUtils
                        .loadAnimation(MyTransition.this,
                                R.anim.transition_up));
                lastSlide = slide_0;
            }
            count++;
            transparencyHandler.postDelayed(transparencyTimer, 1000);
            timerHandler.postDelayed(timer, 8000);
        }
    };

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test2);
        slide_0 = (ImageView) findViewById(R.id.slide_1);
        slide_1 = (ImageView) findViewById(R.id.slide_2);
        imageIds = new Vector<Integer>();
        imageIds.add(R.drawable.first_image);
        imageIds.add(R.drawable.second_image);

        // Load Image 1
        slide_0.setImageResource(imageIds.get(0));
        slide_0.startAnimation(AnimationUtils.loadAnimation(this,
                R.anim.transition_down));

        lastSlide = slide_0;
        timerHandler.postDelayed(timer, 8000);
    }
}

布局(test2.xml):

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/frame"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/slide_1"
        android:layout_gravity="center_vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="centerCrop" />
    <ImageView
        android:id="@+id/slide_2"
        android:layout_gravity="center_vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="centerCrop" />
</FrameLayout>

动画(transition_down.xml):

<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<alpha
    android:fromAlpha="0.0"
    android:toAlpha="2.0"
    android:duration="2000"
    android:repeatCount="0"
    android:fillAfter="true" />
    <scale
        android:fromXScale="1"
        android:toXScale="1.2"
        android:fromYScale="1"
        android:toYScale="1.2"
        android:duration="10000"
        android:repeatCount="0"
        android:fillAfter="true" />
    <alpha
        android:fromAlpha="2.0"
        android:toAlpha="0.0"
        android:duration="2000"
        android:repeatCount="0"
        android:startOffset="8000"
        android:fillAfter="true" />
</set>