Paragrafı biçimlendir

Bu sayfada, mesajınız için metnin stilini nasıl paragrafından emin olun. Paragraf düzeyinde stil ayarlamak için aşağıdaki gibi parametreleri yapılandırabilirsiniz: textAlign ve lineHeight veya kendi ParagraphStyle öğenizi tanımlayın.

Metin hizalamasını ayarlama

textAlign parametresi, yatay veya yatay hizalama metin, composable yüzey alanı içinde Text.

Varsayılan olarak Text, doğal metin hizalamasını içerik değeri:

• Soldan sağa alfabeler için Text kapsayıcısının sol kenarı. Örneğin: Latin, Kiril veya Hangul
• Sağdan sola alfabeler için Text kapsayıcısının sağ kenarıdır, örneğin Arapça veya İbranice

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

Text composable'ın metin hizalamasını manuel olarak ayarlamak isterseniz TextAlign.Left yerine TextAlign.Start ve TextAlign.End kullanılıyor Text sağ kenarına doğru ilerlerken sırasıyla TextAlign.Right tercih edilen dil metin yönüne bağlı olarak composable'dan derlenebilir. Örneğin, TextAlign.End, Fransızca metin için sağ tarafa, sol tarafa hizalanır Arapça metin için, ancak TextAlign.Right ne olursa olsun sağ tarafa hizalanıyor alfabe kullanılır.

Not: Metin hizalaması, ayrı bir yerleşim şekli olan bir Composable'ı Row veya Column gibi bir kapsayıcı içinde konumlandırmak. Daha fazla Oluşturma düzeni hakkında temel bilgiler başlıklı makaleyi inceleyin.

Paragrafa birden çok stil ekleme

Bir paragrafa birden çok stil eklemek için ParagraphStyle öğesini AnnotatedString. İsteğe bağlı ek açıklama stilleriyle ek açıklama eklenebilir. Metninizin bir bölümü ParagraphStyle ile işaretlendikten sonra başında satır feed'leri varmış gibi kalan metinden ayırıp dokunun.

Bir metne birden çok stil ekleme hakkında daha fazla bilgi için bkz. Metne birden çok stil ekleyin.

AnnotatedString, type-safe parametresini içeriyor derleyici kullanarak kolayca oluşturabilirsiniz: buildAnnotatedString. Aşağıdaki snippet, ParagraphStyle ayarlamak için buildAnnotatedString:

@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, ve son satırının altındaki yazı tipi metriklerini görebilirsiniz. Oluşturma BOM sürümü 2024.01.01 sürümünden itibaren includeFontPadding ayarlandı Varsayılan metin düzeni false ile daha uyumlu olur. yaygın tasarım araçları bulunuyor.

lineHeight yapılandırması yeni bir özellik değil, daha önce kullanıma sunuldu Android Q'dan beri Text için lineHeight hizmetini şu ayarı kullanarak yapılandırabilirsiniz: lineHeight parametresi kullanır ve bu parametre, metin. Ardından, daha fazla yapılandırma için yeni LineHeightStyle API kullanabilirsiniz nasıl hizalandığını kontrol edin ve boşlukları kaldırın.

lineHeight metin birimini "em" (göreli yazı tipi) kullanarak düzenleyebilirsiniz. (ölçeklendirilmiş pikseller) yerine "sp" (ölçeklendirilmiş pikseller) yerine daha yüksek hassasiyet sağlar. Daha fazla bilgi için uygun bir metin birimi seçmek için bkz. TextUnit.

Şekil 1. Metni gruplanan lineHeight içinde ayarlamak için Hizalama ve Kırpma özelliklerini kullanın ve gerekirse fazla boşluğu kırpın.

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 özelliğini ayarlamaya ek olarak artık metni ortalayabilir ve biçimlendirebilirsiniz LineHeightStyle deneysel API ile yapılandırmaları kullanarak: LineHeightStyle.Alignment ve LineHeightStyle.Trim (includeFontPadding değeri, şunun için false olarak ayarlanmalıdır: İş yerine kırpın). Hizalama ve Kırpma işlemi için resmin satırları arasındaki ölçülen alanı Böylece, metni tek bir satır da dahil olmak üzere tüm satırlara daha uygun şekilde dağıtabilirsiniz ve bir metin bloğunun en üst satırı görünür.

LineHeightStyle.Alignment, alandaki çizginin nasıl hizalanacağını tanımlar satır yüksekliği ile ifade edilir. Her satırda, metni tablodaki üst, alt, orta veya orantılı olarak gösterir. LineHeightStyle.Trim şunları yapmanıza olanak tanır: ilk satırın başına ve altındaki fazladan boşluğu metninizin herhangi bir lineHeight ve Hizalama'dan oluşturulan son satırı ayarlamalar yapabilirsiniz. Aşağıdaki örneklerde, çok satırlı metnin ortalandığında ortaya çıkan çeşitli LineHeightStyle.Trim yapılandırmaları (LineHeightStyle.Alignment.Center).

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

Uyarı: LineHeightStyle API'sini (Kırpma) kullanan bu düzenlemeler yalnızca geçerli olabilir bunları includeFontPadding = false. yapılandırmasıyla birlikte kullandığınızda

Daha fazla bilgi edinmek için Metni Oluştur'da Yazı Tipi Dolgusunu Düzeltme başlıklı blog yayınına bakın. includeFontPadding uygulamasının Görünüm'de nasıl çalıştığı hakkında daha fazla bilgi ve Compose ile yeni LineHeightStyle için yapılan değişiklikler API'ler.

