Paragrafı biçimlendir

Bu sayfada, paragrafınız için metne nasıl stil uygulayabileceğiniz açıklanmaktadır. Paragraf düzeyinde stil ayarlamak için textAlign ve lineHeight gibi parametreleri yapılandırabilir veya kendi ParagraphStyle parametrenizi tanımlayabilirsiniz.

Metin hizalamasını ayarlama

textAlign parametresi, Text birleştirilebilir yüzey alanındaki metnin yatay hizalamasını ayarlamanıza olanak tanır.

Varsayılan olarak Text, içerik değerine bağlı olarak doğal metin hizalamasını seçer:

• Latin, Kiril veya Hangul gibi soldan sağa alfabeler için Text kapsayıcının sol kenarı
• Arapça veya İbranice gibi sağdan sola doğru yazılan alfabeler için Text kapsayıcının sağ kenarı

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

Bir Text bileşeninin metin hizalamasını manuel olarak ayarlamak istiyorsanız tercih edilen dil metni yönüne bağlı olarak Text bileşeninin sağ kenarına çözülecekleri için sırasıyla TextAlign.Left ve TextAlign.Right yerine TextAlign.Start ve TextAlign.End kullanmayı tercih edin. Örneğin, TextAlign.End Fransızca metin için sağ tarafa, Arapça metin için ise sol tarafa hizalanır. Ancak TextAlign.Right, kullanılan alfabe ne olursa olsun sağ tarafa hizalanır.

Bir paragrafa birden fazla stil ekleme

Bir paragrafa birden fazla stil eklemek için AnnotatedString içinde ParagraphStyle kullanabilirsiniz. Bu, keyfi ek açıklama stilleriyle ek açıklama eklenebilir. Metninizin bir kısmı ParagraphStyle ile işaretlendiğinde, bu kısım başlangıç ve son satır beslemeleri varmış gibi kalan metinden ayrılır.

Metne birden fazla stil ekleme hakkında daha fazla bilgi için Metne birden fazla stil ekleme başlıklı makaleyi inceleyin.

AnnotatedString, oluşturmayı kolaylaştırmak için tür açısından güvenli bir oluşturucu içerir: buildAnnotatedString. Aşağıdaki snippet'te, ParagraphStyle değerini ayarlamak için buildAnnotatedString kullanılır:

@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

Satır yüksekliğini ve dolguyu ayarlama

includeFontPadding, bir metnin ilk satırının üst kısmındaki ve son satırının alt kısmındaki yazı tipi metriklerini temel alan ek dolgu ekleyen eski bir mülktür. 2024.01.01 sürümünden itibaren includeFontPadding, varsayılan olarak false olarak ayarlanır. Bu sayede varsayılan metin düzeni, yaygın tasarım araçlarıyla daha uyumlu hale gelir.

lineHeight yapılandırması Android Q'den beri mevcuttur. Satır yüksekliğini her metin satırına dağıtan lineHeight parametresini kullanarak Text için lineHeight'ü yapılandırabilirsiniz. Ardından, bu metnin alanda nasıl hizalanacağını daha ayrıntılı şekilde yapılandırmak ve boşlukları kaldırmak için yeni LineHeightStyle API öğesini kullanabilirsiniz.

Daha yüksek hassasiyet için lineHeight değerini "sp" (ölçeklendirilmiş piksel) yerine "em" (göreceli yazı tipi boyutu) metin birimini kullanarak ayarlamak isteyebilirsiniz. Uygun bir metin birimi seçme hakkında daha fazla bilgi için TextUnit başlıklı makaleyi inceleyin.

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'ü ayarlamaya ek olarak artık LineHeightStyle deneysel API ile yapılandırmaları kullanarak metni daha da ortalayabilir ve biçimlendirebilirsiniz: LineHeightStyle.Alignment ve LineHeightStyle.Trim (Trim'in çalışması için includeFontPadding, false olarak ayarlanmalıdır). Hizalama ve Kırpma, tek bir metin satırı ve metin bloğunun üst satırı dahil olmak üzere tüm satırlara daha uygun şekilde dağıtmak için metin satırları arasındaki ölçülen alanı kullanır.

LineHeightStyle.Alignment, satırın satır yüksekliği tarafından sağlanan alanda nasıl hizalanacağını tanımlar. Her satırda metni üste, alta, ortada veya orantılı olarak hizalayabilirsiniz. LineHeightStyle.Trim, lineHeight ve Hizalama ayarlarından kaynaklanan, metninizin ilk satırının üst kısmına ve son satırının alt kısmına eklenen fazladan boşluğu bırakmanıza veya kaldırmanıza olanak tanır. Aşağıdaki örneklerde, hizalama ortada (LineHeightStyle.Alignment.Center) olduğunda çok satırlık metnin çeşitli LineHeightStyle.Trim yapılandırmalarıyla nasıl göründüğü gösterilmektedir.

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

