Как создать макет в стиле «волна» с помощью Android Canvas

Question

Я пытался создать пользовательский вид, аналогичный показанному ниже, в котором белый вид «волна» содержит расширенный «обратный закругленный угол» в правом верхнем углу и закругленный угол в левом нижнем углу.

Я пытался добиться этого с помощью темы Material Shape , но, похоже, это не поддерживает закругленный угол «инверсии».

Чтобы добиться этого, я использовал View и собственный чертеж в его Canvas, но не смог заставить его работать, так как не уверен, как добиться эффекта обратного закругленного угла.

Любая помощь или руководство будет принята с благодарностью

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

    private var mPath = Path()

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

        val h = height.toFloat()
        val h2 = height.toFloat() / 2f
        val w = width.toFloat()
        val w2 = width.toFloat() / 2f

        mPath.reset()
        mPath.addArc(w2, 0f, w, h2, 0f, 90f)
        mPath.addArc(0f, h2, w2, h, 180f, 90f)
        mPath.lineTo(w, h2)
        mPath.lineTo(w, h)
        mPath.lineTo(0f, h)
        mPath.close()

        mPath.fillType = Path.FillType.WINDING
        canvas?.clipPath(mPath)
        canvas?.drawColor(Color.DKGRAY)
    }
}

Answer 1

Я решил это, используя Кривые Безье и адаптировав ответ, найденный в этом вопросе SO

Код, который я использовал для достижения этого, был следующим:

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

    private val paint = Paint().apply {
        color = Color.RED
        isAntiAlias = true
        style = Paint.Style.FILL
    }

    private val path = Path()

    override fun onDraw(canvas: Canvas?) {

        val h = height.toFloat()
        val halfH = h / 2f
        val w = width.toFloat()
        val delta = width / 3f

        path.reset()
        path.moveTo(0f, h)
        path.cubicTo(0f, halfH, 0f, halfH, delta, halfH)
        path.lineTo(w - delta, halfH)
        path.cubicTo(w, halfH, w, halfH, w, 0f)
        path.lineTo(w, h)
        path.close()

        canvas?.drawPath(path, paint)
    }

}