Text¶

A themable component for displaying text with various styles and customizations.

Installation¶

build.gradle.kts

repositories {
    mavenCentral()
}

dependencies {
    implementation("com.composables:core:1.31.1")
}

Basic Example¶

The Text component is used to display text with various styles and properties.

Text("Hello, World!", fontWeight = FontWeight.Bold, fontSize = 16.sp)

Styling¶

Every component in Compose Unstyled is renderless. They handle all UX pattern logic, internal state, accessibility (according to ARIA standards), and keyboard interactions for you, but they do not render any UI to the screen.

This is by design so that you can style your components exactly to your needs.

Most of the time, styling is done using Modifiers of your choice. However, sometimes this is not enough due to the order of the Modifiers affecting the visual outcome.

For such cases we provide specific styling parameters or optional components.

Code Examples¶

Consistent typography through the app¶

It is recommended to use the provided LocalTextStyle in order to maintain consistent text styling across your app.

If you need to override a text style for specific cases, you can either override a specific parameter via the Text modifier or pass an entire different style via the style parameter:

CompositionLocalProvider(LocalTextStyle provides TextStyle(fontSize = 18.sp, fontWeight = FontWeight.Medium)) {
    Column {
        Text("This text will use the provided LocalTextStyle")
        Text("So will this text")

        Text("This text is also styled, but slighly modified", letterSpacing = 2.sp)

        Text("This text is completely different", style = TextStyle())
    }
}

Styling Text¶

Text("Bold Text", fontWeight = FontWeight.Bold)
Text("Italic Text", fontStyle = FontStyle.Italic)
Text("Underlined Text", textDecoration = TextDecoration.Underline)
Text("Colored Text", color = Color.Red)
Text("Large Text", fontSize = 24.sp)

Handling Text Overflow¶

Text(
    "This is a very long text that might overflow",
    maxLines = 1,
    overflow = TextOverflow.Ellipsis
)

Component API¶

Text¶

Parameter	Description
`text`	The text to display.
`style`	The style to apply to the text.
`modifier`	The `Modifier` for the text.
`textAlign`	The alignment of the text.
`lineHeight`	The height of the lines.
`fontSize`	The size of the font.
`letterSpacing`	The spacing between letters.
`fontWeight`	The weight of the font.
`color`	The color of the text.
`fontFamily`	The family of the font.
`singleLine`	Whether the text is single line.
`minLines`	Minimum number of lines to display.
`maxLines`	Maximum number of lines to display.
`overflow`	How visual overflow should be handled.