ParagraphStyle — asosiy tushunchalar, xususiyatlar va qo'llanish

Tipografiyada ParagraphStyle nima

ParagraphStyle (paragraf uslubi) — bir yoki bir nechta matn paragraflariga qo'llaniladigan formatlash qoidalari to'plamidir. Alohida belgilar darajasida ishlaydigan belgi uslublaridan (bold, italic, font-size) farqli o'laroq, ParagraphStyle makro-xususiyatlarni boshqaradi: matnning konteynerda joylashishi, qatorlar va paragraflar orasidagi masofalar, yozuv yo'nalishi va ko'chirish qoidalari.

Tarixiy jihatdan, ParagraphStyle tushunchasi ish stoli nashriyot tizimlaridan (QuarkXPress, PageMaker, InDesign) kelib chiqqan bo'lib, har bir paragraf o'z parametrlar to'plamiga ega edi. Mobil ishlanmada bu yondashuv dasturiy API-larga aylantirildi: iOS'da NSMutableParagraphStyle, Android'da ParagraphStyle va LineBreakStyle sinflari, shuningdek Flutter'da textAlign va textHeightBehavior kabi parametrlar. Ularning barchasi bir vazifani hal qiladi — paragraf formatlashni boshqarish kod orqali, aniq matn dvigateliga bog'lanmagan holda.

Bringhurst — The Elements of Typographic Style (2024) ma'lumotlariga ko'ra, ParagraphStyle'ni to'g'ri konfiguratsiya qilish interfeysning tipografik madaniyatining asosidir. Agar shrift va o'lcham matnning „ovoziga" javob bersa, paragraf uslubi uning „nafasiga": ritm, pauza va urg'ularga javob beradi. Joy cheklangan mobil interfeyslarda to'g'ri ParagraphStyle o'qish qobiliyatini yo'qotmasdan ko'proq ma'lumotni joylashtirishga imkon beradi.

ParagraphStyle'ning asosiy xususiyatlari

ParagraphStyle bir nechta xususiyat guruhlarini o'z ichiga oladi, ularning har biri formatlashning ma'lum bir jihatiga javob beradi. Mobil API-larda mavjud bo'lgan asosiy parametrlarni ko'rib chiqaylik. Tekislash (alignment) — matnning gorizontal holatini belgilaydigan asosiy parametr. iOS'da NSTextAlignment, Android'da Layout.Alignment, Flutter'da TextAlign mavjud.

Shuni tushunish muhimki, barcha xususiyatlar barcha platformalarda bir xil hajmda mavjud emas. Masalan, birinchi qator chegarasi (firstLineHeadIndent) to'liq qo'llab-quvvatlanadi faqat iOS'da NSMutableParagraphStyle orqali. Android'da bu maqsadda LeadingMarginSpan bilan SpannableString, Flutter'da esa maxsus TextSpan va padding bilan RichText ishlatiladi. Platformalararo ishlanmada (Flutter, React Native) ParagraphStyle'ning ba'zi xususiyatlarini konteynerlar yoki Spacer orqali emulyatsiya qilish kerak bo'ladi.

iOS'da ParagraphStyle: NSMutableParagraphStyle

iOS'da paragraf uslubi bilan ishlash uchun asosiy vosita NSMutableParagraphStyle sinfi — NSParagraphStyle'dan meros oladi. U paragraf formatlashni boshqarish uchun to'liq xususiyatlar to'plamini taqdim etadi va NSAttributedString orqali qo'llaniladi. NSMutableParagraphStyle nafaqat UILabel va UITextView'da, balki Core Text'da CTParagraphStyle orqali ham qo'llaniladi.

// iOS: to'liq ParagraphStyle konfiguratsiyasi
let paragraphStyle = NSMutableParagraphStyle()

// Tekislash
paragraphStyle.alignment = .justified     // justified

// Chegara
paragraphStyle.headIndent = 16          // chap chegara
paragraphStyle.tailIndent = -16         // o'ng chegara (manfiy)
paragraphStyle.firstLineHeadIndent = 32 // birinchi qator chegarasi