Bu değişikliğin bağlamı, includeFontPadding'nin Görüntüleme sisteminde nasıl çalıştığı ve Oluştur ile yeni LineHeightStyle API'ler için yapılan değişiklikler hakkında daha fazla bilgi edinmek için Metin Oluşturma'da Yazı Tipi Boşluğu Düzeltme blog yayınını inceleyin.

Satır sonu ekleme

LineBreak API, metnin birden fazla satıra bölündüğü ölçütleri tanımlar. Text bileşeninizin TextStyle bloğunda istediğiniz satır bölme türünü belirtebilirsiniz. Önceden ayarlanmış satır bölme türleri şunlardır:

• Simple: Hızlı, temel satır sonu. Metin giriş alanları için önerilir.
• Heading: Daha gevşek satır sonu kurallarıyla satır sonu. Başlıklar gibi kısa metinler için önerilir.
• Paragraph: Okunabilirliği artırmak için daha yavaş ve daha kaliteli satır bölme. Paragraflar gibi daha büyük metin miktarları için önerilir.

Aşağıdaki snippet, uzun bir metin bloğunda satır bölme davranışını belirtmek için hem Simple hem de Paragraph kullanır:

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

Yukarıdaki çıktıda, Paragraph satır bölme davranışının Simple satır bölme davranışına kıyasla görsel olarak daha dengeli bir sonuç oluşturduğunu görebilirsiniz.

Satır sonlarını özelleştirme

Strategy parametresini kullanarak kendi LineBreak yapılandırmanızı da oluşturabilirsiniz. Strategy aşağıdakilerden biri olabilir:

• Balanced: Metnin satır uzunluklarını dengelemeye çalışır ve etkinse otomatik tire ekleme özelliğini de uygular. Gösterilen metin miktarını en üst düzeye çıkarmak için kol saatleri gibi küçük ekranlarda önerilir.
• HighQuality: Etkinleştirilmişse satır başı ekleme dahil olmak üzere bir paragrafı daha okunaklı metinler için optimize eder. (Balanced veya Simple olmayan her şey için varsayılan olmalıdır.)
• Simple: Temel, hızlı strateji. Bu seçenek etkinleştirilirse tireleme yalnızca tek başına bir satıra sığmayan kelimeler için yapılır. Yazarken konum değiştirmemek için metin düzenlemede kullanışlıdır.

Aşağıdaki snippet'te, varsayılan ayarlara sahip bir paragraf ile Balanced satır bölme stratejisiyle küçük ekranlar için optimize edilmiş bir paragraf arasındaki fark gösterilmektedir:

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 ile ilgili dikkat edilmesi gereken noktalar

LineBreak'yi, özellikle CJK dilleri için tasarlanmış Strictness ve WordBreak API'leriyle de özelleştirebilirsiniz. Bu API'lerin etkilerini CJK dışındaki dillerde her zaman göremeyebilirsiniz. Satır bölme kuralları genel olarak yerel ayara göre tanımlanır.

Strictness, satır bölme işleminin katılığını aşağıdaki özelliklerle açıklar:

• Default: Yerel ayar için varsayılan satır bölme kuralları. Normal veya Strict ile eşleşebilir.
• Loose: En az kısıtlayıcı kurallar. Kısa satırlar için uygundur.
• Normal: Satır sonlandırmayla ilgili en yaygın kurallar.
• Strict: Satır sonlandırmayla ilgili en katı kurallar.

WordBreak, aşağıdaki özelliklerle kelimelere satır aralarının nasıl ekleneceğini tanımlar:

• Default: Yerel ayar için varsayılan satır bölme kuralları.
• Phrase: Satır sonları kelime öbeklerine göre belirlenir.

Aşağıdaki snippet'te, Japonca bir metin için Strict katılık ve Phrase kelime bölme ayarı kullanılmaktadır:

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

Satırlara bölünmüş metni tire ile ayırma

Hyphens API, uygulamanıza tireleme desteği eklemenize olanak tanır. Tireleme, bir kelimenin metin satırları arasında bölündüğünü belirtmek için kısa çizgi benzeri bir noktalama işareti eklemeyi ifade eder. Etkinleştirildiğinde, uygun satır ayırma noktalarında bir kelimenin heceleri arasına satır ayırma işareti eklenir.

Tireleme varsayılan olarak etkin değildir. Kelime ayırmayı etkinleştirmek için TextStyle bloğuna parametre olarak Hyphens.Auto ekleyin:

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

Etkinleştirildiğinde kısa çizgi yalnızca aşağıdaki koşullarda kullanılır:

• Bir kelime bir satıra sığmaz. Simple satır bölme stratejisi kullanıyorsanız bir kelimenin tirelenmesi yalnızca satır tek kelimeden kısaysa gerçekleşir.
• Uygun kısa çizgi, sistemdeki sözlükler kullanılarak belirlendiğinden cihazınızda uygun yerel ayar ayarlanır.