Android中子字符串动画实现：如何为文本中的数字添加缩放动效？

当然可以！在Android里给TextView的子字符串添加动画完全没问题，核心思路是借助SpannableString和自定义Span类定位到目标文本，再结合属性动画实现缩放效果。下面给你一步步拆解实现方法和代码示例：

1. 自定义缩放Span类 #

我们需要一个继承自ReplacementSpan的自定义Span，它负责处理文本的缩放绘制逻辑，确保只有目标子串被动画影响：

class ScalingSpan(private var scaleFactor: Float = 1f) : ReplacementSpan() {
    override fun getSize(
        paint: Paint,
        text: CharSequence?,
        start: Int,
        end: Int,
        fm: Paint.FontMetricsInt?
    ): Int {
        val textWidth = paint.measureText(text, start, end)
        return (textWidth * scaleFactor).toInt()
    }

    override fun draw(
        canvas: Canvas,
        text: CharSequence?,
        start: Int,
        end: Int,
        x: Float,
        top: Int,
        y: Int,
        bottom: Int,
        paint: Paint
    ) {
        // 保存画布状态，避免影响其他文本的绘制
        canvas.save()
        // 计算缩放中心点，让动画围绕文本中心展开，视觉更自然
        val textWidth = paint.measureText(text, start, end)
        val centerX = x + textWidth / 2
        val centerY = y - (paint.descent() + paint.ascent()) / 2
        // 应用缩放变换
        canvas.scale(scaleFactor, scaleFactor, centerX, centerY)
        // 绘制目标子串
        canvas.drawText(text!!, start, end, x, y.toFloat(), paint)
        // 恢复画布原始状态
        canvas.restore()
    }

    // 提供外部更新缩放比例的方法，供动画调用
    fun updateScaleFactor(newScale: Float) {
        scaleFactor = newScale
    }
}

2. 在TextView中应用Span并启动动画 #

接下来在你的Activity或Fragment中，定位到目标子串，绑定Span并启动缩放动画：

// 获取TextView实例
val textView = findViewById<TextView>(R.id.your_text_view)
val originalText = "I have 3 Apples."
val spannableText = SpannableString(originalText)

// 找到数字"3"在字符串中的起始和结束索引
val startIdx = originalText.indexOf("3")
val endIdx = startIdx + 1

// 创建自定义Span并应用到目标文本范围
val scalingSpan = ScalingSpan()
spannableText.setSpan(
    scalingSpan,
    startIdx,
    endIdx,
    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
textView.text = spannableText

// 创建缩放动画：从原始大小放大到1.5倍，再缩回到原始大小，循环播放
val scaleAnimator = ObjectAnimator.ofFloat(scalingSpan, "scaleFactor", 1f, 1.5f, 1f)
scaleAnimator.apply {
    duration = 1200 // 动画时长1.2秒
    repeatCount = ValueAnimator.INFINITE // 无限重复动画
    interpolator = AccelerateDecelerateInterpolator() // 加速减速插值器，让动画过渡更顺滑
    // 动画更新时通知TextView重绘，刷新Span的显示状态
    addUpdateListener { textView.invalidate() }
}

// 启动动画
scaleAnimator.start()

额外说明 #

• 这个方案的优势是完全在单个TextView内实现，不需要拆分多个View，能保持文本排版的连贯性。
• 如果需要其他动画效果（比如颜色渐变、透明度变化），可以在自定义Span的draw方法中修改Paint的属性，配合对应的属性动画即可。
• 如果你的文本是动态变化的，记得重新计算目标子串的索引并更新Span的范围。

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