Left Aligning Button Text in Jetpack Compose

Question

I am using the following code to create an OutlinedButton in Jetpack Compose:

OutlinedButton(
            colors = ButtonDefaults.outlinedButtonColors(Color.Transparent),
            border = BorderStroke(0.dp, Color.Transparent),
            modifier = Modifier.fillMaxWidth()
                               .background(
                color = Color.Transparent,
        shape = RectangleShape, // Oval shape

        //border = androidx.compose.ui.drawBorder(2.dp, Color.Red) // Border color and width
        ),
            onClick = {}
        ) {

            Text(
                modifier = Modifier.padding(horizontal = 0.dp, vertical = 0.dp),
                color = Color.Black,
                text = text,
                textAlign = TextAlign.Left,
                fontSize = 15.sp,
            )
        }

I tried using TextAlign.Left and TextAlign.Start. However, it always aligns in the center:

How to solve this?

Answer 1

Add Row inside Button

OutlinedButton(onClick = {  }, modifier = Modifier
        .fillMaxWidth()
        .height(48.dp)) {

        Row(modifier = Modifier.fillMaxWidth()) {
            Text(text = "Button Text", textAlign = TextAlign.Start)

        }


    }