शैली पैराग्राफ़

इस पेज पर बताया गया है कि अपने . पैराग्राफ़-लेवल स्टाइलिंग को सेट करने के लिए, पैरामीटर कॉन्फ़िगर किए जा सकते हैं, जैसे कि 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.Left के बजाय TextAlign.Start और TextAlign.End का इस्तेमाल कर रहा है और TextAlign.Right का इस्तेमाल किया जाता है, क्योंकि वे Text के दाएं किनारे पर होते हैं पसंदीदा भाषा के टेक्स्ट ओरिएंटेशन के आधार पर बनाया जा सकता है. उदाहरण के लिए, TextAlign.End फ़्रेंच लेख के लिए दाईं ओर और बाईं ओर संरेखित है अरबी टेक्स्ट के लिए, लेकिन TextAlign.Right दाईं ओर अलाइन होता है, चाहे वह कुछ भी हो अंग्रेज़ी वर्णमाला का इस्तेमाल किया जाता है.

ध्यान दें: टेक्स्ट अलाइनमेंट, लेआउट अलाइनमेंट से अलग है, जो कंटेनर में कंपोज़ेबल को सेट करना, जैसे कि Row या Column. ज़्यादा के लिए ज़्यादा जानकारी के लिए, लेआउट की बुनियादी बातें लिखना लेख पढ़ें.

पैराग्राफ़ में एक से ज़्यादा स्टाइल जोड़ना

किसी पैराग्राफ़ में एक से ज़्यादा स्टाइल जोड़ने के लिए, ParagraphStyle का इस्तेमाल AnnotatedString, जिसे आर्बिट्रेरी एनोटेशन की स्टाइल के साथ एनोटेट किया जा सकता है. जब आपके टेक्स्ट के किसी हिस्से को ParagraphStyle से मार्क किया जाता है, तो वह हिस्सा बाकी टेक्स्ट से अलग हुए हों, जैसे कि शुरुआत में लाइन फ़ीड थे और खत्म.

टेक्स्ट में एक से ज़्यादा स्टाइल जोड़ने के बारे में ज़्यादा जानने के लिए, देखें टेक्स्ट में एक से ज़्यादा स्टाइल जोड़ें.

AnnotatedString में टाइप-सेफ़” है बिल्डर इसे आसानी से बनाने के लिए: buildAnnotatedString. यह स्निपेट, ParagraphStyle सेट करने के लिए 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

लाइन की ऊंचाई और पैडिंग (जगह) अडजस्ट करें

includeFontPadding एक लेगसी प्रॉपर्टी है, जो टेक्स्ट की पहली लाइन के ऊपर और आखिरी लाइन के सबसे नीचे मौजूद फ़ॉन्ट मेट्रिक. कंपोज़ बीओएम वर्शन 2024.01.01 से शुरू करते हुए, includeFontPadding सेट हो गया है डिफ़ॉल्ट रूप से false पर सेट करता है, जो डिफ़ॉल्ट टेक्स्ट लेआउट को सामान्य डिज़ाइन टूल.

lineHeight को कॉन्फ़िगर करने की सुविधा नई नहीं है– यह उपलब्ध है Android Q के बाद से Text के लिए lineHeight को कॉन्फ़िगर करने के लिए, इनका इस्तेमाल करें: lineHeight पैरामीटर, जो इसकी हर लाइन में लाइन की ऊंचाई को डिस्ट्रिब्यूट करता है टेक्स्ट. इसके बाद, कॉन्फ़िगर करने के लिए नए LineHeightStyle API का इस्तेमाल करें इस टेक्स्ट को स्पेस में कैसे अलाइन करें और खाली सफ़ेद जगह हटाएं.

lineHeight में बदलाव करने के लिए, टेक्स्ट यूनिट “em” (रिलेटिव फ़ॉन्ट) का इस्तेमाल करें सटीक होने के लिए, “sp” (स्केल किए गए पिक्सल) की जगह पर साइज़). इसके बारे में ज़्यादा जानकारी पाने के लिए, सही टेक्स्ट यूनिट चुनकर, TextUnit देखें.

