如何为Drawable启用淡入Alpha动画？适配ImageSpan与SpannableString

核心结论 #

可以实现Alpha动画和颜色更新，但直接给原始Drawable加动画/改颜色无效——因为ImageSpan会持有Drawable的独立副本，需要通过自定义ImageSpan来主动控制绘制逻辑。

为什么直接操作无效 #

当你把Drawable传入ImageSpan时，ImageSpan内部会生成该Drawable的独立可修改副本（通过mutate()），你对原始Drawable的动画、颜色修改不会同步到Span中的实例上，自然看不到效果。

实现Alpha动画的方法 #

自定义AnimatedImageSpan，在内部管理动画逻辑，并重写draw()方法确保绘制时应用最新的alpha值，同时触发TextView重绘：

public class AnimatedImageSpan extends ImageSpan {
    private ValueAnimator alphaAnimator;
    private int currentAlpha = 255;
    private TextView textView; // 持有TextView引用触发重绘

    public AnimatedImageSpan(Drawable drawable, TextView textView) {
        super(drawable.mutate()); // 生成独立可修改的Drawable副本
        this.textView = textView;
    }

    // 启动Alpha渐变动画
    public void startAlphaAnim(int startAlpha, int endAlpha, long duration) {
        if (alphaAnimator != null && alphaAnimator.isRunning()) {
            alphaAnimator.cancel();
        }
        alphaAnimator = ValueAnimator.ofInt(startAlpha, endAlpha);
        alphaAnimator.setDuration(duration);
        alphaAnimator.addUpdateListener(anim -> {
            currentAlpha = (int) anim.getAnimatedValue();
            getDrawable().setAlpha(currentAlpha);
            textView.postInvalidate();
        });
        alphaAnimator.start();
    }

    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
        Drawable drawable = getDrawable();
        if (drawable != null) {
            drawable.setAlpha(currentAlpha);
            super.draw(canvas, text, start, end, x, top, y, bottom, paint);
        }
    }
}

使用示例 #

// 初始化Drawable并设置显示边界
Drawable icon = getResources().getDrawable(R.drawable.your_icon, getTheme());
icon.setBounds(0, 0, icon.getIntrinsicWidth(), icon.getIntrinsicHeight());

// 创建自定义动画Span
AnimatedImageSpan animatedSpan = new AnimatedImageSpan(icon, yourTextView);

// 构建SpannableString并绑定Span
SpannableString spannable = new SpannableString("测试文本");
spannable.setSpan(animatedSpan, 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
yourTextView.setText(spannable);

// 启动从透明到不透明的动画
animatedSpan.startAlphaAnim(0, 255, 1000);

实现颜色更新的方法 #

同理，自定义TintableImageSpan，通过颜色滤镜修改Drawable颜色，并触发重绘：

public class TintableImageSpan extends ImageSpan {
    private int tintColor;
    private TextView textView;

    public TintableImageSpan(Drawable drawable, TextView textView) {
        super(drawable.mutate());
        this.textView = textView;
    }

    public void updateTintColor(int color) {
        tintColor = color;
        getDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);
        textView.postInvalidate();
    }

    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
        Drawable drawable = getDrawable();
        if (drawable != null) {
            drawable.setColorFilter(tintColor, PorterDuff.Mode.SRC_IN);
            super.draw(canvas, text, start, end, x, top, y, bottom, paint);
        }
    }
}

使用示例 #

TintableImageSpan tintSpan = new TintableImageSpan(icon, yourTextView);
// ...将Span绑定到SpannableString后...
tintSpan.updateTintColor(getResources().getColor(R.color.new_color, getTheme()));

注意事项 #

• 必须调用textView.postInvalidate()触发重绘，否则动画/颜色变化不会及时显示
• 使用drawable.mutate()确保Drawable实例独立，避免影响其他地方使用的同一张Drawable

内容的提问来源于stack exchange，提问作者owen33519