drawableStart equivalent in TextField of Jetpack compose

Question

So I was checking out this document here https://developer.android.com/jetpack/compose/text#enter-modify-text

I have managed to create a text field (EditText) Using:

@Composable
    fun EmailField() {
        var text by remember { mutableStateOf("") }

        TextField(
            colors = TextFieldDefaults.textFieldColors(
                textColor = Color.White,
                focusedIndicatorColor = Color.White,
                focusedLabelColor = Color.White
            ),
            value = text,
            onValueChange = { text = it },
            label = { Text("Email") }
        )
    }

Now I want to set the drawableStart which we had in XML. So is there any such equivalent or other way to achieve?

I want to create something like this:

Any help or lead is appreciated

Answer 1

You can use the leadingIcon attribute:

TextField(
    value = text,
    onValueChange = { text = it },
    leadingIcon = {
       Icon(Icons.Filled.Email,
        "contentDescription",
        modifier = Modifier.clickable { /* .. */})}
)