पहली इमेज. सेट lineHeight में टेक्स्ट को अडजस्ट करने के लिए, अलाइनमेंट और ट्रिम का इस्तेमाल करें. साथ ही, ज़रूरत पड़ने पर, ज़रूरत के हिसाब से टेक्स्ट में काट-छांट करें.

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 एक्सपेरिमेंटल एपीआई के साथ कॉन्फ़िगरेशन का इस्तेमाल करके: LineHeightStyle.Alignment और LineHeightStyle.Trim (includeFontPadding को false पर सेट करना ज़रूरी है, ताकि काट-छांट करके, ऑफ़िस के पते पर लाएं). अलाइनमेंट और ट्रिम, टेक्स्ट को सभी लाइनों में सही तरीके से डिस्ट्रिब्यूट करना ज़रूरी है. इसमें एक लाइन भी शामिल है टेक्स्ट के एक हिस्से से शुरू होता है.

LineHeightStyle.Alignment से पता चलता है कि स्पेस में लाइन कैसे अलाइन करें लाइन की ऊंचाई से मिलता है. हर पंक्ति में, आप टेक्स्ट को ऊपर, नीचे, बीच में या अनुपात के हिसाब से. इसके बाद, LineHeightStyle.Trim आपको पहली पंक्ति के ऊपर और स्क्रीन के निचले हिस्से के अतिरिक्त स्पेस को छोड़ने या हटाने के लिए आपके टेक्स्ट की आखिरी लाइन, जो किसी भी lineHeight और अलाइनमेंट से जनरेट होती है में बदलाव कर सकते हैं. ये सैंपल दिखाते हैं कि कई लाइन वाला टेक्स्ट कैसा दिखता है अलाइनमेंट के बीच में होने पर, अलग-अलग LineHeightStyle.Trim कॉन्फ़िगरेशन (LineHeightStyle.Alignment.Center).

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

चेतावनी: LineHeightStyle एपीआई (काट-छांट करने) का इस्तेमाल करके किए गए ये बदलाव, सिर्फ़ काम कर सकते हैं जब उन्हें कॉन्फ़िगरेशन includeFontPadding = false.

के साथ इस्तेमाल किया जाता है

जानने के लिए, 'टेक्स्ट लिखें' में फ़ॉन्ट पैडिंग को ठीक करना ब्लॉग पोस्ट देखें इस बदलाव की वजह के बारे में ज़्यादा जानकारी, जैसे कि includeFontPadding ने व्यू में कैसे काम किया और Compose और नए LineHeightStyle में किए गए बदलाव एपीआई.

लाइन ब्रेक डालें

LineBreak एपीआई उस शर्त के बारे में बताता है जिसके हिसाब से टेक्स्ट को बांटा जाता है जानकारी दें. आप आपके Text कंपोज़ेबल में से TextStyle ब्लॉक. प्रीसेट लाइन ब्रेकिंग टाइप निम्नलिखित शामिल करें:

• 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 लाइन ब्रेकिंग की तुलना में, विज़ुअल तौर पर ज़्यादा संतुलित नतीजा है.

लाइन ब्रेक को पसंद के मुताबिक बनाएं

Strategy की मदद से, अपना खुद का LineBreak कॉन्फ़िगरेशन भी बनाया जा सकता है पैरामीटर. Strategy इनमें से कोई भी हो सकता है:

• Balanced — टेक्स्ट की लाइन की लंबाई के बीच संतुलन बनाने की कोशिश करता है. साथ ही, लागू करने की कोशिश करता है अगर सुविधा चालू हो, तो अपने-आप हाइफ़न. छोटी स्क्रीन, जैसे कि स्मार्टवॉच के लिए इसका सुझाव दिया जाता है टेक्स्ट को ज़्यादा से ज़्यादा बड़ा किया जा सके.
• HighQuality — यह सुविधा, आसानी से पढ़े जा सकने वाले टेक्स्ट के लिए पैराग्राफ़ को ऑप्टिमाइज़ करती है. इसमें ये शामिल हैं अगर हायफ़नेशन चालू है, तो उसे डालें. (उन सभी चीज़ों के लिए डिफ़ॉल्ट होना चाहिए जो Balanced या Simple.)
• Simple — बुनियादी और तेज़ रणनीति. अगर यह सुविधा चालू है, तो हाइफ़न (-) ऐसे शब्द जो पूरी लाइन में फ़िट नहीं होते. टेक्स्ट में बदलाव करने में मदद मिलती है ताकि टाइप करते समय जगह बदलने से बचा जा सके.

