इस पेज में बताया गया है कि अपने
. पैराग्राफ़-लेवल स्टाइलिंग को सेट करने के लिए, पैरामीटर कॉन्फ़िगर किए जा सकते हैं, जैसे कि
textAlign
और lineHeight
या अपना ParagraphStyle
बताएं.
टेक्स्ट अलाइनमेंट सेट करें
textAlign
पैरामीटर की मदद से, हॉरिज़ॉन्टल
इसका अलाइनमेंट
Text
कंपोज़ेबल सरफ़ेस एरिया में मौजूद टेक्स्ट.
डिफ़ॉल्ट रूप से, Text
टेक्स्ट की स्टाइल के हिसाब से, नैचुरल टेक्स्ट अलाइनमेंट चुनेगा
कॉन्टेंट की वैल्यू:
- जैसे कि बाएं से दाएं के अक्षरों के लिए,
Text
कंटेनर का बायां किनारे लैटिन, सिरिलिक या हंगुल - जैसे, दाएं-से-बाएं अक्षरों के लिए
Text
कंटेनर का दायां किनारा ऐरेबिक या हिब्रू
@Composable fun CenterText() { Text( "Hello World", textAlign = TextAlign.Center, modifier = Modifier.width(150.dp) ) }
अगर आपको किसी Text
कंपोज़ेबल के टेक्स्ट अलाइनमेंट को मैन्युअल तरीके से सेट करना है, तो
TextAlign.Left
के बजाय TextAlign.Start
और TextAlign.End
का इस्तेमाल कर रहा है और
TextAlign.Right
का इस्तेमाल किया जाता है, क्योंकि वे Text
के दाएं किनारे पर होते हैं
पसंदीदा भाषा के टेक्स्ट ओरिएंटेशन के आधार पर बनाया जा सकता है. उदाहरण के लिए,
TextAlign.End
फ़्रेंच लेख के लिए दाईं ओर और बाईं ओर संरेखित है
अरबी टेक्स्ट के लिए, लेकिन TextAlign.Right
दाईं ओर अलाइन होता है, चाहे वह कुछ भी हो
अंग्रेज़ी वर्णमाला का इस्तेमाल किया जाता है.
पैराग्राफ़ में एक से ज़्यादा स्टाइल जोड़ना
किसी पैराग्राफ़ में एक से ज़्यादा स्टाइल जोड़ने के लिए, 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") } } ) }
लाइन की ऊंचाई और पैडिंग (जगह) अडजस्ट करें
includeFontPadding
एक लेगसी प्रॉपर्टी है, जो
टेक्स्ट की पहली लाइन के ऊपर और आखिरी लाइन के सबसे नीचे मौजूद फ़ॉन्ट मेट्रिक.
कंपोज़ बीओएम वर्शन 2024.01.01
से शुरू करते हुए, includeFontPadding
सेट हो गया है
डिफ़ॉल्ट रूप से false
पर सेट करता है, जो डिफ़ॉल्ट टेक्स्ट लेआउट को
सामान्य डिज़ाइन टूल.
lineHeight
को कॉन्फ़िगर करने की सुविधा नई नहीं है– यह उपलब्ध है
Android Q के बाद से Text
के लिए lineHeight
को कॉन्फ़िगर करने के लिए, इनका इस्तेमाल करें:
lineHeight
पैरामीटर, जो इसकी हर लाइन में लाइन की ऊंचाई को डिस्ट्रिब्यूट करता है
टेक्स्ट. इसके बाद, कॉन्फ़िगर करने के लिए नए LineHeightStyle API
का इस्तेमाल करें
इस टेक्स्ट को स्पेस में कैसे अलाइन करें और खाली सफ़ेद जगह हटाएं.
lineHeight
में बदलाव करने के लिए, टेक्स्ट यूनिट “em” (रिलेटिव फ़ॉन्ट) का इस्तेमाल करें
सटीक होने के लिए, “sp” (स्केल किए गए पिक्सल) की जगह पर साइज़). इसके बारे में ज़्यादा जानकारी पाने के लिए,
सही टेक्स्ट यूनिट चुनकर, TextUnit
देखें.
![इमेज के ठीक ऊपर और नीचे की लाइनों के आधार पर, लाइन की ऊंचाई को मेज़रमेंट के तौर पर दिखाया जा रहा है.](https://developer.android.com/static/develop/ui/compose/images/text-lineheightv3.png?authuser=9&hl=hi)
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 ) ) ) )
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 |
जानने के लिए, 'टेक्स्ट लिखें' में फ़ॉन्ट पैडिंग को ठीक करना ब्लॉग पोस्ट देखें
इस बदलाव की वजह के बारे में ज़्यादा जानकारी, जैसे कि 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 ) ) } ) )
![टेक्स्ट की तुलना में आसानी से लाइन ब्रेक करने की रणनीति दिखाने वाला टेक्स्ट ब्लॉक
ब्लॉक करने के लिए, पैराग्राफ़ के ऑप्टिमाइज़ की गई ब्रेकिंग रणनीति का इस्तेमाल करें. आसान टेक्स्ट वाला टेक्स्ट ब्लॉक
लाइन ब्रेक करने की रणनीति में, लाइन की लंबाई में ज़्यादा फ़र्क़ होता है.](https://developer.android.com/static/develop/ui/compose/images/text/simple-paragraph.png?authuser=9&hl=hi)
ऊपर दिए गए आउटपुट में ध्यान दें कि Paragraph
से लाइन ब्रेक करने से,
Simple
लाइन ब्रेकिंग की तुलना में, विज़ुअल तौर पर ज़्यादा संतुलित नतीजा है.
लाइन ब्रेक को पसंद के मुताबिक बनाएं
Strategy
की मदद से, अपना खुद का LineBreak
कॉन्फ़िगरेशन भी बनाया जा सकता है
पैरामीटर. 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 ) } ) )
![एक पैराग्राफ़ में लाइन ब्रेक करने की संतुलित रणनीति और एक पैराग्राफ़ में
बिना किसी रणनीति के फ़ॉर्मैट किया गया. संतुलित पंक्ति ब्रेकिंग वाला पैराग्राफ़
रणनीति में लाइन की लंबाई डिफ़ॉल्ट से ज़्यादा एक जैसी है.](https://developer.android.com/static/develop/ui/compose/images/text/balanced-default.png?authuser=9&hl=hi)
Balanced
लाइन ब्रेकिंग रणनीति के साथ फ़ॉर्मैट किया गया हो
(ऊपर) बनाम लाइन ब्रेकिंग रणनीति के बिना फ़ॉर्मैट किए गए पैराग्राफ़.CJK के लिए ध्यान रखने वाली बातें
LineBreak
को Strictness
के साथ पसंद के मुताबिक भी बनाया जा सकता है और
WordBreak
एपीआई, जिन्हें खास तौर पर सीजेके भाषाओं के लिए डिज़ाइन किया गया था.
यह मुमकिन है कि आपको सीजेके से बाहर की भाषाओं में, इन एपीआई का असर हमेशा न दिखे. कुल मिलाकर,
लाइन ब्रेकिंग नियम, स्थान-भाषा के आधार पर तय किए जाते हैं.
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 ) )
![डिफ़ॉल्ट टेक्स्ट की तुलना में, सख्ती और WordBreak की सेटिंग वाला जैपनीज़ टेक्स्ट.](https://developer.android.com/static/develop/ui/compose/images/text/cjk-line-break.png?authuser=9&hl=hi)
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 ) ) } ) )
![एक पैराग्राफ़ जिसमें हाइफ़न डालने की सुविधा चालू हो और एक पैराग्राफ़ में हाइफ़न लगाने की सुविधा चालू हो.
जब हायफ़नेशन चालू होता है, तो शब्द को हाइफ़न लगाकर दो लाइनों में बांटा जाता है.](https://developer.android.com/static/develop/ui/compose/images/text/hyphens.png?authuser=9&hl=hi)
यह सुविधा चालू होने पर, हाइफ़न (-) डालने की सुविधा सिर्फ़ इन शर्तों के तहत काम करती है:
- कोई शब्द, लाइन में फ़िट नहीं हो रहा. अगर
Simple
लाइन ब्रेक करने की रणनीति का इस्तेमाल किया जाता है, तो किसी शब्द का हायफ़नेशन सिर्फ़ तब होता है, जब कोई लाइन किसी एक शब्द से छोटी हो शब्द. - आपके डिवाइस पर सही स्थान-भाषा सेट हो, क्योंकि इसके लिए सही हाइफ़न मौजूद है सिस्टम पर मौजूद शब्दकोशों का इस्तेमाल करके तय किया जाता है.
आपके लिए सुझाव
- ध्यान दें: JavaScript बंद होने पर लिंक टेक्स्ट दिखता है
- टेक्स्ट की स्टाइल करना
- लेआउट की बुनियादी बातें लिखना
- Compose के लेआउट में इंट्रिंसिक मेज़रमेंट