Стиль абзаца

Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.

На этой странице описано, как стилизовать текст для абзаца. Чтобы установить стиль на уровне абзаца, вы можете настроить такие параметры, как textAlign и lineHeight или определить свой собственный ParagraphStyle .

Установить выравнивание текста

Параметр textAlign позволяет задать горизонтальное выравнивание текста в области компонуемой поверхности Text .

По умолчанию Text выберет естественное выравнивание текста в зависимости от значения его содержимого:

• Левый край контейнера Text для алфавитов с письмом слева направо, таких как латиница, кириллица или хангыль.
• Правый край контейнера Text для алфавитов с письмом справа налево, таких как арабский или иврит.

@Composable
fun CenterText() {
    Text(
        "Hello World", textAlign = TextAlign.Center, modifier = Modifier.width(150.dp)
    )
}
TextSnippets.kt

Если вы хотите вручную установить выравнивание текста составного Text , предпочтительнее использовать TextAlign.Start и TextAlign.End вместо TextAlign.Left и TextAlign.Right соответственно, поскольку они разрешаются по правому краю составного Text в зависимости от ориентации текста на предпочтительном языке. Например, TextAlign.End выравнивается по правой стороне для французского текста и по левой стороне для арабского текста, но TextAlign.Right выравнивается по правой стороне независимо от того, какой алфавит используется.

Добавить несколько стилей в абзац

Чтобы добавить несколько стилей в абзац, вы можете использовать ParagraphStyle в AnnotatedString , который может быть снабжен стилями произвольных аннотаций. Как только часть вашего текста помечена ParagraphStyle , эта часть отделяется от остального текста, как если бы в начале и конце у нее были переводы строк.

Дополнительные сведения о добавлении нескольких стилей в текст см. в разделе Добавление нескольких стилей в текст .

AnnotatedString имеет типобезопасный конструктор, упрощающий создание: buildAnnotatedString . Следующий фрагмент использует buildAnnotatedString для установки ParagraphStyle :

@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

Отрегулируйте высоту строки и отступы

includeFontPadding — это устаревшее свойство, которое добавляет дополнительные отступы на основе показателей шрифта вверху первой строки и внизу последней строки текста. Начиная с версии Compose BOM 2024.01.01 , для параметра includeFontPadding по умолчанию установлено значение false , что приводит макет текста по умолчанию в большее соответствие с распространенными инструментами дизайна.

Возможность настройки lineHeight не нова — она доступна начиная с Android Q. Вы можете настроить lineHeight для Text с помощью параметра lineHeight , который распределяет высоту строки в каждой строке текста. Затем вы можете использовать новый LineHeightStyle API для дальнейшей настройки выравнивания этого текста в пространстве и удаления пробелов.

Для повышения точности вы можете настроить lineHeight , используя текстовую единицу «em» (относительный размер шрифта) вместо «sp» (масштабированные пиксели). Дополнительные сведения о выборе подходящего текстового блока см. в 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

В дополнение к настройке lineHeight теперь вы можете дополнительно центрировать и стилизовать текст, используя конфигурации с помощью LineHeightStyle API : LineHeightStyle.Alignment и LineHeightStyle.Trim (для работы Trim для параметра includeFontPadding должно быть установлено значение false ). Функции «Выравнивание» и «Обрезка» используют измеренное пространство между строками текста, чтобы более правильно распределить его по всем строкам, включая одну строку текста и верхнюю строку блока текста.

LineHeightStyle.Alignment определяет, как выровнять строку в пространстве, предусмотренном высотой строки. Внутри каждой строки вы можете выровнять текст по верху, низу, центру или пропорционально. LineHeightStyle.Trim затем позволяет вам оставить или удалить дополнительное пространство вверху первой строки и внизу последней строки вашего текста, созданное в результате любых настроек lineHeight и Alignment. В следующих примерах показано, как выглядит многострочный текст с различными конфигурациями LineHeightStyle.Trim при выравнивании по центру ( LineHeightStyle.Alignment.Center ).

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