ध्यान दें: Strictness की मदद से, लाइन ब्रेक करने के तरीके को अपनी पसंद के मुताबिक बनाया जा सकता है और WordBreak पैरामीटर. ये पैरामीटर सीजेके भाषाओं के लिए डिज़ाइन किए गए हैं, और सीजेके को छोड़कर अन्य भाषाओं के लिए इस्तेमाल करने से, हो सकता है कि आपको सही असर न दिखे. इसके लिए ज़्यादा जानकारी के लिए, सीजेके से जुड़ी ज़रूरी बातें देखें.

नीचे दिया गया स्निपेट, डिफ़ॉल्ट सेटिंग वाले पैराग्राफ़ के बीच का अंतर दिखाता है और एक ऐसा पैराग्राफ़ जो छोटी स्क्रीन के लिए ऑप्टिमाइज़ किया गया हो, जिसमें 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

दूसरी इमेज. ऐसा पैराग्राफ़ जिसे Balanced लाइन ब्रेकिंग रणनीति के साथ फ़ॉर्मैट किया गया हो (ऊपर) बनाम लाइन ब्रेकिंग रणनीति के बिना फ़ॉर्मैट किए गए पैराग्राफ़.

CJK के लिए ध्यान रखने वाली बातें

LineBreak को Strictness के साथ पसंद के मुताबिक भी बनाया जा सकता है और WordBreak एपीआई, जिन्हें खास तौर पर सीजेके भाषाओं के लिए डिज़ाइन किया गया था. यह मुमकिन है कि आपको सीजेके से बाहर की भाषाओं में, इन एपीआई का असर हमेशा न दिखे. कुल मिलाकर, लाइन ब्रेकिंग नियम, स्थान-भाषा के आधार पर तय किए जाते हैं.

Strictness में, लाइन ब्रेक की सख्ती के बारे में बताया गया है. इसके लिए, यहां दिए गए तरीके इस्तेमाल किए गए हैं प्रॉपर्टी:

ध्यान दें: 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

तीसरी इमेज. Strictness और WordBreak सेटिंग के साथ फ़ॉर्मैट किया गया टेक्स्ट (सबसे ऊपर) बनाम सिर्फ़ LineBreak.Heading (सबसे नीचे) के साथ फ़ॉर्मैट किए गए टेक्स्ट की तुलना करें.

पंक्तियों में बंटे हुए टेक्स्ट का हाइफ़न

Hyphens एपीआई की मदद से, अपने ऐप्लिकेशन में हाइफ़न का इस्तेमाल किया जा सकता है. हाइफ़नेशन का मतलब है, डैश जैसा विराम चिह्न शामिल करना. इससे यह पता चलता है कि शब्द को टेक्स्ट की लाइनों में बांटा जाता है. यह सुविधा चालू होने पर, बीच-बीच में आने वाले हाइफ़न को जोड़ा जाता है किसी शब्द के अक्षरों को, सही हाइफ़निंग पॉइंट पर लिखें.

डिफ़ॉल्ट रूप से, हाइफ़न लगाने की सुविधा चालू नहीं होती. हायफ़नेशन को चालू करने के लिए, जोड़ें TextStyle ब्लॉक में पैरामीटर के तौर पर 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

चौथी इमेज. जिस पैराग्राफ़ में हाइफ़न का इस्तेमाल करने की सुविधा चालू नहीं है (सबसे ऊपर) बनाम ऐसा पैराग्राफ़ हाइफ़नेशन की सुविधा को चालू करें (नीचे).

यह सुविधा चालू होने पर, हाइफ़न (-) डालने की सुविधा सिर्फ़ इन शर्तों के तहत काम करती है:

• कोई शब्द, लाइन में फ़िट नहीं हो रहा. अगर Simple लाइन ब्रेक करने की रणनीति का इस्तेमाल किया जाता है, तो किसी शब्द का हायफ़नेशन सिर्फ़ तब होता है, जब कोई लाइन किसी एक शब्द से छोटी हो शब्द.
• आपके डिवाइस पर सही स्थान-भाषा सेट हो, क्योंकि इसके लिए सही हाइफ़न मौजूद है सिस्टम पर मौजूद शब्दकोशों का इस्तेमाल करके तय किया जाता है.