先來看使用

<VerticalProgress? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????android:id="@+id/vertical_progress"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????android:layout_width="match_parent"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????android:layout_height="match_parent"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????android:layout_centerInParent="true"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????app:color="#eeee55" app:progress="10"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????app:progress_height="300dp"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????app:progress_width="50dp"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????app:rounded="10dp"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????app:text_location="center"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?????app:text_size="24sp" />

小效果圖如下：

效果圖

具體實現(xiàn)：

成員變量部分

var paint:Paint? =null

var rect:RectF? =null

var rectBac:RectF? =null//背景

var progressHeight =0f//進度條高度

var progressWidth =0f//進度條寬度

var rounded =0f//進度條圓角

var colorInt =0//進度條顏色

var background =0//進度條背景色

var progress =0//進度0..100

var textSize =0f//文字大小

var textLocation =1//文字位置 1..3? top..bottom

構(gòu)造方法

val ta = context.obtainStyledAttributes(attr,R.styleable.VerticalProgress)

progressHeight =ta.getDimension(R.styleable.VerticalProgress_progress_height,100f)

progressWidth =ta.getDimension(R.styleable.VerticalProgress_progress_width,10f)

rounded =ta.getDimension(R.styleable.VerticalProgress_rounded,10f)

textSize =ta.getDimension(R.styleable.VerticalProgress_text_size,16f)

colorInt =ta.getColor(R.styleable.VerticalProgress_color,R.color.black!!)

background =ta.getColor(R.styleable.VerticalProgress_backgroundColor,R.color.black!!)

progress =ta.getInt(R.styleable.VerticalProgress_progress,0)

textLocation =ta.getInt(R.styleable.VerticalProgress_text_location,1)

paint = Paint()

paint!!.color =colorInt

rectBac = RectF(0f,0f,progressWidth +5,progressHeight +5)

rect = RectF(2.5f,2.5f,progressWidth,progressHeight)

onMeasure方法

setMeasuredDimension(rectBac!!.right.toInt(),rectBac!!.bottom.toInt())

繪制過程

paint!!.textSize =textSize

? ? ? ? val fontMetricsInt =paint!!.getFontMetricsInt()

val bounds = Rect()

paint!!.getTextBounds("$progress%",0,"$progress%".length,bounds)

val textHeight =fontMetricsInt.bottom -fontMetricsInt.top

? ? ? ? val textWidth =bounds.right -bounds.left

? ? ? ? val progressFloat =rect!!.bottom - (rect!!.bottom /100f) *progress.toFloat()

rect!!.top =progressFloat +3

//? ? ? ? rect!!.right = if (rect!!.right <= textWidth) textWidth.toFloat() + 10 else rect!!.right

? ? ? ? paint!!.color =background

//? ? ? ? rectBac!!.right =

//? ? ? ? ? ? if (rectBac!!.right <= textWidth) textWidth.toFloat() + 15 else rectBac!!.right

? ? ? ? canvas!!.drawRoundRect(rectBac!!,rounded,rounded,paint!!)

//? ? ? ? canvas!!.save()

//? ? ? ? val path = Path()

//? ? ? ? path.addArc(rectBac!!,height.toFloat(),width.toFloat())

//? ? ? ? canvas.clipPath(path)

? ? ? ? paint!!.color =colorInt

? ? ? ? canvas.drawRoundRect(rect!!,rounded,rounded,paint!!)

//? ? ? ? canvas.restore()

? ? ? ? paint!!.color =context.resources.getColor(R.color.white)

when (textLocation) {

????1 -> {

????????canvas.drawText("$progress%",width /2f -textWidth /2,10f +textHeight,paint!!)

????}

????2 -> {

????????canvas.drawText(

????????????"$progress%",

????????????width /2f -textWidth /2,

????????????rect!!.bottom /2f +textHeight /2,

????????????paint!!

????????????)

????}

????3 -> {

????????canvas.drawText(

????????????"$progress%",

????????????width /2f -textWidth /2,

????????????rect!!.bottom -10f -textHeight,

????????????paint!!

????????????)

????????}

}

自定義屬性部分

<declare-styleable name="VerticalProgress">

<attr name="progress_height" format="dimension" />

<attr name="progress_width" format="dimension" />

<attr name="rounded" format="dimension" />

<attr name="color" format="color" />

<attr name="backgroundColor" format="color" />

<attr name="progress" format="integer" />

<attr name="text_size" format="dimension" />

<attr name="text_location" format="enum">

<enum name="top" value="1" />

<enum name="center" value="2" />

<enum name="bottom" value="3" />

</attr>

</declare-styleable>

有些小問題，使用的時候就會發(fā)現(xiàn)了，沒有那么唱的時間搞了，使用者自行解決罷