自定义圆形进度条
示例.png
示例 (2).png
示例 (3).png
示例 (4).png
实现
override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
super.onSizeChanged(w, h, oldw, oldh)
//圆心位置
centerPosition!!.x = w / 2
centerPosition!!.y = h / 2
//半径
val maxCirWidth = Math.max(mCirWidth!!, mBgCirWidth!!)
val minWidth =
Math.min(w - paddingLeft - paddingRight - 2 * maxCirWidth, h - paddingBottom - paddingTop - 2 * maxCirWidth)
raduis = minWidth / 2
mOuterRaduis = raduis!! + maxCirWidth / 2
//矩形坐标
mRectF!!.left = centerPosition!!.x - raduis!! - maxCirWidth / 2
mRectF!!.top = centerPosition!!.y - raduis!! - maxCirWidth / 2
mRectF!!.right = centerPosition!!.x + raduis!! + maxCirWidth / 2
mRectF!!.bottom = centerPosition!!.y + raduis!! + maxCirWidth / 2
if (isGradient!!) {
sweepGradientCircle()//圆环颜色渐变
}
}
private fun drawText(canvas: Canvas?) {
canvas!!.drawText(
mValue.toString(),
centerPosition!!.x.toFloat(),
centerPosition!!.y.toFloat(),
mValuePaint!!
)
if (mUnit != null || mUnit != "") {
canvas.drawText(
mUnit.toString(),
centerPosition!!.x + mValuePaint!!.measureText(mValue.toString()) / 2,
centerPosition!!.y.toFloat(),
mUnitPaint!!
)
}
if (mHint != null || mHint != "") {
canvas.drawText(
mHint.toString(),
centerPosition!!.x.toFloat(),
centerPosition!!.y - mHintPaint!!.ascent() + 3,
mHintPaint!!
)
}
}
/**
* 使用渐变色画圆
*/
private fun sweepGradientCircle() {
mSweepGradient =
SweepGradient(centerPosition!!.x.toFloat(), centerPosition!!.y.toFloat(), mGradientColors!!, null)
mCirPaint!!.shader = mSweepGradient
}
/**
* 画圆
*/
private fun drawCircle(canvas: Canvas?) {
canvas!!.save()
if (mShadowIsShow!!) {
mCirPaint!!.setShadowLayer(mShadowSize!!, 0f, 0f, mShadowColor!!)//设置阴影
}
//画背景圆
canvas.drawArc(mRectF!!, mStartAngle!!, mSweepAngle!!, false, mBgCirPaint!!)
//画圆
canvas.drawArc(mRectF!!, mStartAngle!!, mSweepAngle!! * mPercent!!, false, mCirPaint!!)
canvas.restore()
}
圆形进度条api
属性
对应方法
名称
类型
默认值
antiAlias
是否开启抗锯齿
Boolean
false
mCirWidth
外圆环宽度
Float
15f
mCirColor
外圆环颜色
Int
Color.YELLOW
mBgCirWidth
底圆环宽度
Float
14f
mBgCirColor
底圆环颜色
Float
Color.GRAY
animTime
动画时间
Int
1000
value
setValue(value: String,maxValue: Float)
设置值
String
""
valueSize
值大小
Float
15F
valueColor
值颜色
Int
Color.BLACK
maxvalue
setValue(value: String,maxValue: Float)
设置最大值
Float
100F
unit
单位
Float
%
unitSize
单位大小
Float
8F
unitColor
单位颜色
Int
Color.GRAY
hint
提示语
Float
”“
hintSize
提示语大小
Float
10F
hintColor
提示语颜色
Int
Color.GRAY
startAngle
圆环起始角度
Float
270F
sweepAngle
圆环滑过角度
Float
360F
gradient
setGradientColors(gradientColors: IntArray)
渐变色
IntArray
intArrayOf(Color.BLACK, Color.GRAY, Color.BLUE)
isGradient
setIsGradient(isGradient:Boolean)
是否渐变色
Boolean
false
smallCirEnable
setSmallCircleEnable(enable:Boolean)
是否显示起始小圆
Boolean
false
smallCirColor
起始小圆颜色
Int
Color.WHITE
smallCirWidth
起始小圆半径
Float
7F
shadowShow
setShadowEnable(enable: Boolean)
是否显示阴影
Boolean
false
shadowSize
阴影大小
Float
10F
shadowColor
阴影颜色
Int
Color.BLACK
digit
setDigit(digit:Int)
保留小数位数
Int
2
isanim
是否需要动画
Boolean
true
使用
将MyCircleProgressView和attrs.xml下的MyCircleProgressView拷贝到自己的项目下,并修改控件引用,即可使用。
地址