Is there a way to draw asymmetric `borders` using `Modifier`? I am trying to have an open arch or ac...

# compose

[Adrian Landborn]

Is there a way to draw asymmetric borders using Modifier?
I am trying to have an open arch or actually a Shape with rounded corners on 2 corners but I dont want to have last vertical line.

[Adrian Landborn]

Just to make it clear. The screenshot is on a Left and Right variant of a button.

[Rebecca Franks]

Have you tried using Canvas with drawPath to get the path you want to draw?

[Rebecca Franks]

Row(
    modifier = Modifier
        .padding(8.dp)
        .height(48.dp)
        .border(2.dp, Color.Black, RoundedCornerShape(32.dp))
) {
    IconButton(onClick = { /*TODO*/ }) {
        Icon(Icons.Default.Add, contentDescription = "")
    }
    Spacer(
        Modifier
            .fillMaxHeight()
            .background(Color.Black)
            .width(2.dp))
    IconButton(onClick = { /*TODO*/ }) {
        Icon(Icons.Default.Add, contentDescription = "")
    }
}

You could just use the shape on the whole container? or create a custom Shape that defines the path yourself.

[mkrussel]

https://medium.com/@manojbhadane/hello-everyone-558290eb632e

[dewildte]

How cool is it to have @Rebecca Franks answer our compose questions?!
Big fan here.

[Adrian Landborn]

Managet to get progress here. Thanks @Rebecca Franks

this.drawBehind {
    val degrees =
        if (orientation == DualButtonOrientation.Horizontal) {
            if (index == 0) 0f else 180f
        } else {
            if (index == 0) 90f else 270f
        }
    rotate(degrees) {
        drawArc(
            color = c,
            startAngle = 90f,
            sweepAngle = 180f,
            useCenter = false,
            style = Stroke(strokeWidthFirst.toPx()),
            topLeft = Offset.Zero,
            size = Size(size.height, size.height),
        )

        drawLine(
            color = c,
            start = Offset(size.height / 2, 0f),
            end = Offset(size.width, 0f),
            strokeWidth = strokeWidthFirst.toPx()
        )
        drawLine(
            color = c,
            start = Offset(size.height / 2, size.height),
            end = Offset(size.width, size.height),
            strokeWidth = strokeWidthFirst.toPx()
        )
    }
}