先看效果

Dingtalk_20221102150140.jpg

主要有5種顏色：
1.整體背景色
2.progressbar的背景色
3.進度圓點的顏色
4.進度顏色的開始和結(jié)束顏色

代碼

package com.example.mydemo2

import android.content.Context
import android.graphics.*
import android.util.AttributeSet
import android.util.TypedValue
import android.view.View

/**
 * @author xiaozhi
 * @CreateDate 2022/3/2 2:23 下午
 * @Description
 */
open class SampleProgressView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0,
    defStyleRes: Int = 0
) : View(context, attrs, defStyleAttr, defStyleRes) {
    private var mHeight = 0
    private var mProgressWidth = 0
    private var mProgressHeight = 0
    private var mMaxProgress = 100f
    private var mCurrentProgress = 0
    private var textMargin = 0
    private val startColor="#1EF1C6"http://開始顏色
    private val endColor="#00B79B"http://結(jié)束的顏色
    //底色背景圖
    private var mProgressPaint = Paint().apply {
        color = Color.parseColor("#131313")
        style = Paint.Style.FILL
    }
    private var mCompleteProgressPaint = Paint().apply {
        style = Paint.Style.FILL
        color = Color.parseColor(endColor)
    }
    private var mCirClePaint = Paint()

    private var mTextPaint = Paint().apply {
        color = Color.WHITE
        isAntiAlias = true
        textAlign = Paint.Align.LEFT
    }

    private var helperPaint = Paint().apply {
        color = Color.parseColor(endColor)
    }
    //private lateinit var bitmap: Bitmap
    private val color1 = Color.parseColor(startColor)
    private val color2 = Color.parseColor(endColor)

    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
        mTextPaint.textSize = dip2px(10).toFloat()
        //bitmap = BitmapFactory.decodeResource(resources, R.mipmap.ic_seekbar)
        mProgressWidth = MeasureSpec.getSize(widthMeasureSpec)
        mHeight = dip2px(20)
        mProgressHeight = dip2px(12)
        textMargin = dip2px(5)
        setMeasuredDimension(mProgressWidth, mHeight)
    }

    /**
     * dp 2 px
     *
     * @param dpVal
     */
    private fun dip2px(dpVal: Int): Int {
        return TypedValue.applyDimension(
            TypedValue.COMPLEX_UNIT_DIP,
            dpVal.toFloat(), resources.displayMetrics
        ).toInt()
    }
    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        val progress = mCurrentProgress / mMaxProgress
        val spaceH = (mHeight - mProgressHeight) / 2f  //上間距

        val rectProgress = RectF(0f, spaceH, mProgressWidth.toFloat(), mHeight - spaceH)
//底部框
        canvas.drawRoundRect(rectProgress, mHeight / 2f, mHeight / 2f, mProgressPaint)

        val completeLength = (mCurrentProgress / mMaxProgress) * mProgressWidth.toFloat()
        val rectCompleteProgress = RectF(0f, spaceH, completeLength, mHeight - spaceH)

//漸變色進度條
        mCompleteProgressPaint.shader = LinearGradient(
            rectCompleteProgress.left,
            rectCompleteProgress.bottom / 2,
            rectCompleteProgress.right, rectCompleteProgress.bottom / 2,
            color1,
            color2,
            Shader.TileMode.CLAMP
        )
//進度框
        canvas.drawRoundRect(
            rectCompleteProgress,
            mHeight / 2f,
            mHeight / 2f,
            mCompleteProgressPaint
        )
        if(progress<1){
            val rectCompleteProgressHelper =
                RectF(rectCompleteProgress.right-mHeight/2f,
                    rectCompleteProgress.top,
                    rectCompleteProgress.right,
                    rectCompleteProgress.bottom)
           
            canvas.drawRect(
                rectCompleteProgressHelper,
                helperPaint
            )
        }

        val changeRange = mProgressWidth  //圓心游標(biāo)的移動長度范圍
        val circleLength = (mCurrentProgress / mMaxProgress) * changeRange.toFloat() + mProgressHeight/2
        //canvas.drawBitmap(bitmap,null, Rect((circleLength - mHeight / 2).toInt(), 0,(circleLength + mHeight / 2).toInt(),mHeight),mCirClePaint)
        mCirClePaint.color = -0x1//白色圓點
        canvas.drawCircle(circleLength, mHeight/2.toFloat(), mProgressHeight/2.toFloat(), mCirClePaint)

    }


    fun setCurrentProgress(progress: Int) {
        mCurrentProgress = progress
        postInvalidate()
    }

    fun setMaxProgress(maxProgress: Float) {
        mMaxProgress = maxProgress
    }
}

調(diào)用

<com.example.mydemo2.SampleProgressView
        android:id="@+id/sampleProgressView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#222222"
        android:layout_marginTop="10dp" />