动态地改变背景颜色过渡动画 [英] Dynamically change background color with animated transition

查看:212
本文介绍了动态地改变背景颜色过渡动画的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想生成一个随机的颜色,并将其设置截至3秒速度的背景。我创建了一个线程将处理这种变化,现在我想补充的颜色变化之间的过渡,使其很好地融合在一起。

I'm trying to generate a random color and set it as the background at the rate of 3 seconds. I have created a thread that will handle this change, now I would like to add a transition between the color changes to make it blend well.

作为参考,看看这个程序

编辑:
我已经尝试过使用的 ObjectAnimator ArgbEvaluator 在3秒钟过渡期的循环,但屏幕一直闪烁在闪光灯般的方式,将只给你一个头痛的问题。除此之外,颜色改变得很好,一切都是完美的。可能有人运行这个,看看有什么可以去错了?

I've tried using an ObjectAnimator and ArgbEvaluator in a loop with a 3 second transition period, but the screen keeps flashing in a strobe-like way that will just give you a headache. Besides that, the colors change just fine and everything else is perfect. Could somebody run this and see what could be going wrong?

public class Main extends Activity {

public int color1, color2, red1, red2, blue1, blue2, green1, green2;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    setContentView(R.layout.main);


    new Thread() {
        public void run() {
            while(true) {
                try {
                    Thread.sleep(3000); // I've also tried 1000 and 4000, same issue.
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
                Main.this.runOnUiThread(new Runnable() {
                    public void run() {

                    //generate color 1
                        red1 = (int)(Math.random() * 128 + 127);
                        green1 = (int)(Math.random() * 128 + 127);
                        blue1 = (int)(Math.random() * 128 + 127);
                        color1 = 0xff << 24 | (red1 << 16) |
                                (green1 << 8) | blue1;


                    //generate color 2

                        red2 = (int)(Math.random() * 128 + 127);
                        green2 = (int)(Math.random() * 128 + 127);
                        blue2 = (int)(Math.random() * 128 + 127);
                        color2 = 0xff << 24 | (red2 << 16) |
                                (green2 << 8) | blue2;

                    //start animation
                        View v = findViewById(R.id.view);
                        ObjectAnimator anim = ObjectAnimator.ofInt(v, "backgroundColor", color1, color2);


                        anim.setEvaluator(new ArgbEvaluator());
                        anim.setRepeatCount(ValueAnimator.INFINITE);
                        anim.setRepeatMode(ValueAnimator.REVERSE);
                        anim.setDuration(3000);
                        anim.start();

                    }
                });
            }
        }
    }.start();
}

}

编辑:我已经收窄,并发现了.setRepeatMode是造成问题。我还没有修复。通过改变反转到别的(无限或其他提供的选项),这$ P $的发生pvents动画。任何想法,我能做些什么来解决这个问题?

I've narrowed it down and found the ".setRepeatMode" was causing the problem. I still don't have a fix. By changing the "Reverse" to something else (Infinite or other provided options) it prevents the animation from happening. Any idea what I can do to fix this?

此外,没有任何人知道一种更好的方式来生成色彩更鲜艳?一切我看着已经过时了。

ALSO, does anybody know a better way to generate more vibrant colors? Everything I looked into is outdated.

推荐答案

您正在尽一切正常,除了一件事:每3秒,你是随机产生的 2 的颜色。所以,这是发生了什么:

You are doing everything correctly except for one thing: Every 3 seconds, you are randomly generating 2 colors. So, this is what's happening:

第1次迭代

产生COLOR1

产生COLOR2

查看的背景设置为颜色1。然后在后台修改
  从颜色1至颜色2。

View's background is set to color1. And then the background changes from color1 to color2.

//所有的好

第二次迭代

有一个新的颜色1

有一个新的颜色2

查看的背景设置为新颜色1 即可。立即改变的原因
  闪光灯光效果。然后从后台出现新变化
  COLOR1新COLOR2。

View's background is set to new color1. Immediate change causes the strobe light effect. And then the background changes from new color1 to new color2.

您应该做些什么来解决这个问题:

What you should do to fix this:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    setContentView(R.layout.main);

    // Generate color1 before starting the thread
    red1 = (int)(Math.random() * 128 + 127);
    green1 = (int)(Math.random() * 128 + 127);
    blue1 = (int)(Math.random() * 128 + 127);
    color1 = 0xff << 24 | (red1 << 16) |
                          (green1 << 8) | blue1;


    new Thread() {
        public void run() {
            while(true) {
                try {
                    Thread.sleep(3000); 
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
                Main.this.runOnUiThread(new Runnable() {
                    public void run() {

                    //generate color 2

                        red2 = (int)(Math.random() * 128 + 127);
                        green2 = (int)(Math.random() * 128 + 127);
                        blue2 = (int)(Math.random() * 128 + 127);
                        color2 = 0xff << 24 | (red2 << 16) |
                                (green2 << 8) | blue2;

                    //start animation
                        View v = findViewById(R.id.view);
                        ObjectAnimator anim = ObjectAnimator.ofInt(v, "backgroundColor", color1, color2);


                        anim.setEvaluator(new ArgbEvaluator());
                        anim.setRepeatCount(ValueAnimator.INFINITE);
                        anim.setRepeatMode(ValueAnimator.REVERSE);
                        anim.setDuration(3000);
                        anim.start();

                        // Now set color1 to color2
                        // This way, the background will go from
                        // the previous color to the next color
                        // smoothly
                        color1 = color2;

                    }
                });
            }
        }
    }.start();
}

因此​​,从第二次迭代开始,起始颜色应该是相同的previous迭代结束颜色。初始化/生成COLOR1只有一次:在启动线程之前。后 anim.start(),地址:

color1 = color2;

另外请注意,您要创建一个新的 ObjectAnimator 每个的3秒:

ObjectAnimator anim = ObjectAnimator.ofInt(v, "backgroundColor", color1, color2);

所以,下面的语句没有任何效果:

So, the following statements have no effect:

anim.setRepeatCount(ValueAnimator.INFINITE);
anim.setRepeatMode(ValueAnimator.REVERSE); 

下面是我会建议:

public class Main extends Activity {

    public int color1, color2, red1, red2, blue1, blue2, green1, green2;

    View v;

    ObjectAnimator anim;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.main);

        // White or whatever color background R.id.view
        // has at the beginning
        color1 = 0xffffffff;

        v = findViewById(R.id.llMain);

        // We haven't initialized color2 yet. Will set this later
        anim = ObjectAnimator.ofInt(v, "backgroundColor", color1);

        anim.setEvaluator(new ArgbEvaluator());

        anim.setDuration(3000);


        new Thread() {
            public void run() {
                while(true) {
                    try {
                        Thread.sleep(3000);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                    Main.this.runOnUiThread(new Runnable() {
                        public void run() {

                            //generate color 2

                            red2 = (int)(Math.random() * 128 + 127);
                            green2 = (int)(Math.random() * 128 + 127);
                            blue2 = (int)(Math.random() * 128 + 127);
                            color2 = 0xff << 24 | (red2 << 16) |
                                    (green2 << 8) | blue2;

                            // Update the color values
                            anim.setIntValues(color1, color2);

                            anim.start();

                            // Order the colors
                            color1 = color2;

                        }
                    });
                }
            }
        }.start();
    }
}

这样,你创建一个ObjectAnimator对象一次,并更新颜色值每3秒。

This way, you're creating an ObjectAnimator object once, and updating the color values every 3 seconds.

这篇关于动态地改变背景颜色过渡动画的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