如何在可绘制的中风中设置梯度

Question

我正在尝试创建一个可以用破折号绘制的圆圈。我能够用仪表板实现圆圈，但无法应用梯度颜色。有什么办法吗？提前致谢。

 <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size
        android:width="@dimen/size60"
        android:height="@dimen/size60" />


    <stroke

        android:width="1dp"
        android:color="@color/white"
        android:dashWidth="3dp"
        android:dashGap="1dp" />

</shape>

查看已达到的视图：

所需的视图：

Answer 1

只有仅使用XML AFAIK创建梯度环的方法。使用自定义绘制，您会有更好的运气。以下将扫描渐变着色器与 paint 对象组合在一起，以创建一个从头到尾具有梯度的环。

class DashedRingDrawable : Drawable() {

    private val mPaint = Paint().apply {
        style = Paint.Style.STROKE
        strokeWidth = STROKE_WIDTH
    }

    private val mColorArray = intArrayOf(Color.WHITE, Color.BLACK)

    private var mRingOuterDiameter = 0f
    private var mRingOuterRadius = 0f
    private var mRingInnerRadius = 0f

    override fun onBoundsChange(bounds: Rect) {
        super.onBoundsChange(bounds)
        check(bounds.width() == bounds.height()) {
            "Width must be equal to height. (It's a circle.)"
        }
        mRingOuterDiameter = bounds.width().toFloat()
        mRingOuterRadius = mRingOuterDiameter / 2
        mRingInnerRadius = (mRingOuterDiameter - STROKE_WIDTH) / 2
        val dashLength = getNewDashLength()
        mPaint.pathEffect = DashPathEffect(floatArrayOf(dashLength, GAP_LENGTH), 0f)
        mPaint.shader = SweepGradient(mRingOuterRadius, mRingOuterRadius, mColorArray, null)
    }

    override fun draw(canvas: Canvas) {
        // The following statement is here to show the boundaries and can be removed/commented out.
        canvas.drawColor(Color.RED)
        canvas.drawCircle(mRingOuterRadius, mRingOuterRadius, mRingInnerRadius, mPaint)
    }

    override fun setAlpha(alpha: Int) {
    }

    override fun setColorFilter(colorFilter: ColorFilter?) {
    }

    override fun getOpacity(): Int {
        return PixelFormat.OPAQUE
    }

    // Adjust the dash length so that we end on a gap and not in the middle of a dash.
    private fun getNewDashLength(): Float {
        val circumference = Math.PI.toFloat() * mRingInnerRadius * 2
        val dashCount = (circumference / (DASH_LENGTH + GAP_LENGTH)).toInt()
        val newDashLength = (circumference - dashCount * GAP_LENGTH) / dashCount
        return newDashLength
    }

    companion object {
        const val STROKE_WIDTH = 15f
        const val DASH_LENGTH = 50f
        const val GAP_LENGTH = 15f
    }
}

对于API 24及更高版本，您可以将其绘制到XML文件中，并像其他XML绘制一样使用它。

<drawable xmlns:android="http://schemas.android.com/apk/res/android"
    class="com.example.myapp.DashedRingDrawable"/>

对于API 24之前的API，您需要以编程方式使用此自定义绘制。