Satır sonu ekle

LineBreak API, metnin hangi ölçütlere göre bölüneceğini tanımlar çok satırlı olabilir. İstediğiniz satır sonu türünü Text composable'ınızın TextStyle bloğu. Önceden belirlenmiş satır sonu türleri şunları içerir:

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

Aşağıdaki snippet, belirtilen değeri belirtmek için hem Simple hem de Paragraph kullanır uzun bir metin bloğunda satır sonu davranışı:

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

Şekil 1. Basit bir satır sonu stratejisine (üst) sahip metin bloğuna karşılık paragraf için optimize edilmiş satır sonu içeren metin bloğu (altta).

Yukarıdaki çıkışta, Paragraph satır sonu davranışının şu sonuçları verdiğine dikkat edin: Simple satır sonuna kıyasla görsel olarak daha dengeli bir sonuç elde edersiniz.

Satır sonlarını özelleştir

Ayrıca, Strategy ile kendi LineBreak yapılandırmanızı da oluşturabilirsiniz. parametresinden sonra bir değer girin. Strategy şunlardan herhangi biri olabilir:

• Balanced — Metnin satır uzunluklarını dengelemeye çalışır ve aynı zamanda şunları uygular: otomatik kısa çizgilemeyi kullanabilir. Kol saatleri gibi küçük ekranlar için önerilir. simgesini tıklayın.
• HighQuality — Bir paragrafı aşağıdaki gibi daha okunabilir metinler için optimize eder: tireye sokma. (Diğer tüm öğeler için varsayılan değer olmalıdır: Balanced veya Simple.)
• Simple: Temel ve hızlı strateji. Etkinleştirilirse, tireye ayırma işlemi yalnızca tek başına bir satıra sığmayan kelimeler. Metin düzenlerken kullanışlıdır Böylece, yazarken konumun değişmemesini sağlayabilirsiniz.

ziyaret edin.

Not: Satır sonu davranışınızı Strictness ile de özelleştirebilirsiniz. ve WordBreak parametreleri. Bu parametreler CJK dilleri için tasarlanmıştır ve CJK dışındaki dillerde kullanırsanız amaçlanan etkiyi göremeyebilirsiniz. Örneğin, Daha fazla bilgi için CJK ile ilgili dikkat edilmesi gereken noktalar başlıklı makaleyi inceleyin.

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

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

Şekil 2. Balanced satır sonu stratejisi ile biçimlendirilmiş bir paragraf (üstte) yer alır.

CJK ile ilgili dikkat edilmesi gereken noktalar

Ayrıca LineBreak öğesini Strictness ve WordBreak API'ler, CJK dilleri için özel olarak tasarlanmıştır. CJK dışındaki dillerde bu API'lerin etkilerini her zaman göremeyebilirsiniz. Genel olarak, satır sonu kuralları yerel ayara göre tanımlanır.

Strictness, aşağıdaki değerlerde satır sonunun güvenlik düzeyini açıklar özellikler:

Not: Strictness için varsayılan önerilen değer yerel ayara göre değişir.

• Default — Yerel ayar için varsayılan kırma kuralları. Normal ile karşılık gelebilir veya Strict.
• Loose: En az kısıtlayıcı olan kurallar. Kısa hatlar için uygundur.
• Normal: Satır sonuyla ilgili en yaygın kurallardır.
• Strict: Satır sonuyla ilgili en katı kurallar.

WordBreak, şu özellikleri kullanın:

• Default — Yerel ayar için varsayılan kırma kuralları.
• Phrase — Satır sonu, kelime öbeklerine dayalıdır.

Aşağıdaki snippet'te Strict güvenlik düzeyi ve Phrase kelime engelleme kullanılıyor Japonca metin için ayar:

Not: Aşağıdaki snippet'i test etmek için cihazınızda Japonca yerel ayarı seçin (Ayarlar > Sistem > Diller ve Giriş > Diller > Japonca).

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

Şekil 3. Metin, Strictness ve WordBreak ayarlarıyla biçimlendirilmiş (üst) ve yalnızca LineBreak.Heading (alt) ile biçimlendirilmiş metin arasındaki farkları karşılaştırın.

Metni satırlara bölerek kısa çizgi oluşturma

Hyphens API, uygulamanıza tire desteği eklemenize olanak tanır. Kısa çizgi, belirli bir yerin mevcut kelime satırlarına bölünür. Etkinleştirildiğinde, aralarına tire işareti eklenir bir kelimenin hecelerini uygun kısa çizgilerle ayırın.

Kısa çizgilendirme varsayılan olarak etkin değildir. Kısaltmayı etkinleştirmek için TextStyle bloğunda parametre olarak Hyphens.Auto:

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

Şekil 4. Tirelemenin etkin olmadığı bir paragraf ile bir paragrafın karşılaştırılması (üst) .

Tireleme özelliği etkinleştirildiğinde yalnızca aşağıdaki koşullarda gerçekleşir:

• Bir kelime satıra sığmıyor. Simple satır sonu stratejisi kullanıyorsanız bir kelime kısa çizgiden oluşursa satır tek bir kelimeden kısa olduğunda görülür kelime.
• Cihazınızda uygun tirelemeye uygun yerel ayar sistemde bulunan sözlükleri kullanarak belirlenir.

ziyaret edin.