# FadingExpandingLabel

## Functions summary

|---|---|
| `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/Composable https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/FadingExpandingLabel.composable#FadingExpandingLabel(kotlin.String,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,kotlin.Boolean,kotlin.Int,kotlin.Int,androidx.compose.ui.text.TextStyle,androidx.compose.animation.core.FiniteAnimationSpec)( text: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-string/index.html, modifier: https://developer.android.com/reference/kotlin/androidx/compose/ui/Modifier, color: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color, fontSize: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit, fontStyle: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontStyle?, fontWeight: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontWeight?, fontFamily: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontFamily?, letterSpacing: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit, textDecoration: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/style/TextDecoration?, textAlign: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/style/TextAlign?, lineHeight: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit, softWrap: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html, maxLines: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html, minLines: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html, textStyle: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle, animationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/FiniteAnimationSpec<https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html> )` Animates label text for which the number of lines can vary, changing the size of the container component. |

## Functions

### FadingExpandingLabel

Artifact: [androidx.wear.compose:compose-material3](https://developer.android.com/jetpack/androidx/releases/wear-compose) [View Source](https://cs.android.com/search?q=file:androidx/wear/compose/material3/FadingExpandingLabel.kt+function:FadingExpandingLabel) Added in [1.6.0](https://developer.android.com/jetpack/androidx/releases/wear-compose#1.6.0)

```
@Composable
fun FadingExpandingLabel(
    text: String,
    modifier: Modifier = Modifier,
    color: Color = Color.Unspecified,
    fontSize: TextUnit = TextUnit.Unspecified,
    fontStyle: FontStyle? = null,
    fontWeight: FontWeight? = null,
    fontFamily: FontFamily? = null,
    letterSpacing: TextUnit = TextUnit.Unspecified,
    textDecoration: TextDecoration? = null,
    textAlign: TextAlign? = LocalTextConfiguration.current.textAlign,
    lineHeight: TextUnit = TextUnit.Unspecified,
    softWrap: Boolean = true,
    maxLines: Int = LocalTextConfiguration.current.maxLines,
    minLines: Int = 1,
    textStyle: TextStyle = LocalTextStyle.current,
    animationSpec: FiniteAnimationSpec<Float> = FadingExpandingLabelDefaults.animationSpec
): Unit
```

Animates label text for which the number of lines can vary, changing the size of the container component.

Displays the given string in a `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/Text.composable#Text(kotlin.String,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextOverflow,kotlin.Boolean,kotlin.Int,kotlin.Int,kotlin.Function1,androidx.compose.ui.text.TextStyle)`, with an animation that fades text in line by line when new lines of text are added or removed. This is intended to be used for labels in a Button or Card, where we want the container to expand to fit the contents when the lines of the text change.

```kotlin
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.style.TextAlign
import androidx.wear.compose.material3.Button
import androidx.wear.compose.material3.FadingExpandingLabel

var text by remember { mutableStateOf("Line of Text One.") }
var lines by remember { mutableIntStateOf(1) }

Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
    Button(
        onClick = {
            lines = lines % 3 + 1
            text =
                (1..lines).joinToString(separator = "\n") {
                    when (it) {
                        1 -> "Line of Text One."
                        2 -> "Line of Text Two."
                        else -> "Line of Text Three."
                    }
                }
        },
        modifier = Modifier.fillMaxWidth(),
        label = { FadingExpandingLabel(text = text, textAlign = TextAlign.Left) },
    )
}
```

| Parameters |
|---|---|
| `text: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-string/index.html` | Text string that will be shown. |
| `modifier: https://developer.android.com/reference/kotlin/androidx/compose/ui/Modifier = Modifier` | Modifier to be applied to the animated text. |
| `color: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color = Color.Unspecified` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color` to apply to the text. If `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color#Unspecified()`, and `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#FadingExpandingLabel(kotlin.String,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,kotlin.Boolean,kotlin.Int,kotlin.Int,androidx.compose.ui.text.TextStyle,androidx.compose.animation.core.FiniteAnimationSpec)` has no color set, this will be `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#LocalContentColor()`. |
| `fontSize: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit = TextUnit.Unspecified` | The size of glyphs to use when painting the text. See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#fontSize()`. |
| `fontStyle: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontStyle? = null` | The typeface variant to use when drawing the letters (e.g., italic). See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#fontStyle()`. |
| `fontWeight: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontWeight? = null` | The typeface thickness to use when painting the text (e.g., `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontWeight#Bold()`). |
| `fontFamily: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontFamily? = null` | The font family to be used when rendering the text. See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#fontFamily()`. |
| `letterSpacing: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit = TextUnit.Unspecified` | The amount of space to add between each letter. See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#letterSpacing()`. |
| `textDecoration: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/style/TextDecoration? = null` | The decorations to paint on the text (e.g., an underline). See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#textDecoration()`. |
| `textAlign: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/style/TextAlign? = LocalTextConfiguration.current.textAlign` | The alignment of the text within the lines of the paragraph. See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#textAlign()`. |
| `lineHeight: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit = TextUnit.Unspecified` | Line height for the `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/Paragraph` in `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/TextUnit` unit, e.g. SP or EM. See `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle#lineHeight()`. |
| `softWrap: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html = true` | Whether to wrap text at soft line breaks. When true, wraps text to the next line when it exceeds layout bounds. When false, positions text as if there was unlimited horizontal space. |
| `maxLines: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html = LocalTextConfiguration.current.maxLines` | An optional maximum number of lines for the text to span, wrapping if necessary. If it is not null, then it must be greater than zero. |
| `minLines: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html = 1` | The minimum height in terms of minimum number of visible lines. It is required that 1 \<= `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#FadingExpandingLabel(kotlin.String,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,kotlin.Boolean,kotlin.Int,kotlin.Int,androidx.compose.ui.text.TextStyle,androidx.compose.animation.core.FiniteAnimationSpec)`\<= `https://developer.android.com/reference/kotlin/androidx/wear/compose/material3/package-summary#FadingExpandingLabel(kotlin.String,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,kotlin.Boolean,kotlin.Int,kotlin.Int,androidx.compose.ui.text.TextStyle,androidx.compose.animation.core.FiniteAnimationSpec)`. |
| `textStyle: https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle = LocalTextStyle.current` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/text/TextStyle` for the animated text. |
| `animationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/FiniteAnimationSpec<https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html> = FadingExpandingLabelDefaults.animationSpec` | Animation spec for the text fade animation. |