Text

@Composable

fun Text(text: String, typographyDimensions: TypographyDimensions, fontFamily: FontFamily, fontWeight: FontWeight, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a TypographyDimensions, FontFamily, and FontWeight.

Custom Font Weight Text Sample

Parameters

text

The text to be displayed.

typographyDimensions

The TypographyDimensions style to apply to the text.

fontFamily

The FontFamily to use for the text.

fontWeight

The FontWeight to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: String, typography: Typography, fontWeight: FontWeight, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a Typography and FontWeight. The text will be truncated with an ellipsis if it exceeds the given number of lines.

Custom Font Weight Text Sample

Parameters

text

The text to be displayed.

typography

The Typography style to apply to the text.

fontWeight

The FontWeight to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: String, baseTypography: BaseTypography, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a BaseTypography. The text will be truncated with an ellipsis if it exceeds the given number of lines.

Base Text Sample

Parameters

text

The text to be displayed.

baseTypography

The BaseTypography style to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: String, prominentTypography: ProminentTypography, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a ProminentTypography. The text will be truncated with an ellipsis if it exceeds the given number of lines.

Prominent Text Sample

Parameters

text

The text to be displayed.

prominentTypography

The ProminentTypography style to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: AnnotatedString, typographyDimensions: TypographyDimensions, fontFamily: FontFamily, fontWeight: FontWeight, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a TypographyDimensions, FontFamily, and FontWeight. The text will be truncated with an ellipsis if it exceeds the given number of lines.

This is a version of Text using AnnotatedString, which enables more granular styling:

val text = buildAnnotatedString {
    append("Hello, here the font weight is ")

    withStyle(
        style = SpanStyle(
            color = OdsTheme.color.text.bg.accent,
        ),
    ) {
        append("100")
    }

    append("!")
}

Text(
    text = text,
    typography = OdsTheme.typographies.mobile.body.normal,
    fontFamily = OdsTheme.typography.fontFamily.primary
    fontWeight = FontWeight(100),
    color = OdsTheme.color.text.bg.primary,
)

Custom Font Weight Text Sample Annotated

Parameters

text

The AnnotatedString text to be displayed.

typographyDimensions

The TypographyDimensions style to apply to the text.

fontFamily

The FontFamily to use for the text.

fontWeight

The FontWeight to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: AnnotatedString, typography: Typography, fontWeight: FontWeight, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a Typography and FontWeight. The text will be truncated with an ellipsis if it exceeds the given number of lines.

This is a version of Text using AnnotatedString, which enables more granular styling:

val text = buildAnnotatedString {
    append("Hello, here the font weight is ")

    withStyle(
        style = SpanStyle(
            color = OdsTheme.color.text.bg.accent,
        ),
    ) {
        append("100")
    }

    append("!")
}

Text(
    text = text,
    typography = OdsTheme.typographies.mobile.body.normal,
    fontWeight = FontWeight(100),
    color = OdsTheme.color.text.bg.primary,
)

Custom Font Weight Text Sample Annotated

Parameters

text

The AnnotatedString text to be displayed.

typography

The Typography style to apply to the text.

fontWeight

The FontWeight to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: AnnotatedString, baseTypography: BaseTypography, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a BaseTypography. The text will be truncated with an ellipsis if it exceeds the given number of lines.

This is a version of Text using AnnotatedString, which enables more granular styling:

val text = buildAnnotatedString {
    append("Hello, here the font weight is ")

    withStyle(
        style = SpanStyle(
            color = OdsTheme.color.text.bg.accent,
        ),
    ) {
        append("base")
    }

    append("!")
}

Text(
    text = text,
    baseTypography = OdsTheme.typographies.mobile.body.normal,
    color = OdsTheme.color.text.bg.primary,
)

Base Text Sample Annotated

Parameters

text

The AnnotatedString text to be displayed.

baseTypography

The BaseTypography style to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.

@Composable

fun Text(text: AnnotatedString, prominentTypography: ProminentTypography, color: Color, modifier: Modifier = Modifier, maxLines: Int = Int.MAX_VALUE, textDecoration: TextDecoration? = null, textAlign: TextAlign = TextAlign.Unspecified)

The Text composable can be used to display plain text or styled text from a ProminentTypography. The text will be truncated with an ellipsis if it exceeds the given number of lines.

This is a version of Text using AnnotatedString, which enables more granular styling:

val text = buildAnnotatedString {
    append("Hello, here the font weight is ")

    withStyle(
        style = SpanStyle(
            color = OdsTheme.color.text.bg.accent,
        ),
    ) {
        append("prominent")
    }

    append("!")
}

Text(
    text = text,
    baseTypography = OdsTheme.typographies.mobile.body.normal,
    color = OdsTheme.color.text.bg.primary,
)

Prominent Text Sample Annotated

Parameters

text

The AnnotatedString text to be displayed.

prominentTypography

The ProminentTypography style to apply to the text.

color

The text Color.

modifier

An optional Modifier to be applied to the Text. Defaults to Modifier.

maxLines

An optional maximum number of lines for the text to span, wrapping if necessary. If the text exceeds the given number of lines, it will be truncated.

textDecoration

The TextDecoration to paint on the text (e.g., an underline).

textAlign

The TextAlign alignment of the text within the lines of the paragraph.