https://kotlinlang.org logo
Channels
Powered by
#compose-android
Title
# compose-android
a

Abhimanyu

10/22/2023, 4:14 AM
Hi, How to remove the empty space from 
supportText
when using Material 3 
OutlinedTextField
?
Context, I want to animate the support text as it appears and disappears.
Sample Code for reference,
Copy code
@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)
        )
    }
}
Passing 
null
to the 
supportText
like this removes the space, but it does not animate.
Copy code
supportingText = if (text.isBlank()) {
                {
                    AnimatedVisibility(text.isBlank()) {
                        Text("Text cannot be blank")
                    }
                }
            } else {
                null
            },
z

Zach Klippenstein (he/him) [MOD]

10/23/2023, 3:21 AM
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
a

Abhimanyu

10/23/2023, 5:14 AM
Yes, that is my understanding as well. I have created an issue - https://issuetracker.google.com/issues/306808082
👍🏻 1
3 Views
Powered by