См. публикацию в блоге «Исправление заполнения шрифта при составлении текста», чтобы узнать больше о контексте этого изменения, о том, как includeFontPadding работает в системе View, а также об изменениях, внесенных в Compose и новых API-интерфейсах LineHeightStyle .

Вставить разрывы строк

API LineBreak определяет критерии, по которым текст разбивается на несколько строк. Вы можете указать желаемый тип разрыва строки в блоке TextStyle вашего компонуемого Text . К предустановленным типам разрыва строк относятся следующие:

• Simple — быстрый, простой разрыв строки. Рекомендуется для полей ввода текста.
• Heading — разрыв строки с более мягкими правилами разрыва. Рекомендуется для короткого текста, например заголовков.
• Paragraph — более медленный и качественный перенос строк для улучшения читаемости. Рекомендуется для больших объемов текста, например абзацев.

В следующем фрагменте кода используются как Simple , так и Paragraph , чтобы указать поведение разрыва строк в длинном блоке текста:

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

Обратите внимание, что в приведенном выше выводе поведение разрыва строки Paragraph дает более визуально сбалансированный результат, чем Simple разрыв строки.

Настройте разрывы строк

Вы также можете создать свою собственную конфигурацию LineBreak с помощью параметра Strategy . Strategy может быть любой из следующих:

• Balanced — пытается сбалансировать длину строк текста, а также применяет автоматический перенос, если он включен. Рекомендуется для небольших экранов, например часов, чтобы максимизировать объем отображаемого текста.
• HighQuality — оптимизирует абзац для более читаемого текста, включая расстановку переносов, если он включен. (Должно быть значением по умолчанию для всего, что не является Balanced или Simple .)
• Simple — базовая, быстрая стратегия. Если этот параметр включен, переносы выполняются только для слов, которые не умещаются на всей строке. Полезно для редактирования текста, чтобы избежать изменения позиции во время набора текста.

В следующем фрагменте показана разница между абзацем с настройками по умолчанию и абзацем, оптимизированным для маленьких экранов с помощью Balanced стратегии разрыва строк:

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

Вы также можете настроить LineBreak с помощью API-интерфейсов Strictness и WordBreak , которые были разработаны специально для языков CJK . Вы не всегда можете увидеть эффекты этих API на языках, отличных от CJK. В целом правила разрыва строк определяются на основе языкового стандарта.

Strictness описывает строгость разрыва строки со следующими свойствами:

• Default — правила нарушения по умолчанию для локали. Может соответствовать Normal или Strict .
• Loose — Наименее ограничительные правила. Подходит для коротких линий.
• Normal — наиболее распространенные правила разрыва строки.
• Strict — самые строгие правила переноса строк.

WordBreak определяет, как разрывы строк должны быть вставлены в слова со следующими свойствами:

• Default — правила нарушения по умолчанию для локали.
• Phrase — разрыв строки основан на фразах.

В следующем фрагменте кода для японского текста используются параметры Strict строгость» и «Разбиение слов Phrase :

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 = customTitleLineBreak
    )
)
TextSnippets.kt

Расстановка переносов в тексте, разделенном на строки

API Hyphens позволяет добавить в приложение поддержку расстановки переносов. Под расстановкой переносов понимается вставка знака препинания в виде тире, чтобы указать, что слово разделено на строки текста. Если этот параметр включен, переносы добавляются между слогами слова в соответствующих точках переноса.

По умолчанию расстановка переносов не включена. Чтобы включить расстановку переносов, добавьте Hyphens.Auto в качестве параметра в блок TextStyle :

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

Если этот параметр включен, расстановка переносов происходит только при следующих условиях:

• Слово не помещается в строку. Если вы используете стратегию Simple разрыва строки, перенос слова происходит только в том случае, если строка короче отдельного слова.
• На вашем устройстве установлена ​​соответствующая локаль, а соответствующие переносы определяются с использованием словарей, имеющихся в системе.