// Paragraflararo bo'shliq
paragraphStyle.paragraphSpacing = 12    // paragrafdan keyin
paragraphStyle.paragraphSpacingBefore = 8 // paragrafdan oldin

// Qator balandligi
paragraphStyle.minimumLineHeight = 24
paragraphStyle.maximumLineHeight = 24

let attributes: [NSAttributedString.Key: Any] = [
    .font: UIFont.systemFont(ofSize: 16),
    .paragraphStyle: paragraphStyle
]

let label = UILabel()
label.attributedText = NSAttributedString(
    string: "This paragraph has a custom ParagraphStyle.\n\nSecond paragraph with 12 pt spacing.",
    attributes: attributes
)

SwiftUI'da NSMutableParagraphStyle'ning to'g'ridan-to'g'ri analogi yo'q — buning o'rniga modifikatorlar kombinatsiyasi ishlatiladi: .multilineTextAlignment() tekislash uchun, .lineSpacing() qatorlararo bo'shliq uchun. SwiftUI'da birinchi qator chegarasi va paragraflararo bo'shliqlar uchun Text + padding yoki AttributedString (iOS 15+ mavjud) ishlatish kerak.

// SwiftUI: AttributedString bilan ParagraphStyle (iOS 15+)
var attributed: AttributedString = """
This is the first paragraph with indent.

This is the second paragraph with 12 pt spacing.
"""

let ps = NSMutableParagraphStyle()
ps.paragraphSpacing = 12
ps.firstLineHeadIndent = 20

let container = AttributeContainer()
    .paragraphStyle(ps)

attributed.mergeAttributes(container)

Text(attributed)
    .font(.body)

Apple — Text Programming Guide (2025) ma'lumotlariga ko'ra, NSMutableParagraphStyle 14 tagacha turli xil formatlash parametrlarini qo'llab-quvvatlaydi. Shu bilan birga, tailIndent konteyner kengligiga nisbatan manfiy qiymat bilan, headIndent esa musbat qiymat bilan o'rnatilishini yodda tutish muhim. Bu noaniq xatti-harakat ko'pincha boshlang'ich iOS dasturchilarida xatolarga olib keladi.

Android'da ParagraphStyle: View-tizim va Compose

Android'da ParagraphStyle'ga yondashuv View-tizim va Jetpack Compose o'rtasida farqlanadi. Klassik View-tizimda paragraf parametrlari TextView'ning XML atributlari (android:textAlignment, android:lineSpacingExtra) yoki android.text.style paketidan ParagraphStyle interfeysi implementatsiyalari bilan SpannableString orqali o'rnatiladi.

// Android View tizimi: SpannableString orqali ParagraphStyle
val text = "First paragraph with settings.\n\nSecond paragraph."
val spannable = SpannableString(text)

// Justified tekislash
spannable.setSpan(
    AlignmentSpan.Standard(Layout.Alignment.ALIGN_NORMAL),
    0, text.length,
    Spannable.SPAN_PARAGRAPH
)

// LeadingMarginSpan orqali birinchi qator chegarasi
spannable.setSpan(
    LeadingMarginSpan.Standard(0, 20),
    0, text.indexOf('\n'),
    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)

textView.text = spannable

Jetpack Compose'da ParagraphStyle TextStyle parametrlari orqali boshqariladi. Tekislash uchun textAlign, qatorlararo bo'shliq uchun lineHeight (sp yoki em da), birinchi qator chegarasi uchun textIndent ishlatiladi. Compose shuningdek, ko'chirishlarni nozik boshqarish uchun LineBreak'ni qo'llab-quvvatlaydi (Simple, Heading, Paragraph).

// Jetpack Compose: TextStyle orqali ParagraphStyle
Text(
    text = "Maxsus uslub bilan birinchi paragraf.\n\nChegara bilan ikkinchi paragraf.",
    style = TextStyle(
        textAlign = TextAlign.Justify,
        lineHeight = 24.sp,
        textIndent = TextIndent(firstLine = 16.sp),
        lineBreak = LineBreak.Paragraph
    )
)

