Absatzstil

Auf dieser Seite wird beschrieben, wie Sie Text für Ihren Absatz formatieren können. Wenn Sie die Formatierung auf Absatzebene festlegen möchten, können Sie Parameter wie textAlign und lineHeight konfigurieren oder eigene ParagraphStyle definieren.

Textausrichtung festlegen

Mit dem Parameter textAlign können Sie die horizontale Ausrichtung des Texts innerhalb einer composable Text-Oberfläche festlegen.

Standardmäßig wählt Text die natürliche Textausrichtung je nach Inhalt aus:

• Linker Rand des Text-Containers für Alphabete, die von links nach rechts geschrieben werden, z. B. Lateinisch, Kyrillisch oder Hangul
• Rechter Rand des Text-Containers für linksläufige Alphabete wie Arabisch oder Hebräisch

@Composable
fun CenterText() {
    Text(
        "Hello World", textAlign = TextAlign.Center, modifier = Modifier.width(150.d
p)
    )
}TextS
nippets.kt

Wenn Sie die Textausrichtung eines Text-Kompositums manuell festlegen möchten, sollten Sie TextAlign.Start und TextAlign.End anstelle von TextAlign.Left und TextAlign.Right verwenden, da sie je nach bevorzugter Textausrichtung der Sprache am rechten Rand des Text-Kompositums aufgelöst werden. Beispiel: TextAlign.End wird bei französischem Text rechtsbündig und bei arabischem Text linksbündig ausgerichtet. TextAlign.Right wird dagegen unabhängig vom verwendeten Alphabet rechtsbündig ausgerichtet.

Mehrere Stile in einem Absatz hinzufügen

Wenn Sie einem Absatz mehrere Stile hinzufügen möchten, können Sie ParagraphStyle in einem AnnotatedString verwenden, das mit Stilen beliebiger Attribute annotiert werden kann. Sobald ein Teil des Textes mit einem ParagraphStyle gekennzeichnet ist, wird dieser Teil vom restlichen Text getrennt, als ob am Anfang und am Ende Zeilenumbrüche vorhanden wären.

Weitere Informationen zum Hinzufügen mehrerer Stile in einem Text finden Sie unter Mehrere Stile in Text hinzufügen.

AnnotatedString hat einen typsicheren Builder, um das Erstellen zu vereinfachen: buildAnnotatedString. Im folgenden Snippet wird buildAnnotatedString verwendet, um ParagraphStyle festzulegen:

@Composable
fun ParagraphStyle() {
    Text(
        buildAnnotatedString {
            withStyle(style = ParagraphStyle(lineHeight = 30.sp)) {
                withStyle(style = SpanStyle(color = Color.Blue)) {
                    append("Hello\n")
                }
                withStyle(
                    style = SpanStyle(
                        fontWeight = FontWeight.Bold, color = Color.Red
                    )
                ) {
                    append("World\n")
                }
                append("Compose")
 
           }
  
      }
    )
}TextSnippets.kt

Zeilenhöhe und Abstand anpassen

includeFontPadding ist ein älteres Attribut, das basierend auf Schriftmetriken zusätzlichen Abstand am Anfang der ersten Zeile und am Ende der letzten Zeile eines Textes hinzufügt. Ab Compose-BOM-Version 2024.01.01 ist includeFontPadding standardmäßig auf false festgelegt. Dadurch entspricht das Standardtextlayout eher gängigen Designtools.

Die Möglichkeit, lineHeight zu konfigurieren, ist nicht neu, sondern seit Android Q verfügbar. Sie können lineHeight für Text mit dem Parameter lineHeight konfigurieren, der die Zeilenhöhe in jeder Textzeile verteilt. Mit dem neuen LineHeightStyle API können Sie dann weiter konfigurieren, wie dieser Text im Bereich ausgerichtet wird, und Leerzeichen entfernen.

Möglicherweise möchtest du lineHeight mit der Texteinheit „em“ (relative Schriftgröße) anstelle von „sp“ (skalierte Pixel) anpassen, um die Genauigkeit zu verbessern. Weitere Informationen zur Auswahl einer geeigneten Texteinheit finden Sie unter TextUnit.

Text(
    text = text,
    style = LocalTextStyle.current.merge(
        TextStyle(
            lineHeight = 2.5.em,
            platformStyle = PlatformTextStyle(
                includeFontPadding = false
            ),
            lineHeightStyle = LineHeightStyle(
                alignment = LineHeightStyle.Alignment.Center,
                trim = LineHeightStyle.Trim.None
            )
        )
    )
)
TextSnippets.kt

