📜  自定义单选按钮颤动 (1)

📅  最后修改于: 2023-12-03 15:27:43.872000             🧑  作者: Mango

自定义单选按钮颤动

在许多应用中,我们经常需要使用单选按钮来让用户进行选择,但是默认的单选按钮可能会显得有些单调。在这里,我们将介绍如何自定义单选按钮并让它们颤动。

如何自定义单选按钮

我们可以使用自定义视图来创建我们自己的单选按钮。为了使视图看起来像单选按钮,我们需要创建一个圆形背景和一个内圆点并将它们放置在一起。

以下是一个简单的自定义视图示例,可以作为单选按钮使用。

class CustomRadioButton @JvmOverloads constructor(
    context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {

    private var selected = false
    private var circleColor = Color.BLACK
    private var circleRadius = 30f
    private var circlePaint: Paint = Paint(Paint.ANTI_ALIAS_FLAG)

    init {
        // 设置画笔样式
        circlePaint.style = Paint.Style.FILL
        circlePaint.color = circleColor
    }

    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        val desiredWidth = circleRadius.toInt() * 2 + paddingLeft + paddingRight
        val desiredHeight = circleRadius.toInt() * 2 + paddingTop + paddingBottom

        val width = resolveSize(desiredWidth, widthMeasureSpec)
        val height = resolveSize(desiredHeight, heightMeasureSpec)

        setMeasuredDimension(width, height)
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)

        // 画圆形背景
        circlePaint.color = if (selected) Color.RED else circleColor
        canvas.drawCircle(
            (width / 2).toFloat(),
            (height / 2).toFloat(),
            circleRadius,
            circlePaint
        )

        // 画内圆点
        if (selected) {
            val dotRadius = circleRadius / 2
            circlePaint.color = Color.WHITE
            canvas.drawCircle(
                (width / 2).toFloat(),
                (height / 2).toFloat(),
                dotRadius,
                circlePaint
            )
        }
    }

    fun setSelected(selected: Boolean) {
        this.selected = selected
        invalidate()
    }

    fun isChecked(): Boolean {
        return selected
    }
}
如何让单选按钮颤动

让单选按钮颤动需要在自定义视图的代码上添加一些动画。我们可以使用Android框架自带的属性动画库,来创建动画效果。

以下是一个简单的实例代码,可以让单选按钮在选择时颤动:

val button = CustomRadioButton(this)
button.setOnClickListener {
    button.setSelected(!button.isChecked())
    val anim = ObjectAnimator.ofFloat(button, "translationY", 0f, -10f, 10f, -10f, 0f)
    anim.duration = 500
    anim.start()
}

这段代码中,我们通过在自定义单选按钮的点击事件中添加一个ObjectAnimator,来创建一个抖动动画。这个动画将自定义单选按钮在Y轴上进行抖动,并在0.5秒之内完成。

现在,我们已经知道了如何自定义单选按钮,并让它们颤动了。在实际应用中,我们可以使用这个自定义单选按钮来让我们的应用更加生动、具有视觉吸引力。