Android Developers — Compose ParagraphStyle (2025) ma'lumotlariga ko'ra, Compose'da TextIndent ishlatganda firstLine'ni sp da (dp da emas) o'rnatish muhim, chunki birinchi qator chegarasi matn bilan birga masshtablanishi kerak. Agar chegara dp da o'rnatilsa, shrift hajmi oshganda qizil satr vizual ravishda kichiklashadi, bu tipografik nisbatlarni buzadi.

Flutter'da ParagraphStyle: TextHeightBehavior va StrutStyle

Flutter'da ParagraphStyle paradigmasi alohida sinfga ajratilmagan — buning o'rniga TextStyle parametrlari va qo'shimcha sinflar kombinatsiyasi ishlatiladi. Tekislash TextAlign orqali, qatorlararo bo'shliqlar height (birliksiz) orqali, TextHeightBehavior esa birinchi va oxirgi qatorning ko'rinadigan chegaralarini boshqaradi.

// Flutter: Text parametrlari orqali ParagraphStyle
Text(
    'Flutter'da stillashtirilgan paragraf.\n\nChegaralar bilan ikkinchi paragraf.',
    style: TextStyle(
        fontSize: 16,
        height: 1.5,
        leadingDistribution: TextLeadingDistribution.proportional,
    ),
    textAlign: TextAlign.justify,
    textHeightBehavior: TextHeightBehavior(
        applyHeightToFirstAscent: true,
        applyHeightToLastDescent: true,
    ),
)

Murakkabroq stsenariylar uchun Flutter RichText'dan maxsus TextSpan va WidgetSpan bilan foydalanishni taklif qiladi. Bu bir paragrafda matnni inline vidjetlar (ikonkalar, rasmlar) bilan birlashtirishga, yagona formatlash qoidalarini saqlashga imkon beradi. Biroq, bu yondashuv qo'lda ko'chirish boshqaruvini talab qiladi va avtomatik ko'chirishni qo'llab-quvvatlamaydi.

// Flutter: maxsus paragraf formatlash bilan RichText
RichText(
    text: TextSpan(
        style: TextStyle(fontSize: 16, height: 1.5),
        children: [
            TextSpan(text: 'First paragraph with icon '),
            WidgetSpan(
                child: Icon(Icons.star, size: 16),
                alignment: PlaceholderAlignment.middle,
            ),
            TextSpan(text: '\n\nSecond paragraph after spacing.'),
        ],
    ),
)

Flutter Documentation — Text Widget (2025) ma'lumotlariga ko'ra, TextHeightBehavior Flutter'da ParagraphStyle'ni to'g'ri ko'rsatish uchun asosiy parametrdir. Agar applyHeightToFirstAscent false ga o'rnatilsa, birinchi qatorning yuqori chegarasi e'tiborga olinmaydi va matn konteynerning yuqori chegarasiga „yopishadi". Bu sarlavhalar uchun foydali, lekin asosiy matn uchun istalmagan.

ParagraphStyle va mahalliylashtirish: LTR/RTL va mintaqaviy xususiyatlar

ParagraphStyle har bir mahalliylashtirish uchun yozuv yo'nalishini hisobga olishi kerak. Arab, ivrit yoki urdu (o'ngdan chapga yozuv, RTL) tillarini qo'llab-quvvatlaydigan mobil ilovalarda chegaralar va tekislash oyna ko'rinishida o'zgarishi kerak. iOS baseWritingDirection = .natural orqali avtomatik almashtirishni, Android TextDirection orqali, Flutter textDirection orqali qo'llab-quvvatlaydi.

RTL mahalliylashtirishlari uchun tekislashni sozlash alohida e'tibor talab qiladi. Agar LTR rejimida headIndent chap chegarani o'rnatsa, RTL'da u avtomatik ravishda o'ngga aylanadi. Biroq, barcha implementatsiyalar tekislashni aniq o'rnatishda (NSTextAlignment.left o'rniga NSTextAlignment.natural) bu o'tishni to'g'ri boshqarmaydi. Google Internationalization Guide (2025) ma'lumotlariga ko'ra, ko'p tilli ilovalar uchun har doim natural alignment dan foydalaning va ikkala tartibda chegaralarni tekshiring.

// Android: ParagraphStyle'da RTL qo'llab-quvvatlash
val textView = TextView(context)