На этой странице описано, как стилизовать текст для абзаца. Чтобы установить стиль на уровне абзаца, вы можете настроить такие параметры, как textAlign и lineHeight или определить свой собственный ParagraphStyle .

Установить выравнивание текста

Параметр textAlign позволяет задать горизонтальное выравнивание текста в области компонуемой поверхности Text .

По умолчанию Text выберет естественное выравнивание текста в зависимости от значения его содержимого:

• Левый край контейнера Text для алфавитов с письмом слева направо, таких как латиница, кириллица или хангыль.
• Правый край контейнера Text для алфавитов с письмом справа налево, таких как арабский или иврит.

@Composable
fun CenterText() {
    Text(
        "Hello World", textAlign = TextAlign.Center, modifier = Modifier.width(150.dp)
    )
}
TextSnippets.kt

Если вы хотите вручную установить выравнивание текста составного объекта Text , предпочитайте использовать TextAlign.Start и TextAlign.End вместо TextAlign.Left и TextAlign.Right соответственно, поскольку они разрешаются по правому краю составного объекта Text в зависимости от ориентации текста на предпочтительном языке. Например, TextAlign.End выравнивается по правой стороне для французского текста и по левой стороне для арабского текста, но TextAlign.Right выравнивается по правой стороне независимо от того, какой алфавит используется.

Добавить несколько стилей в абзац

Чтобы добавить несколько стилей в абзац, вы можете использовать ParagraphStyle в AnnotatedString , который может быть снабжен стилями произвольных аннотаций. Как только часть вашего текста помечена ParagraphStyle , эта часть отделяется от остального текста, как если бы в начале и конце у нее были переводы строк.

Дополнительные сведения о добавлении нескольких стилей в текст см. в разделе Добавление нескольких стилей в текст .

AnnotatedString имеет типобезопасный конструктор, упрощающий создание: buildAnnotatedString . Следующий фрагмент использует buildAnnotatedString для установки ParagraphStyle :

@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

Отрегулируйте высоту строки и отступы

includeFontPadding — это устаревшее свойство, которое добавляет дополнительные отступы на основе показателей шрифта вверху первой строки и внизу последней строки текста. Начиная с версии Compose BOM 2024.01.01 , для параметра includeFontPadding по умолчанию установлено значение false , что приводит макет текста по умолчанию в большее соответствие с распространенными инструментами дизайна.

Возможность настройки lineHeight не нова — она доступна начиная с Android Q. Вы можете настроить lineHeight для Text с помощью параметра lineHeight , который распределяет высоту строки в каждой строке текста. Затем вы можете использовать новый LineHeightStyle API для дальнейшей настройки выравнивания этого текста в пространстве и удаления пробелов.

Для повышения точности вы можете настроить lineHeight , используя текстовую единицу «em» (относительный размер шрифта) вместо «sp» (масштабированные пиксели). Дополнительные сведения о выборе подходящего текстового блока см. в 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

В дополнение к настройке lineHeight теперь вы можете дополнительно центрировать и стилизовать текст, используя конфигурации с помощью LineHeightStyle API : LineHeightStyle.Alignment и LineHeightStyle.Trim (для работы Trim для параметра includeFontPadding должно быть установлено значение false ). Функции «Выравнивание» и «Обрезка» используют измеренное пространство между строками текста, чтобы более правильно распределить его по всем строкам, включая одну строку текста и верхнюю строку блока текста.

LineHeightStyle.Alignment определяет, как выровнять строку в пространстве, предусмотренном высотой строки. Внутри каждой строки вы можете выровнять текст по верху, низу, центру или пропорционально. LineHeightStyle.Trim затем позволяет вам оставить или удалить дополнительное пространство вверху первой строки и внизу последней строки вашего текста, созданное в результате любых настроек lineHeight и Alignment. В следующих примерах показано, как выглядит многострочный текст с различными конфигурациями LineHeightStyle.Trim при выравнивании по центру ( LineHeightStyle.Alignment.Center ).

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

