Hi, How to remove the empty space from `supportText` when using Material 3 `OutlinedTextField`?

# compose-android

[Abhimanyu]

Hi,
How to remove the empty space from supportText when using Material 3 OutlinedTextField?

[Abhimanyu]

Context,
I want to animate the support text as it appears and disappears.

[Abhimanyu]

Sample Code for reference,

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

    Column(
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Box(
            modifier = Modifier
                .fillMaxWidth()
                .height(100.dp)
                .background(Color.LightGray)
        )
        OutlinedTextField(
            value = text,
            onValueChange = {
                text = it
            },
            supportingText = {
                AnimatedVisibility (text.isBlank()) {
                    Text("Text cannot be blank")
                }
            },
        )
        Box(
            modifier = Modifier
                .fillMaxWidth()
                .height(100.dp)
                .background(Color.LightGray)
        )
    }
}

[Abhimanyu]

Passing null to the supportText like this removes the space, but it does not animate.

supportingText = if (text.isBlank()) {
                {
                    AnimatedVisibility(text.isBlank()) {
                        Text("Text cannot be blank")
                    }
                }
            } else {
                null
            },

[Zach Klippenstein (he/him) [MOD]]

The presence of that function is probably used to reserve space, not the contents. So what you’re doing probably isn’t supported. Feel free to file a feature request

[Abhimanyu]

Yes, that is my understanding as well.
I have created an issue - https://issuetracker.google.com/issues/306808082