// Avtomatik RTL qo'llab-quvvatlashni yoqish
textView.textDirection = View.TEXT_DIRECTION_LOCALE
textView.textAlignment = View.TEXT_ALIGNMENT_TEXT_START

// RTL qo'llab-quvvatlash bilan Spannable
val spannable = SpannableString(arabicText)
spannable.setSpan(
    AlignmentSpan.Standard(Layout.Alignment.ALIGN_NORMAL),
    0, arabicText.length,
    Spannable.SPAN_PARAGRAPH
)

Mintaqaviy xususiyatlar shuningdek birinchi qator chegarasi uchun turli qoidalarni o'z ichiga oladi. Yevropa tipografiyasida qizil satr (firstLineHeadIndent) paragrafni ajratib ko'rsatish standartidir. Yapon va Xitoy tipografiyasida birinchi qator chegarasi ham ishlatiladi, lekin uning o'lchami farq qilishi mumkin (odatda Yevropa an'anasida 1.5 em ga nisbatan 1 em). Arab tipografiyasida qizil satr kam uchraydi, paragraflar ko'pincha vertikal bo'shliq bilan ajratiladi.

ParagraphStyle bilan ishlashda tipik xatolar

Eng keng tarqalgan xato — ParagraphStyle'dan faqat matn maydonining global atributlari orqali foydalanish alohida paragraflarning turli formatlashini hisobga olmasdan. \n bilan ajratilgan bir nechta paragraflari bo'lgan UILabel yoki TextView'da ParagraphStyle butun matnga bir xilda qo'llaniladi, agar har bir paragraf uchun turli uslublar bilan attributed-text ishlatilmasa.

• paragraphSpacingBefore'ni e'tiborga olmaslik — ko'plab dasturchilar paragraphSpacing'ni o'rnatadi, lekin paragraphSpacingBefore'ni unutadi. Blokdagi birinchi paragraf uchun paragraphSpacingBefore qo'shimcha konteyner yaratmasdan yuqoridan bo'shliq o'rnatishga imkon beradi. Bu sarlavhalar bilan ro'yxatlar uchun ayniqsa foydali.
• Natural o'rniga qattiq tekislash (left/right) — agar ilova RTL mahalliylashtirishlarini qo'llab-quvvatlasa, natural o'rniga NSTextAlignment.left yoki TextAlign.Start ishlatish arab va ivrit mahalliylashtirishlarida noto'g'ri ko'rsatishga olib keladi.
• Ko'chirish tekshiruvining yo'qligi (line break mode) — tor konteynerlarda (ro'yxatlar, sidebar) noto'g'ri lineBreakMode so'zlarning kesilishiga olib keladi. byWordWrapping dan foydalaning va aniq mahalliylashtirish kontekstida uzun so'zlarni tekshiring.
• Turli ParagraphStyle bilan Spannable aralashtirish — SPAN_PARAGRAPH bilan Spannable o'rnatishda paragraf chegaralarini to'g'ri hisoblash muhim. Boshlang'ich/oxirgi pozitsiyaning haqiqiy paragraf chegaralari bilan mos kelmasligi uslubning e'tiborga olinmasligiga olib keladi.
• Unutilgan baseline tekislash — barqaror lineHeight (minimumLineHeight) bilan ParagraphStyle ishlatganda matnning baseline ga tekislanishi yoqilganligiga ishonch hosil qiling. iOS'da buning uchun label.baselineAdjustment = .alignBaselines ishlatiladi.

UX Collective — Common Typography Bugs in Mobile Apps (2025) ma'lumotlariga ko'ra, ParagraphStyle bilan bog'liq muammolar mobil ilovalardagi barcha tipografik xatolarning 18% ni tashkil qiladi. Eng muhim holatlar noto'g'ri paragraphSpacing turli qatorlarda matnning bir-biriga o'tishiga yoki RTL mahalliylashtirishlarining LTR chegaralari bilan ko'rsatilishiga olib kelganda yuz beradi. Har bir ParagraphStyle parametri uchun turli tillardagi test qatorlari bilan birlik testlarini yaratish tavsiya etiladi.