如何在Android中为画布上绘制的文本的不同部分着色?

如何在Android中为画布上绘制的文本的不同部分着色?,android,string,colors,android-canvas,Android,String,Colors,Android Canvas,我正在尝试重新创建以下动画: 可以在此处访问动画GIF: 在此动画中,随着波浪的上升和下降,文本的颜色会发生变化:波浪上方的文本部分为深蓝色,波浪下方的文本部分为浅蓝色。有没有办法在Android中实现这一点 我已经实现了动画的其余部分,如上图所示: 下面是我在画布上绘制的代码: public void createShader(){ mDefaultAngularFrequency = 2.0f * Math.PI / DEFAULT_WAVE_LENGTH_RATIO / ge

我正在尝试重新创建以下动画:

可以在此处访问动画GIF:

在此动画中,随着波浪的上升和下降,文本的颜色会发生变化:波浪上方的文本部分为深蓝色,波浪下方的文本部分为浅蓝色。有没有办法在Android中实现这一点

我已经实现了动画的其余部分,如上图所示:

下面是我在画布上绘制的代码:

public void createShader(){

    mDefaultAngularFrequency = 2.0f * Math.PI / DEFAULT_WAVE_LENGTH_RATIO / getWidth();
    mDefaultAmplitude = (getHeight()) * DEFAULT_AMPLITUDE_RATIO;
    mDefaultWaterLevel = (getHeight())  * DEFAULT_WATER_LEVEL_RATIO;
    mDefaultWaveLength = getWidth();

    Bitmap bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(bitmap);

    final int endX = getWidth() + 1;
    final int endY = getHeight() + 1;

    float[] waveY = new float[endX];

    for (int beginX = 0; beginX < endX; beginX++) {
        double wx = beginX * mDefaultAngularFrequency;
        float beginY = (float) (mDefaultWaterLevel + mDefaultAmplitude * Math.sin(wx));
        canvas.drawLine(beginX, beginY, beginX, endY, mWavePaint);

        waveY[beginX] = beginY;
    }

    mWaveShader = new BitmapShader(bitmap, Shader.TileMode.REPEAT, Shader.TileMode.CLAMP);
    mWavePaint.setShader(mWaveShader);

}

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    // Draw the outer circle
    canvas.drawCircle(getWidth()/2, getHeight()/2, getWidth()/2 - 15, mCirclePaint);

    if (mWavePaint.getShader() == null) {
        createShader();
        mWavePaint.setShader(mWaveShader);
    }

    // scale shader according to mWaveLengthRatio and mAmplitudeRatio
    // this decides the size(mWaveLengthRatio for width, mAmplitudeRatio for height) of waves
    mShaderMatrix.setScale(mWaveLengthRatio / DEFAULT_WAVE_LENGTH_RATIO, mAmplitudeRatio / DEFAULT_AMPLITUDE_RATIO,
            0, mDefaultWaterLevel);
    // translate shader according to mWaveShiftRatio and mWaterLevelRatio
    // this decides the start position(mWaveShiftRatio for x, mWaterLevelRatio for y) of waves

    mShaderMatrix.postTranslate(mWaveShiftRatio * getWidth(),
            (DEFAULT_WATER_LEVEL_RATIO - mWaterLevelRatio) * getHeight());

    // assign matrix to invalidate the shader
    mWaveShader.setLocalMatrix(mShaderMatrix);

    //draw the inner circle
    float innerCircleRadius = getWidth()/2 - 30;
    canvas.drawCircle(getWidth() / 2f, getHeight() / 2f, innerCircleRadius, mWavePaint);

    //draw the text inside the circles
    canvas.drawText(String.format("%.0f", mPercentageValue) + "%", getWidth() / 2 - 10,
            (getHeight() - mTextPaint.ascent()) / 2, mTextPaint);

}

调用
drawText
两次,使用不同的重印颜色,第二次使用波浪剪裁,非常感谢@pskink。你可以告诉我如何进行剪辑吗?或者你可以简单地使用两个具有两种不同颜色的着色器。我看不出有任何区别:顺便说一句,可以使用一个着色器进行剪辑,请参见,运行后单击视图以查看其实际效果
ObjectAnimator waveShiftAnim = ObjectAnimator.ofFloat(l, "waveShiftRatio", 0f, 0.5f);
    waveShiftAnim.setRepeatCount(ValueAnimator.INFINITE);
    waveShiftAnim.setDuration(mWaveAnimDuration);
    waveShiftAnim.setInterpolator(new LinearInterpolator());
    animators.add(waveShiftAnim);