См. публикацию в блоге «Исправление заполнения шрифта при составлении текста», чтобы узнать больше о контексте этого изменения, о том, как includeFontPadding работает в системе View, а также об изменениях, внесенных в Compose и новых API-интерфейсах LineHeightStyle .

Вставить разрывы строк

API LineBreak определяет критерии, по которым текст разбивается на несколько строк. Вы можете указать желаемый тип разрыва строки в блоке TextStyle вашего компонуемого Text . К предустановленным типам разрыва строк относятся следующие:

• Simple — быстрый, простой разрыв строки. Рекомендуется для полей ввода текста.
• Heading — разрыв строки с более мягкими правилами разрыва. Рекомендуется для короткого текста, например заголовков.
• Paragraph — более медленный и качественный перенос строк для улучшения читаемости. Рекомендуется для больших объемов текста, например абзацев.

В следующем фрагменте кода используются как Simple , так и Paragraph , чтобы указать поведение разрыва строк в длинном блоке текста:

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

Обратите внимание, что в приведенном выше выводе поведение разрыва строки Paragraph дает более визуально сбалансированный результат, чем Simple разрыв строки.

Настройте разрывы строк

Вы также можете создать свою собственную конфигурацию LineBreak с помощью параметра Strategy . Strategy может быть любой из следующих:

• Balanced — пытается сбалансировать длину строк текста, а также применяет автоматический перенос, если он включен. Рекомендуется для небольших экранов, например часов, чтобы максимизировать объем отображаемого текста.
• HighQuality — оптимизирует абзац для более читаемого текста, включая расстановку переносов, если он включен. (Должно быть значением по умолчанию для всего, что не является Balanced или Simple .)
• Simple — базовая, быстрая стратегия. Если этот параметр включен, переносы выполняются только для слов, которые не умещаются на всей строке. Полезно для редактирования текста, чтобы избежать изменения позиции во время набора текста.

В следующем фрагменте показана разница между абзацем с настройками по умолчанию и абзацем, оптимизированным для маленьких экранов с помощью Balanced стратегии разрыва строк:

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

Вы также можете настроить LineBreak с помощью API-интерфейсов Strictness и WordBreak , которые были разработаны специально для языков CJK . Вы не всегда можете увидеть эффекты этих API на языках, отличных от CJK. В целом правила разрыва строк определяются на основе языкового стандарта.

Strictness описывает строгость разрыва строки со следующими свойствами:

• Default — правила нарушения по умолчанию для локали. Может соответствовать Normal или Strict .
• Loose — Наименее ограничительные правила. Подходит для коротких линий.
• Normal — наиболее распространенные правила разрыва строки.
• Strict — самые строгие правила переноса строк.

WordBreak определяет, как разрывы строк должны быть вставлены в слова со следующими свойствами:

• Default — правила нарушения по умолчанию для локали.
• Phrase — разрыв строки основан на фразах.

В следующем фрагменте кода для японского текста используются параметры Strict строгость» и «Разбиение слов Phrase :

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 = customTitleLineBreak
    )
)
TextSnippets.kt

Расстановка переносов в тексте, разделенном на строки

API Hyphens позволяет добавить поддержку расстановки переносов в ваше приложение. Под расстановкой переносов понимается вставка знака препинания в виде тире, чтобы указать, что слово разделено на строки текста. Если этот параметр включен, переносы добавляются между слогами слова в соответствующих точках переноса.

По умолчанию расстановка переносов не включена. Чтобы включить расстановку переносов, добавьте Hyphens.Auto в качестве параметра в блок TextStyle :

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

Если этот параметр включен, расстановка переносов происходит только при следующих условиях:

• Слово не помещается в строку. Если вы используете стратегию Simple разрыва строки, перенос слова происходит только в том случае, если строка короче отдельного слова.
• На вашем устройстве установлена ​​соответствующая локаль, а соответствующие переносы определяются с использованием словарей, имеющихся в системе.

