Android怎么實現顏色漸變動畫效果

本篇內容主要講解“Android怎么實現顏色漸變動畫效果”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“Android怎么實現顏色漸變動畫效果”吧!

效果圖：

一、Android中插值器TypeEvaluator

TypeEvaluator是一個接口，在開發中可以自定義該接口實例，利用ValueAnimator的setEvaluator(TypeEvaluator)方法來控制動畫的更新計算表達式。在日常開發中，不可能只是需要操縱單一數值的變化，如果需要同時操縱對象的多個屬性，如定義動畫的x，y移動的坐標等，那就需要對TypeEvaluator有所了解了。

二、案例效果實現

1.利用Android自帶的顏色插值器ArgbEvaluator

ValueAnimator colorAnim = ObjectAnimator.ofInt(this, "backgroundColor", RED, BLUE);
        colorAnim.setDuration(4000);
        colorAnim.setEvaluator(new ArgbEvaluator());
        colorAnim.setRepeatCount(ValueAnimator.INFINITE);
        colorAnim.setRepeatMode(ValueAnimator.REVERSE);
        colorAnim.start();

2.看看Android自帶顏色插值器ArgbEvaluator核心代碼

@Override
    public Object evaluate(float fraction, Object startValue, Object endValue) {
        int startInt = (Integer) startValue;
        float startA = ((startInt >> 24) & 0xff) / 255.0f;
        float startR = ((startInt >> 16) & 0xff) / 255.0f;
        float startG = ((startInt >>  8) & 0xff) / 255.0f;
        float startB = ( startInt        & 0xff) / 255.0f;

        int endInt = (Integer) endValue;
        float endA = ((endInt >> 24) & 0xff) / 255.0f;
        float endR = ((endInt >> 16) & 0xff) / 255.0f;
        float endG = ((endInt >>  8) & 0xff) / 255.0f;
        float endB = ( endInt        & 0xff) / 255.0f;

        // 將sRGB轉化成線性
        startR = (float) Math.pow(startR, 2.2);
        startG = (float) Math.pow(startG, 2.2);
        startB = (float) Math.pow(startB, 2.2);

        endR = (float) Math.pow(endR, 2.2);
        endG = (float) Math.pow(endG, 2.2);
        endB = (float) Math.pow(endB, 2.2);

        //在線性空間中計算插值的顏色
        float a = startA + fraction * (endA - startA);
        float r = startR + fraction * (endR - startR);
        float g = startG + fraction * (endG - startG);
        float b = startB + fraction * (endB - startB);

        //轉換回sRGB在[0..255]范圍
        a = a * 255.0f;
        r = (float) Math.pow(r, 1.0 / 2.2) * 255.0f;
        g = (float) Math.pow(g, 1.0 / 2.2) * 255.0f;
        b = (float) Math.pow(b, 1.0 / 2.2) * 255.0f;

        return Math.round(a) << 24 | Math.round(r) << 16 | Math.round(g) << 8 | Math.round(b);
    }

3.根據ArgbEvaluator的實現來自定義一個顏色插值器

public class MyColorEvaluator implements TypeEvaluator

接下來換一種顏色的計算方式，在本人看相關api的過程中，發現Color中有colorToHSV和HSVToColor的方法，于是在網上找了一個HVS的計算方式。（以下代碼來源于網絡）。

@Override
    public Integer evaluate(float fraction, Integer startValue, Integer endValue) {
        Color.colorToHSV(startValue,startHsv);
        Color.colorToHSV(endValue,endHsv);
        int alpha = startValue >> 24 + (int) ((endValue >> 24 - startValue >> 24) * fraction);
        // 計算當前動畫完成度（fraction）所對應的顏色值
        if (endHsv[0] - startHsv[0] > 180) {
            endHsv[0] -= 360;
        } else if (endHsv[0] - startHsv[0] < -180) {
            endHsv[0] += 360;
        }
        outHsv[0] = startHsv[0] + (endHsv[0] - startHsv[0]) * fraction;
        if (outHsv[0] > 360) {
            outHsv[0] -= 360;
        } else if (outHsv[0] < 0) {
            outHsv[0] += 360;
        }
        outHsv[1]=startHsv[1]+(endHsv[1]-startHsv[1])*fraction;
        outHsv[2]=startHsv[2]+(endHsv[2]-startHsv[2])*fraction;


        return Color.HSVToColor(alpha,outHsv);

    }

4.使用自己定義的顏色插值器MyColorEvaluator

ValueAnimator colorAnim = ObjectAnimator.ofInt(this, "backgroundColor", RED, BLUE);
        colorAnim.setDuration(4000);
        colorAnim.setEvaluator(new MyColorEvaluator());
        colorAnim.setRepeatCount(ValueAnimator.INFINITE);
        colorAnim.setRepeatMode(ValueAnimator.REVERSE);
        colorAnim.start();

三、源碼

ColorGradient.java:

public class ColorGradient extends View {

    public ColorGradient(Context context) {
        super(context);
    }

    public ColorGradient(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        animation();
    }

    public ColorGradient(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
    private void animation(){
        ValueAnimator colorAnim = ObjectAnimator.ofInt(this, "backgroundColor", RED, BLUE);
        colorAnim.setDuration(4000);
        colorAnim.setEvaluator(new MyColorEvaluator());
        colorAnim.setRepeatCount(ValueAnimator.INFINITE);
        colorAnim.setRepeatMode(ValueAnimator.REVERSE);
        colorAnim.start();
    }

    
}

MyColorEvaluator.java:

public class MyColorEvaluator implements TypeEvaluator<Integer> {
    float[] startHsv=new float[3];
    float[] endHsv=new float[3];
    float[] outHsv=new float[3];

    @Override
    public Integer evaluate(float fraction, Integer startValue, Integer endValue) {
        Color.colorToHSV(startValue,startHsv);
        Color.colorToHSV(endValue,endHsv);
        int alpha = startValue >> 24 + (int) ((endValue >> 24 - startValue >> 24) * fraction);
        // 計算當前動畫完成度（fraction）所對應的顏色值
        if (endHsv[0] - startHsv[0] > 180) {
            endHsv[0] -= 360;
        } else if (endHsv[0] - startHsv[0] < -180) {
            endHsv[0] += 360;
        }
        outHsv[0] = startHsv[0] + (endHsv[0] - startHsv[0]) * fraction;
        if (outHsv[0] > 360) {
            outHsv[0] -= 360;
        } else if (outHsv[0] < 0) {
            outHsv[0] += 360;
        }
        outHsv[1]=startHsv[1]+(endHsv[1]-startHsv[1])*fraction;
        outHsv[2]=startHsv[2]+(endHsv[2]-startHsv[2])*fraction;


        return Color.HSVToColor(alpha,outHsv);

    }
}

到此，相信大家對“Android怎么實現顏色漸變動畫效果”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！