Android 使用贝塞尔曲线自定义View，一个弹性的小圆形

y婷婷

已于 2022-12-09 16:07:01 修改

阅读量361

点赞数

分类专栏： Android 文章标签： android kotlin java

于 2022-12-09 16:06:21 首次发布

本文链接：https://blog.csdn.net/m0_58663436/article/details/128254752

版权

本文详细介绍了如何在Android中利用Kotlin或Java实现自定义View，通过贝塞尔曲线创建一个可弹性伸缩的小圆形视图。讨论了关键的绘图API和贝塞尔曲线的数学原理，并提供了示例代码。

摘要由CSDN通过智能技术生成

class Bezier(context: Context?, attrs: AttributeSet?, defStyleAttr: Int) :
    View(context, attrs, defStyleAttr) {
    private var mPaint: Paint? = null
    private var mPath: Path? = null
    private var startPoint: Point? = null
    private var endPoint: Point? = null
    private var centreX = 0
    private var centreY = 0
    private val DURATION: Long = 1000
    private var radius = 0
    private var radius_tem = 0
    private var MValue = 0f
    private var unitDistance // 最小开始移动单位
            = 0
    private val currentOrientation = MOVE_RIGHT

    constructor(context: Context?) : this(context, null, 0) {}
    constructor(context: Context?, attrs: AttributeSet?) : this(context, attrs, 0) {}

    private fun init() {
        mPaint = Paint()
        mPaint?.color = Color.RED
        mPaint?.style = Paint.Style.FILL
        mPaint?.strokeWidth = 8f
        mPaint?.isAntiAlias = true
        mPaint?.isDither = true
        mPath = Path()
    }

    override fun onSizeChanged(w: Int, h: Int, oldW: Int, oldH: Int) {
        super.onSizeChanged(w, h, oldW, oldH)
        centreX = w / 2
        centreY = h / 2
        radius = centreX / 5
        radius_tem = radius
        MValue = M * radius
        movedDistance = 6 * radius
        unitDistance = radius
        startPoint = Point(2 * radius, centreY)
        endPoint = Point(centreX + 3 * radius, centreY)
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        mPath?.reset()
        if (fraction == STATE0) {
            drawStep0(canvas)
        } else if (fraction < STATE1) {
            drawStep1(canvas)
        } else if (fraction < STATE2) {
            drawStep2(canvas)
        } else if (fraction < STATE3) {
            drawStep3(canvas)
        } else if (fraction <= STATE4) {
            drawStep4(canvas)
        } else if (fraction <= STATE5) {
            drawStep5(canvas)
        }
    }

    private fun drawStep0(canvas: Canvas) {
        if (currentOrientation == MOVE_RIGHT) {
            mPath?.moveTo(startPoint?.x?.toFloat()!!, startPoint?.y?.toFloat()!! + radius)
            mPath?.cubicTo(
                startPoint?.x?.toFloat()!! - MValue,
                startPoint?.y?.toFloat()!! + radius,
                startPoint?.x?.toFloat()!! - radius,
                startPoint?.y?.toFloat()!! + MValue,
                startPoint?.x?.toFloat()!! - radius,
                startPoint!!.y.toFloat()
            ) //第三象限
            mPath?.cubicTo(
                startPoint!!.x.toFloat() - radius,
                startPoint!!.y.toFloat() - MValue,
                startPoint!!.x.toFloat() - MValue,
                startPoint!!.y.toFloat() - radius,
                startPoint!!.x.toFloat(),
                startPoint!!.y.toFloat() - radius
            ) //第二象限