На этой странице описано, как стилизовать текст для абзаца. Чтобы установить стиль на уровне абзаца, вы можете настроить такие параметры, как textAlign и lineHeight или определить свой собственный ParagraphStyle .

Установить выравнивание текста

Параметр textAlign позволяет задать горизонтальное выравнивание текста в области компонуемой поверхности Text .

По умолчанию Text выберет естественное выравнивание текста в зависимости от значения его содержимого:

• Левый край контейнера Text для алфавитов с письмом слева направо, таких как латиница, кириллица или хангыль.
• Правый край контейнера Text для алфавитов с письмом справа налево, таких как арабский или иврит.

@Composable
fun CenterText() {
    Text(
        "Hello World", textAlign = TextAlign.Center, modifier = Modifier.width(150.dp)
    )
}
TextSnippets.kt

Если вы хотите вручную установить выравнивание текста составного Text , предпочтительнее использовать TextAlign.Start и TextAlign.End вместо TextAlign.Left и TextAlign.Right соответственно, поскольку они разрешаются по правому краю составного Text в зависимости от ориентации текста на предпочтительном языке. Например, TextAlign.End выравнивается по правой стороне для французского текста и по левой стороне для арабского текста, но TextAlign.Right выравнивается по правой стороне независимо от того, какой алфавит используется.

Добавить несколько стилей в абзац

Чтобы добавить несколько стилей в абзац, вы можете использовать ParagraphStyle в AnnotatedString , который может быть снабжен стилями произвольных аннотаций. Как только часть вашего текста помечена ParagraphStyle , эта часть отделяется от остального текста, как если бы в начале и конце у нее были переводы строк.

Дополнительные сведения о добавлении нескольких стилей в текст см. в разделе Добавление нескольких стилей в текст .

AnnotatedString имеет типобезопасный конструктор, упрощающий создание: buildAnnotatedString . Следующий фрагмент использует buildAnnotatedString для установки ParagraphStyle :

@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

Отрегулируйте высоту строки и отступы

includeFontPadding — это устаревшее свойство, которое добавляет дополнительные отступы на основе показателей шрифта вверху первой строки и внизу последней строки текста. Начиная с версии Compose BOM 2024.01.01 , для параметра includeFontPadding по умолчанию установлено значение false , что приводит макет текста по умолчанию в большее соответствие с распространенными инструментами дизайна.

Возможность настройки lineHeight не нова — она доступна начиная с Android Q. Вы можете настроить lineHeight для Text с помощью параметра lineHeight , который распределяет высоту строки в каждой строке текста. Затем вы можете использовать новый LineHeightStyle API для дальнейшей настройки выравнивания этого текста в пространстве и удаления пробелов.

Для повышения точности вы можете настроить lineHeight , используя текстовую единицу «em» (относительный размер шрифта) вместо «sp» (масштабированные пиксели). Дополнительные сведения о выборе подходящего текстового блока см. в 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

В дополнение к настройке lineHeight теперь вы можете дополнительно центрировать и стилизовать текст, используя конфигурации с помощью LineHeightStyle API : LineHeightStyle.Alignment и LineHeightStyle.Trim (для работы Trim для параметра includeFontPadding должно быть установлено значение false ). Функции «Выравнивание» и «Обрезка» используют измеренное пространство между строками текста, чтобы более правильно распределить его по всем строкам, включая одну строку текста и верхнюю строку блока текста.

LineHeightStyle.Alignment определяет, как выровнять строку в пространстве, предусмотренном высотой строки. Внутри каждой строки вы можете выровнять текст по верху, низу, центру или пропорционально. LineHeightStyle.Trim затем позволяет вам оставить или удалить дополнительное пространство вверху первой строки и внизу последней строки вашего текста, созданное в результате любых настроек lineHeight и Alignment. В следующих примерах показано, как выглядит многострочный текст с различными конфигурациями LineHeightStyle.Trim при выравнивании по центру ( LineHeightStyle.Alignment.Center ).

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

