自定义SeekBar进度动画问题：滑块可动但进度条无动画

看起来你遇到的核心问题是：自定义SeekBar的进度条绘制逻辑和系统setProgress完全脱节，而且缺少动画过渡逻辑——滑块的动画是系统自带的，但你自定义的分段进度条完全基于初始百分比列表直接绘制，既不跟随进度变化，也没有动画效果。下面一步步帮你解决：

问题根源分析 #

你的自定义SeekBar的onDraw方法里，直接遍历mProgressItemsList按固定百分比绘制整个进度条，完全没考虑当前getProgress()的数值。这就导致：

• 滑块移动时，进度条不会跟着变化，始终显示初始分段比例
• 滑块位置（基于setProgress）和进度条显示内容完全脱节

解决方案步骤 #

1. 修改自定义SeekBar，让进度条跟随当前Progress #

在自定义SeekBar类里，修改onDraw方法，使其基于当前进度值绘制对应的分段内容：

@Override
protected void onDraw(Canvas canvas) {
    if (mProgressItemsList.size() > 0) {
        int progressBarWidth = getWidth();
        int progressBarHeight = getHeight();
        int thumbOffset = getThumbOffset();
        int lastProgressX = 0;
        // 计算当前进度对应的像素位置
        int currentProgressPixel = (int) ((getProgress() / (float) getMax()) * progressBarWidth);

        for (int i = 0; i < mProgressItemsList.size(); i++) {
            ProgressItem progressItem = mProgressItemsList.get(i);
            Paint progressPaint = new Paint();
            progressPaint.setColor(getResources().getColor(progressItem.color));
            
            // 计算当前分段的总宽度（按百分比）
            int progressItemTotalWidth = (int) (progressItem.progressItemPercentage * progressBarWidth / 100);
            // 实际绘制的宽度：不能超过当前进度的像素位置
            int progressItemDrawWidth = Math.min(progressItemTotalWidth, currentProgressPixel - lastProgressX);
            
            if (progressItemDrawWidth <= 0) {
                break; // 已经绘制到当前进度位置，后续分段无需绘制
            }

            int progressItemRight = lastProgressX + progressItemDrawWidth;
            Rect progressRect = new Rect(
                lastProgressX, 
                thumbOffset / 2,
                progressItemRight, 
                progressBarHeight - thumbOffset / 2
            );
            canvas.drawRect(progressRect, progressPaint);
            lastProgressX = progressItemRight;
        }
    }
    super.onDraw(canvas);
}

2. 用ValueAnimator实现进度平滑动画 #

不要直接调用seekbarElectra.setProgress((int) thumbPositionElectra);，改用ValueAnimator实现过渡动画，让进度条跟着滑块同步动起来：

// 替换原来的直接setProgress代码
ValueAnimator progressAnimator = ValueAnimator.ofInt(seekbarElectra.getProgress(), (int) thumbPositionElectra);
progressAnimator.setDuration(300); // 动画时长，可根据需求调整
progressAnimator.addUpdateListener(animation -> {
    int animatedValue = (int) animation.getAnimatedValue();
    seekbarElectra.setProgress(animatedValue);
    // 每次更新进度后触发重绘
    seekbarElectra.invalidate();
});
progressAnimator.start();

3. 确保分段数据与Max值匹配 #

初始化分段数据时，要保证所有分段百分比之和为100%，避免绘制偏差：

// 先检查百分比总和，避免计算误差
float totalPercentage = (greenSpanElectra / totalSpanElectra) * 100 + (darkGreySpanElectra / totalSpanElectra) * 100;
if (Math.abs(totalPercentage - 100) > 0.01) {
    // 调整最后一个分段的数值，确保总和等于总跨度
    darkGreySpanElectra = totalSpanElectra - greenSpanElectra;
}

// 创建分段列表
progressItemListElectra = new ArrayList<>();
ProgressItem greenItem = new ProgressItem();
greenItem.progressItemPercentage = (greenSpanElectra / totalSpanElectra) * 100;
greenItem.color = R.color.green;
progressItemListElectra.add(greenItem);

ProgressItem greyItem = new ProgressItem();
greyItem.progressItemPercentage = (darkGreySpanElectra / totalSpanElectra) * 100;
greyItem.color = R.color.colorgray;
progressItemListElectra.add(greyItem);

seekbarElectra.initData(progressItemListElectra);

额外注意事项 #

• 确保自定义SeekBar的initData方法正确保存mProgressItemsList，不要被其他逻辑覆盖
• 建议把ProgressItem类里的progressItemPercentage改为float类型，避免整数精度丢失
• 动画时长可按需调整，300ms是比较自然的过渡速度

这样修改后，进度条会跟随滑块的进度平滑动画，滑块和进度条的数值也会完全同步啦！

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