Zusätzlich zur Anpassung von lineHeight können Sie Text jetzt mit Konfigurationen der LineHeightStyle API weiter zentrieren und formatieren: LineHeightStyle.Alignment und LineHeightStyle.Trim (includeFontPadding muss auf false festgelegt sein, damit das Kürzen funktioniert). Bei der Ausrichtung und beim Kürzen wird der gemessene Abstand zwischen den Textzeilen verwendet, um ihn besser auf alle Zeilen zu verteilen, einschließlich einer einzelnen Textzeile und der obersten Zeile eines Textblocks.

LineHeightStyle.Alignment definiert, wie die Linie in dem durch die Zeilenhöhe bereitgestellten Bereich ausgerichtet wird. In jeder Zeile können Sie den Text oben, unten, mittig oder proportional ausrichten. Mit LineHeightStyle.Trim können Sie dann den zusätzlichen Abstand am Anfang der ersten Zeile und am Ende der letzten Zeile Ihres Textes, der durch lineHeight- und Ausrichtungsanpassungen generiert wurde, beibehalten oder entfernen. Die folgenden Beispiele zeigen, wie mehrzeiliger Text mit verschiedenen LineHeightStyle.Trim-Konfigurationen aussieht, wenn die Ausrichtung zentriert ist (LineHeightStyle.Alignment.Center).

LineHeightStyle.Trim.None	LineHeightStyle.Trim.Both
LineHeightStyle.Trim.FirstLineTop	LineHeightStyle.Trim.LastLineBottom

Weitere Informationen zum Kontext dieser Änderung, zur Funktionsweise von includeFontPadding im View-System und zu den Änderungen für Compose und die neuen LineHeightStyle-APIs finden Sie im Blogpost Fixing Font Padding in Compose Text.

Zeilenumbrüche einfügen

Die LineBreak API definiert die Kriterien, nach denen Text auf mehrere Zeilen aufgeteilt wird. Du kannst die gewünschte Art des Zeilenumbruchs im TextStyle-Block deiner Text-komponierbaren Funktion angeben. Zu den voreingestellten Zeilenumbruchtypen gehören:

• Simple: Schneller, einfacher Zeilenumbruch. Empfohlen für Texteingabefelder.
• Heading: Zeilenumbruch mit weniger strengen Regeln. Empfohlen für kurzen Text, z. B. Titel.
• Paragraph: Langsamere, hochwertigere Zeilenumbrüche für bessere Lesbarkeit. Empfohlen für größere Textmengen, z. B. Absätze.

Im folgenden Snippet werden sowohl Simple als auch Paragraph verwendet, um das Zeilenumbruchverhalten für einen langen Textblock festzulegen:

TextSample(
    samples = mapOf(
        "Simple" to {
            Text(
                text = SAMPLE_LONG_TEXT,
                modifier = Modifier
                    .width(130.dp)
                    .border(BorderStroke(1.dp, Color.Gray)),
                fontSize = 14.sp,
                style = TextStyle.Default.copy(
                    lineBreak = LineBreak.Simple
                )
            )
        },
        "Paragraph" to {
            Text(
                text = SAMPLE_LONG_TEXT,
                modifier = Modifier
                    .width(130.dp)
                    .border(BorderStroke(1.dp, Color.Gray)),
                fontSize = 14.sp,
                style = TextStyle.Default.copy(
                    lineBreak = LineBreak.Paragraph
                )
           
 )
        }
  
  )
)TextSnippets.kt

In der obigen Ausgabe sehen Sie, dass das Zeilenumbruchverhalten von Paragraph ein visuell ausgewogeneres Ergebnis liefert als der Zeilenumbruch von Simple.

Zeilenumbrüche anpassen

Sie können auch eine eigene LineBreak-Konfiguration mit dem Parameter Strategy erstellen. Der Wert für Strategy kann einer der folgenden sein:

• Balanced: Versucht, die Zeilenlängen des Textes auszugleichen, und wendet auch die automatische Silbentrennung an, falls aktiviert. Empfohlen für kleine Displays, z. B. Smartwatches, um die Menge des angezeigten Texts zu maximieren.
• HighQuality: Optimiert einen Absatz für besser lesbaren Text, einschließlich Silbentrennung, falls aktiviert. (Sollte ein Standardwert für alles sein, was nicht Balanced oder Simple ist.)
• Simple: einfache, schnelle Strategie. Wenn diese Option aktiviert ist, werden nur Wörter getrennt, die nicht in eine ganze Zeile passen. Das ist nützlich, wenn Sie Text bearbeiten und verhindern möchten, dass sich die Position beim Tippen ändert.

Das folgende Snippet zeigt den Unterschied zwischen einem Absatz mit Standardeinstellungen und einem Absatz, der mit der Zeilenumbruchstrategie Balanced für kleine Bildschirme optimiert wurde:

TextSample(
    samples = mapOf(
        "Balanced" to {
            val smallScreenAdaptedParagraph =
                LineBreak.Paragraph.copy(strategy = LineBreak.Strategy.Balanced)
            Text(
                text = SAMPLE_LONG_TEXT,
                modifier = Modifier
                    .width(200.dp)
                    .border(BorderStroke(1.dp, Color.Gray)),
                fontSize = 14.sp,
                style = TextStyle.Default.copy(
                    lineBreak = smallScreenAdaptedParagraph
                )
            )
        },
        "Default" to {
            Text(
                text = SAMPLE_LONG_TEXT,
                modifier = Modifier
                    .width(200.dp)
                    .border(BorderStroke(1.dp, Color.Gray)),
                fontSize = 14.sp,
                style = TextStyle.Default
           
 )
        }
  
  )
)TextSnippets.kt

CJK-Überlegungen

Sie können LineBreak auch mit den APIs Strictness und WordBreak anpassen, die speziell für CJK-Sprachen entwickelt wurden. Die Auswirkungen dieser APIs sind in anderen Sprachen als CJK-Sprachen möglicherweise nicht immer sichtbar. Insgesamt werden die Regeln für den Zeilenumbruch anhand des Gebietsschemas definiert.

Strictness beschreibt die Strenge des Zeilenumbruchs mit den folgenden Attributen:

• Default: Standardmäßige Trennungsregeln für die Sprache. Kann Normal oder Strict entsprechen.
• Loose: Die am wenigsten restriktiven Regeln. Geeignet für kurze Zeilen.
• Normal: Die gängigsten Regeln für Zeilenumbrüche.
• Strict: Die strengsten Regeln für den Zeilenumbruch.

WordBreak definiert, wie Zeilenumbrüche innerhalb von Wörtern mit den folgenden Attributen eingefügt werden sollen:

• Default: Standardmäßige Trennungsregeln für die Sprache.
• Phrase: Zeilenumbrüche basieren auf Wortgruppen.

Im folgenden Snippet werden für einen japanischen Text die Strenge Strict und die Einstellung Phrase für den Zeilenumbruch verwendet:

val customTitleLineBreak = LineBreak(
    strategy = LineBreak.Strategy.HighQuality,
    strictness = LineBreak.Strictness.Strict,
    wordBreak = LineBreak.WordBreak.Phrase
)
Text(
    text = "あなたに寄り添う最先端のテクノロジー。",
    modifier = Modifier.width(250.dp),
    fontSize = 14.sp,
    style = TextStyle.Default.copy(
        lineBreak = customTitleLineBre
ak
    )
)TextS
nippets.kt

Text, der auf mehrere Zeilen aufgeteilt ist, mit Bindestrichen trennen

Mit der Hyphens API können Sie Ihrer App Unterstützung für die Silbentrennung hinzufügen. Bei der Silbentrennung wird ein Bindestrich eingefügt, um anzugeben, dass ein Wort über mehrere Textzeilen hinweg getrennt ist. Wenn diese Option aktiviert ist, wird die Silbentrennung zwischen den Silben eines Wortes an den entsprechenden Trennstellen eingefügt.

Die Silbentrennung ist standardmäßig nicht aktiviert. Wenn Sie die Silbentrennung aktivieren möchten, fügen Sie Hyphens.Auto als Parameter in einem TextStyle-Block hinzu:

TextSample(
    samples = mapOf(
        "Hyphens - None" to {
            Text(
                text = SAMPLE_LONG_TEXT,
                modifier = Modifier
                    .width(130.dp)
                    .border(BorderStroke(1.dp, Color.Gray)),
                fontSize = 14.sp,
                style = TextStyle.Default.copy(
                    lineBreak = LineBreak.Paragraph,
                    hyphens = Hyphens.None
                )
            )
        },
        "Hyphens - Auto" to {
            Text(
                text = SAMPLE_LONG_TEXT,
                modifier = Modifier
                    .width(130.dp)
                    .border(BorderStroke(1.dp, Color.Gray)),
                fontSize = 14.sp,
                style = TextStyle.Default.copy(
                    lineBreak = LineBreak.Paragraph,
                    hyphens = Hyphens.Auto
                )
           
 )
        }
  
  )
)TextSnippets.kt

Wenn die Silbentrennung aktiviert ist, erfolgt sie nur unter den folgenden Bedingungen:

• Ein Wort passt nicht in eine Zeile. Wenn Sie die Strategie Simple für den Zeilenumbruch verwenden, wird ein Wort nur dann getrennt, wenn eine Zeile kürzer als das einzelne Wort ist.
• Auf Ihrem Gerät ist die entsprechende Spracheinstellung festgelegt, da die passende Silbentrennung anhand der im System vorhandenen Wörterbücher ermittelt wird.