См. публикацию в блоге «Исправление заполнения шрифта при составлении текста», чтобы узнать больше о контексте этого изменения, о том, как includeFontPadding работает в системе View, а также об изменениях, внесенных в Compose и новых API-интерфейсах LineHeightStyle .

Вставить разрывы строк

API LineBreak определяет критерии, по которым текст разбивается на несколько строк. Вы можете указать желаемый тип разрыва строки в блоке TextStyle вашего компонуемого Text . К предустановленным типам разрыва строк относятся следующие:

• Simple — быстрый, простой разрыв строки. Рекомендуется для полей ввода текста.
• Heading — разрыв строки с более мягкими правилами разрыва. Рекомендуется для короткого текста, например заголовков.
• Paragraph — более медленный и качественный перенос строк для улучшения читаемости. Рекомендуется для больших объемов текста, например абзацев.

В следующем фрагменте кода используются как Simple , так и Paragraph , чтобы указать поведение разрыва строк в длинном блоке текста:

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

Обратите внимание, что в приведенном выше выводе поведение разрыва строки Paragraph дает более визуально сбалансированный результат, чем Simple разрыв строки.

Настройте разрывы строк

Вы также можете создать свою собственную конфигурацию LineBreak с помощью параметра Strategy . Strategy может быть любой из следующих:

• Balanced — пытается сбалансировать длину строк текста, а также применяет автоматический перенос, если он включен. Рекомендуется для небольших экранов, например часов, чтобы максимизировать объем отображаемого текста.
• HighQuality — оптимизирует абзац для более читаемого текста, включая расстановку переносов, если он включен. (Должно быть значением по умолчанию для всего, что не является Balanced или Simple .)
• Simple — базовая, быстрая стратегия. Если этот параметр включен, переносы выполняются только для слов, которые не умещаются на всей строке. Полезно для редактирования текста, чтобы избежать изменения позиции во время набора текста.

В следующем фрагменте показана разница между абзацем с настройками по умолчанию и абзацем, оптимизированным для маленьких экранов с помощью Balanced стратегии разрыва строк:

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

Вы также можете настроить LineBreak с помощью API-интерфейсов Strictness и WordBreak , которые были разработаны специально для языков CJK . Вы не всегда можете увидеть эффекты этих API на языках, отличных от CJK. В целом правила разрыва строк определяются на основе языкового стандарта.

Strictness описывает строгость разрыва строки со следующими свойствами:

• Default — правила нарушения по умолчанию для локали. Может соответствовать Normal или Strict .
• Loose — Наименее ограничительные правила. Подходит для коротких линий.
• Normal — наиболее распространенные правила разрыва строки.
• Strict — самые строгие правила переноса строк.

WordBreak определяет, как разрывы строк должны быть вставлены в слова со следующими свойствами:

• Default — правила нарушения по умолчанию для локали.
• Phrase — разрыв строки основан на фразах.

В следующем фрагменте кода для японского текста используются параметры Strict строгость» и «Разбиение слов Phrase :

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 = customTitleLineBreak
    )
)
TextSnippets.kt

Расстановка переносов в тексте, разделенном на строки

API Hyphens позволяет добавить в приложение поддержку расстановки переносов. Под расстановкой переносов понимается вставка знака препинания в виде тире, чтобы указать, что слово разделено на строки текста. Если этот параметр включен, переносы добавляются между слогами слова в соответствующих точках переноса.

По умолчанию расстановка переносов не включена. Чтобы включить расстановку переносов, добавьте Hyphens.Auto в качестве параметра в блок TextStyle :

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

Если этот параметр включен, расстановка переносов происходит только при следующих условиях:

• Слово не помещается в строку. Если вы используете стратегию Simple разрыва строки, перенос слова происходит только в том случае, если строка короче отдельного слова.
• На вашем устройстве установлена ​​соответствующая локаль, а соответствующие переносы определяются с использованием словарей, имеющихся в системе.

