نمط الفقرة

توضح هذه الصفحة كيف يمكنك اختيار تصميم نص فقرة. لضبط التنسيق على مستوى الفقرة، يمكنك ضبط مَعلمات مثل textAlign وlineHeight أو تحديد ParagraphStyle خاص بك.

ضبط محاذاة النص

تتيح لك المعلمة textAlign ضبط الوضع الأفقي محاذاة نص ضمن مساحة مساحة Text قابلة للإنشاء.

بشكل تلقائي، سيختار Text محاذاة النص الطبيعية بناءً على قيمة المحتوى:

  • الحافة اليسرى لحاوية Text للأبجديات التي تُكتب من اليسار إلى اليمين، مثل اللاتينية أو السيريلية أو الهانغول
  • الحافة اليمنى لحاوية Text للأحرف الأبجدية من اليمين إلى اليسار مثل العربية أو العبرية

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

الكلمات

إذا أردت ضبط محاذاة النص يدويًا في عنصر 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")
            }
        }
    )
}

ثلاث فقرات بثلاثة أساليب مختلفة: الأزرق والأحمر والأسود المميّز

ضبط ارتفاع السطر والمساحة المتروكة

includeFontPadding هو موقع قديم يضيف مساحة متروكة إضافية استنادًا إلى مقاييس الخط أعلى السطر الأول وأسفل السطر الأخير من النص. اعتبارًا من الإصدار 2024.01.01 من Compose BOM، يتم ضبط includeFontPadding على false تلقائيًا، ما يجعل تنسيق النص التلقائي أكثر توافقًا مع أدوات التصميم الشائعة.

إنّ إمكانية ضبط lineHeight ليست جديدة، ولكنها متوفرة. منذ Android Q. يمكنك إعداد lineHeight لـ Text باستخدام معلَمة lineHeight، توزّع ارتفاع السطر في كل سطر من النص. يمكنك بعد ذلك استخدام الرمز الجديد LineHeightStyle API لضبط المزيد من الإعدادات المتعلقة بكيفية محاذاة هذا النص داخل المساحة وإزالة المسافات البيضاء.

قد تحتاج إلى تعديل lineHeight باستخدام وحدة النص "em" (حجم الخط النسبي) بدلاً من "sp" (وحدات البكسل المُقَرَّرة) لتحسين الدقة. لمزيد من المعلومات عن لاختيار وحدة نصية مناسبة، راجِع TextUnit.

صورة تعرض lineHeight كقياس استنادًا إلى الخطوط فوقها وتحتها مباشرةً
الشكل 1. استخدِم "المحاذاة" و"القطع" لتعديل النص ضمن المجموعة 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.None LineHeightStyle.Trim.Both
صورة تعرض LineHeightStyle.Trim.FirstLineTop صورة توضّح LineHeightStyle.Trim.LastLineBottom
LineHeightStyle.Trim.FirstLineTop LineHeightStyle.Trim.LastLineBottom

يمكنك الاطّلاع على مشاركة المدونة حول إصلاح مساحة الخط المتروكة في نص Compose للتعلّم. مزيد من المعلومات حول سياق هذا التغيير، وطريقة عمل includeFontPadding في العرض والتغييرات التي تم إجراؤها على ميزة Compose والإصدار الجديد LineHeightStyle. واجهات برمجة التطبيقات.

إدراج فواصل أسطر

تحدِّد واجهة برمجة التطبيقات 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
                )
            )
        }
    )
)

كتلة نصية تعرض استراتيجية بسيطة لفصل الأسطر مقابل نص
  باستخدام استراتيجية فاصلة محسّنة للفقرات. تتسم مجموعة النصوص التي تستخدم استراتيجية علامات الترقيم البسيطة للفاصل بين الأسطر بتنوع أكبر في أطوال الأسطر.
الشكل 1. كتلة نصية مع استراتيجية تقسيم الأسطر البسيطة (الأعلى) مقابل نص مع فاصل أسطر محسَّن للفقرات (أسفل الصفحة).

في الإخراج أعلاه، لاحِظ أن سلوك كسر الأسطر 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
            )
        }
    )
)

فقرة تحتوي على استراتيجية فاصلة متوازنة وفقرة
  تنسيقها بدون استراتيجية. الفقرة التي يفصل بينها خط متوازن
  تحتوي على أطوال أسطر أكثر اتساقًا من الإستراتيجية الافتراضية.
الشكل 2. تم تنسيق فقرة باستخدام استراتيجية تقسيم الأسطر Balanced. (في الأعلى) مقابل فقرة منسّقة بدون استراتيجية لتقسيم الأسطر

اعتبارات متعلقة بالحروف الصينية واليابانية والكورية

يمكنك أيضًا تخصيص LineBreak باستخدام واجهات برمجة التطبيقات Strictness و WordBreak، اللتين تم تصميمهما خصيصًا للغات CJK. قد لا تظهر في بعض الأحيان تأثيرات واجهات برمجة التطبيقات هذه بلغات غير بلغة 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
    )
)

نص ياباني مع إعدادات التشدّد وWordBreak مقابل النص التلقائي.
الشكل 3. تم تنسيق النص بإعدادات Strictness وWordBreak (أعلى الصفحة) مقابل النص المنسَّق فقط باستخدام LineBreak.Heading (الأسفل).

إضافة واصلة بين أجزاء النص المُقسَّمة على أسطر

تتيح لك واجهة برمجة التطبيقات 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
                )
            )
        }
    )
)

فقرة بدون تفعيل ميزة تقسيم الكلمات إلى مقاطع فقرة مفعَّلة فيها ميزة تقسيم الكلمات إلى مقاطع
  عند تفعيل ميزة تقسيم الكلمات إلى مقاطع، يتم تقسيم الكلمة إلى مقاطع وعرضها على سطرين.
الشكل 4. فقرة بدون تفعيل ميزة "الفاصلة المنقوطة" (أعلى) مقارنةً بفقرة تفعيل ميزة "الفاصلة المنقوطة" (أسفل)

عند تفعيل ميزة تقسيم الكلمات، لا تحدث إلا في الحالات التالية:

  • لا تتناسب كلمة مع السطر. في حال استخدام استراتيجية Simple لفاصل الأسطر، لا يتم تقسيم الكلمة إلا إذا كان السطر أقصر من الكلمة الواحدة.
  • يتم ضبط اللغة المناسبة على جهازك، لأنّ علامات الفصل المناسبة يتم تحديدها باستخدام القواميس المتوفّرة على النظام.