How do I achieve this? The left part is a clickable button, the right part is just to display a numb...

# compose

[Lukasz Kalnik]

How do I achieve this? The left part is a clickable button, the right part is just to display a number:

[Lukasz Kalnik]

Row(
        modifier = Modifier.height(Min),
        verticalAlignment = Alignment.CenterVertically,
    ) {
        OutlinedButton(
            onClick = onDecreaseQuantityClicked,
            modifier = Modifier.size(buttonSize),
            border = BorderStroke(1.dp, MaterialTheme.colorScheme.onSurface),
            shape = RoundedCornerShape(topStart = buttonCornerRadius, topEnd = 0.dp, bottomEnd = 0.dp, bottomStart = buttonCornerRadius),
            contentPadding = PaddingValues(8.dp),
        ) {
            Icon(
                painter = painterResource(id = drawable.sc_ic_quantity_minus),
                contentDescription = null,
                tint = MaterialTheme.colorScheme.onBackground,
            )
        }
            Box(
                modifier = Modifier
                    .height(buttonSize)
                    .border(BorderStroke(1.dp, MaterialTheme.colorScheme.onSurface))
                    .clip(
                        RoundedCornerShape(
                            topStart = 0.dp,
                            topEnd = buttonCornerRadius,
                            bottomEnd = buttonCornerRadius,
                            bottomStart = 0.dp
                        )
                    )
                    .padding(8.dp),
                contentAlignment = Alignment.Center,
            ) {
                Text(
                    text = quantity.toString(),
                    style = MaterialTheme.typography.titleSmall,
                )
            }
    }

[Lukasz Kalnik]

Gives this:

[Lukasz Kalnik]

So the end corners are not rounded and there is a double line in the middle.

[Lukasz Kalnik]

I assume I have the modifiers order on the Box wrong somehow. But How do I get rid of the start (left) border on the Box?

[Lukasz Kalnik]

I ended up setting the border on the containing Row and have the elements inside without border, but separated by `VerticalDivider`s.