На этой странице описано, как стилизовать текст для абзаца. Чтобы установить стиль на уровне абзаца, вы можете настроить такие параметры, как textAlign и lineHeight или определить свой собственный ParagraphStyle .

Установить выравнивание текста

Параметр textAlign позволяет задать горизонтальное выравнивание текста в области компонуемой поверхности Text .

По умолчанию Text выберет естественное выравнивание текста в зависимости от значения его содержимого:

• Левый край контейнера Text для алфавитов с письмом слева направо, таких как латиница, кириллица или хангыль.
• Правый край контейнера Text для алфавитов с письмом справа налево, таких как арабский или иврит.

@Composable
fun CenterText() {
    Text(
        "Hello World", textAlign = TextAlign.Center, modifier = Modifier.width(150.dp)
    )
}
TextSnippets.kt

Если вы хотите вручную установить выравнивание текста составного объекта Text , предпочитайте использовать TextAlign.Start и TextAlign.End вместо TextAlign.Left и TextAlign.Right соответственно, поскольку они разрешаются по правому краю составного объекта Text в зависимости от ориентации текста на предпочтительном языке. Например, TextAlign.End выравнивается по правой стороне для французского текста и по левой стороне для арабского текста, но TextAlign.Right выравнивается по правой стороне независимо от того, какой алфавит используется.

Добавить несколько стилей в абзац

Чтобы добавить несколько стилей в абзац, вы можете использовать ParagraphStyle в AnnotatedString , который может быть снабжен стилями произвольных аннотаций. Как только часть вашего текста помечена ParagraphStyle , эта часть отделяется от остального текста, как если бы в начале и конце у нее были переводы строк.

Для получения дополнительной информации о добавлении нескольких стилей в тексте см. Добавьте несколько стилей в тексте .

AnnotatedString имеет защитник типов , чтобы упростить создание: buildAnnotatedString . Следующий фрагмент использует buildAnnotatedString для установки ParagraphStyle :

@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

Отрегулируйте высоту линии и прокладку

includeFontPadding - это устаревшее свойство, которое добавляет дополнительную прокладку на основе показателей шрифтов в верхней части первой линии и нижней части последней строки текста. Начиная с Compose Bom версии 2024.01.01 , includeFontPadding , по умолчанию установлено значение false , что приводит к тому, что макет текста по умолчанию больше в соответствии с общими инструментами проектирования.

Возможность настроить lineHeight не является новой - она ​​была доступна, поскольку Android Q. Вы можете настроить lineHeight для Text , используя параметр lineHeight , который распределяет высоту строки в каждой строке текста. Затем вы можете использовать новый LineHeightStyle API для дальнейшей настройки того, как этот текст выровнен в пространстве, и удалить пробелы.

Вы можете настроить lineHeight , используя текстовый блок «EM» (относительный размер шрифта) вместо «SP» (масштабированные пиксели) для повышения точности. Для получения дополнительной информации о выборе соответствующего текстового блока см. 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

В дополнение к настройке lineHeight , вы теперь можете дальнейший текст в центре и стиля, используя конфигурации с помощью API LineHeightStyle : LineHeightStyle.Alignment и LineHeightStyle.Trim ( includeFontPadding , чтобы быть установленным на false для работы TRIM). Выравнивание и отделка Используйте измеренное пространство между линиями текста, чтобы более подходящее распределение по всем линиям - включая одну строку текста и верхнюю строку блока текста.

LineHeightStyle.Alignment определяет, как выровнять линию в пространстве, предоставленном высотой линии. В каждой строке вы можете выравнивать текст вверху, снизу, в центре или пропорционально. Затем LineHeightStyle.Trim позволяет вам оставить или удалить дополнительное пространство в верхнюю часть первой линии и нижней части последней строки вашего текста, сгенерированной из любых регулировки lineHeight и выравнивания. Следующие образцы показывают, как выглядит многострочный текст с различными конфигурациями LineHeightStyle.Trim , когда центрируется выравнивание ( LineHeightStyle.Alignment.Center ).

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

См. Fixing Font Padding в сообщении в блоге Compose, чтобы узнать больше о контексте этого изменения, о том, как includeFontPadding работающую в системе просмотра, и изменения, внесенные для Compose и новые API LineHeightStyle .

Вставьте разрывы линии

API LineBreak определяет критерии, с помощью которых текст разделен на несколько строк. Вы можете указать тип разрыва линии, который вы хотите в блоке TextStyle вашего Text композиции. Типы разрыва линейки предустановки включают следующее:

• Simple - быстрый, базовый разрыв линии. Рекомендуется для поля ввода текста.
• Heading - линия, разбиваясь с более слабыми правилами разрыва. Рекомендуется для короткого текста, например, названия.
• Paragraph -более медленное, более качественное разрыв линии для улучшения читаемости. Рекомендуется для большего количества текста, таких как абзацы.

Следующий фрагмент использует как Simple , так и Paragraph для указания поведения разрушения линии на длинном блоке текста:

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

На приведенном выше выводе обратите внимание, что поведение, нарушающее линию Paragraph , дает более визуально сбалансированный результат, чем Simple разрыв линии.

Настройте разрывы строк

Вы также можете построить свою собственную конфигурацию LineBreak с помощью параметра Strategy . Strategy может быть любой из следующих действий:

• Balanced - Попытки сбалансировать длину линии текста, также применяя автоматическую гифенацию, если включена. Рекомендуется для небольших экранов, таких как часы, чтобы максимизировать количество отображаемого текста.
• HighQuality - оптимизирует абзац для более читаемого текста, включая гифенацию, если включена. (Должно быть по умолчанию все, что не Balanced или Simple .)
• Simple - базовая, быстрая стратегия. Если включена, гифенация выполняется только для слов, которые сами не подходят для всей строки. Полезно для редактирования текста, чтобы избежать изменения позиций при наборе.

Следующий фрагмент показывает разницу между параграфом с настройками по умолчанию и абзацем, оптимизированным для небольших экранов со Balanced стратегией нарушения линий:

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 соображения

Вы также можете настроить LineBreak со Strictness и API WordBreak API, которые были разработаны специально для языков CJK . Вы не всегда можете видеть эффекты этих API на не-CJK-языках. В целом, правила нарушения линий определяются на основе локализации.

Strictness описывает строгость линии, разбивающейся со следующими свойствами:

• Default - правила разрыва по умолчанию для локали. Может соответствовать Normal или Strict .
• Loose - наименее ограничительные правила. Подходит для коротких линий.
• Normal - наиболее распространенные правила для разрыва линии.
• Strict - самые строгие правила для разрыва линии.

WordBreak определяет, как разрывы строк должны быть вставлены в словах со следующими свойствами:

• Default - правила разрыва по умолчанию для локали.
• Phrase - разрыв строки основана на фразах.

Следующий фрагмент использует Strict строгость и настройку слов Phrase для японского текста:

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 = customTitleLineBreak
    )
)
TextSnippets.kt

Текст дефисат разделен по линиям

Hyphens API позволяет добавлять поддержку гифенации в ваше приложение. Гифинация относится к вставке отметки пунктуации, похожей на то, чтобы указать, что слово разделено на линии текста. При включении добавляется гифенация между слогами слова в соответствующих точках гифенации.

По умолчанию гифенация не включена. Чтобы включить гифенацию, добавьте Hyphens.Auto в качестве параметра в блоке TextStyle :

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

При включении гифенация происходит только в следующих условиях:

• Слово не вписывается в линию. Если вы используете Simple стратегию разбития линии, гифенация слова происходит только в том случае, если строка короче одного слова.
• Соответствующая локаль установлен на вашем устройстве, в зависимости от необходимости гифенация определяется с использованием словарей, присутствующих в системе.