لیڈنگ اور لائن کا فاصلہ: یہ کیا ہے اور iOS اور Android میں ترتیب

لیڈنگ اور سطر کا فاصلہ کیا ہے

لیڈنگ (تلفظ “لیڈنگ”) — ٹائپوگرافی میں قریب سطروں کی بیس لائنوں کے درمیان عمودی فاصلہ ہے۔ بیس لائن وہ غیر مرئی لکیر ہے جس پر متن کے حروف واقع ہوتے ہیں۔ لیڈنگ جیتنا زیادہ ہوگا، سطریں ایک دوسرے کے نسبت اتنے ہی زیادہ آزاد ہوں گی۔ ڈیجیٹل ٹائپوگرافی میں لیڈنگ کو اکثر سطر کا فاصلہ یا سطر کی اونچائی کہا جاتا ہے۔

تاریخی طور پر یہ لفظ دھاتی ٹائپوگرافی کے دور میں ظاہر ہوا: کمپوزیٹر سطروں کے درمیان فاصلہ بڑھانے کے لیے پتلی سیسے کی پٹیاں ڈالتے تھے۔ جدید فونٹس میں لیڈنگ کو فونٹ سائز کے تناسب کے طور پر مقرر کیا جاتا ہے۔ پیفرط سسٹم ویلیو — 1.2 (فونٹ سائز کا 120%)، لیکن لمبے متن اور موبائل انٹرفیس کے لیے ایک بڑی قیمت تجویز کی جاتی ہے۔ Material Design Typography Guidelines کے مطابق، ویب اور موبائل انٹرفیس کے لیے مرکزی متن کی بہترین سطر اونچائی 1.4-1.5 ہے۔

لیڈنگ اور سطر کے فاصلے میں فرق: لیڈنگ بیس لائن سے بیس لائن تک کا کل فاصلہ ہے، سطر کا فاصلہ ایک سطر کی نیچلی حد اور اگلی سطر کی اوپری حد کے درمیان کا فاصلہ ہے۔ زیادہ تر موبائل API (iOS NSParagraphStyle، Android TextView) میں سطر کا فاصلہ سطر کی قدرتی اونچائی کے اوپر اضافی خلا کے طور پر استعمال ہوتا ہے۔ یہ کل سطر کے فاصلے کا حساب لگاتے وقت اہم ہے۔

موبائل انٹرفیس کے لیے لیڈنگ کی بہترین قیمتیں

بہترین لیڈنگ کا انتخاب کئی عوامل پر منحصر ہے: فونٹ کا سائز، سطر کی لمبائی، استعمال کا سیاق اور سامعین۔ موبائل انٹرفیس کے لیے جن کی عمومی سطر چوڑائی 40-60 حروف ہوتی ہے، فونٹ سائز کا 1.4 سے 1.6 تک کا لیڈنگ تجویز کیا جاتا ہے۔ چھوٹی سطریں (لیبلز، بٹن) چھوٹا لیڈنگ استعمال کر سکتی ہیں — 1.0-1.2۔ لمبے متن (مضامین، تفصیلات) — زیادہ سے زیادہ خواندگی کے لیے 1.8 تک کا بڑا لیڈنگ۔

تجرباتی ڈیٹا: Wichita State University Software Usability Laboratory کی تحقیق نے دیکھایا کہ لیڈنگ 1.5 ایک ہی سطر چوڑائی پر لیڈنگ 1.0 کے مقابلے میں پڑھنے کی بہاؤ میں 7.5% اضافہ کرتا ہے۔ ڈسلیکسیا میں مبتلا صارفین کے لیے بہترین لیڈنگ اور بھی زیادہ ہے — 1.8 تک۔ یہ ڈیٹا WCAG 2.2 کی سفارشات سے مصدق ہے، جو مواد کے نقصان کے بغیر سطر کے فاصلے کو 1.5 تک بڑھانے کی صلاحیت کا مطالبہ کرتی ہیں۔

گرنیچر کا اثر: اونچے x-height (چھوٹے حروف کی نسبتی اونچائی) والے فونٹس کو کم x-height والے فونٹس کے مقابلے میں زیادہ لیڈنگ کی ضرورت ہوتی ہے۔ مثال کے طور پر، Helvetica (اونچا x-height) باڈی ٹیکسٹ کے لیے لیڈنگ 1.5 تجویز کرتا ہے، جبکہ Didot (کم x-height) — 1.3۔ اس کی وجہ یہ ہے کہ اونچے x-height پر ایک ہی سطر کے فاصلے پر سطریں ضد بصری طور پر تیزی سے ضم ہو جاتی ہیں۔

iOS پر NSParagraphStyle کے ذریعے لیڈنگ کا نفاذ

iOS پر سطر کا فاصلہ NSMutableParagraphStyle کلاس کے ذریعے کنٹرول کیا جاتا ہے، جس میں دو اہم خصوصیات ہیں: lineSpacing (سطروں کے درمیان پائنٹ میں اضافی خلا) اور lineHeightMultiple (سطر کی اونچائی کا ضرب). یہ خصوصیات مل کر کام کرتی ہیں: حتمی سطر کی اونچائی کو فونٹ کی قدرتی اونچائی کو lineHeightMultiple سے ضرب دے کر پلس lineSpacing کے طور پر حساب کیا جاتا ہے۔

let paragraphStyle = NSMutableParagraphStyle()

// طریقہ 1: سطر اونچائی کا ضرب
paragraphStyle.lineHeightMultiple = 1.5

// طریقہ 2: سطروں کے درمیان اضافی خلا
paragraphStyle.lineSpacing = 4.0

// NSAttributedString کے ذریعے لاگو کریں
let attributedText = NSAttributedString(
    string: "Text with custom line spacing",
    attributes: [
        .paragraphStyle: paragraphStyle
    ]
)

lineHeightMultiple — ترجیحی طریقہ ہے، کیونکہ فونٹ سائز بدلنے پر یہ خودبخود مقیاس کرتا ہے۔ lineSpacing مطلق پائنٹ میں مقرر کیا جاتا ہے اور مقیاس نہیں کرتا، جو Dynamic Type استعمال کرتے وقت متضادات کا سبب بن سکتا ہے۔ Apple Text Programming Guide کے مطابق، رسائیت مطابق انٹرفیس کے لیے UIFontMetrics کے ساتھ lineHeightMultiple استعمال کریں۔

SwiftUI Text اور VStack کے لیے .lineSpacing() مادیفائر فراہم کرتا ہے۔ UIKit کے برعکس، SwiftUI میں سطر کا فاصلہ پائنٹ میں مقرر کیا جاتا ہے اور اس میں کوئی ضرب شامل نہیں ہے۔ ضرب کو نافذ کرنے کے لیے ڈیویلپر کو فونٹ سائز کی بنیاد پر سطر کا فاصلہ دستی طور پر حساب کرنا ہوگا۔ حد: SwiftUI براہراست lineHeightMultiple کو سپورٹ نہیں کرتا — حساب شدہ قیمت کے ساتھ .lineSpacing(CGFloat) استعمال کریں۔

struct LeadingTextView: View {
    let fontSize: CGFloat = 17

    var lineSpacing: CGFloat {
        fontSize * 0.5 // فونٹ سائز کا 50%
    }

    var body: some View {
        Text("سطر کا فاصلہ")
        Text("1.5 ضرب")
            .lineSpacing(lineSpacing)
            .font(.system(size: fontSize))
    }
}

Android پر سطر کا فاصلہ مقرر کرنا

Android پر سطر کا فاصلہ TextView کے دو ایٹریبیوٹس کے ذریعے مقرر کیا جاتا ہے: lineSpacingExtra (px میں اضافی خلا) اور lineSpacingMultiplier (سطر کی اونچائی کا ضرب، پیفرط 1.0). iOS کی طرح، ضرب فونٹ سائز بدلنے پر مقیاس کرتا ہے، جبکہ extra ایک مطلق قیمت ہے۔ رسائیت مطابق انٹرفیس کے لیے ضرب کا استعمال ترجیح دیا جاتا ہے۔

// XML لے آؤٹ میں
<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Text with line spacing"
    android:lineSpacingExtra="4dp"
    android:lineSpacingMultiplier="1.5"
    android:textSize="16sp" />

// Kotlin میں پروگرامیٹکلی
val textView = findViewById<TextView>(R.id.contentText)
textView.setLineSpacing(
    TypedValue.applyDimension(
        TypedValue.COMPLEX_UNIT_DIP,
        4f,
        resources.displayMetrics
    ),
    1.5f
)

Compose — جدید Android UI فریم ورک — TextStyle مادیفائر میں lineHeight پیرامیٹر استعمال کرتا ہے۔ XML نظام کے برعکس، Compose میں lineHeight sp میں کل سطر کی اونچائی کے طور پر مقرر کیا جاتا ہے (پیفرط = fontSize * 1.2)۔ ضرب مقرر کرنے کے لیے ڈیویلپر fontSize کے فیصد کے طور پر lineHeight مختص کرتا ہے: مثال: TextStyle(fontSize = 16.sp, lineHeight = 24.sp) ضرب 1.5 دیتا ہے۔

حد: Android API 28 تک، lineSpacingExtra اور lineSpacingMultiplier کچھ فونٹس کے ساتھ، خاص طور پر کاسٹم (TTF/OTF) فونٹس کے ساتھ غلط کام کرتے ہیں۔ حقیقی آلات پر ٹیسٹ کرنے کی سفارش کی جاتی ہے اور یاد رکھیں کہ systemTextView پیفرط طور پر lineSpacingMultiplier 1.0 استعمال کرتا ہے — بغیر کسی اضافی خلا کے۔ ScrollView میں لمبے متن کے لیے علانیہ طور پر سطر کا فاصلہ مقرر کرنا لازمی ہے۔

CSS line-height کے ذریعے ویب ڈیویلپمنٹ میں سطر کا فاصلہ

ویب پر سطر کا فاصلہ CSS پراپرٹی line-height سے مقرر کیا جاتا ہے، جو ایک عدد (ضرب)، فیصد قیمت، لمبائی کے اکائے (px, em) یا میفرڈی لفظ normal ہو سکتا ہے۔ عددی ضرب ترجیحی طریقہ ہے، کیونکہ یہ وراثت پاتا ہے اور بچوں عناصر کے فونٹ سائز کے نسبت مقیاس کرتا ہے۔ normal قیمت زیادہ تر فونٹس کے لیے تقریباً 1.2 کے مطابق ہے۔

/* Numerical multiplier (recommended) */
body {
    font-size: 16px;
    line-height: 1.5;
}

/* Percentage value */
.article-content {
    line-height: 150%;
}

/* Fixed value (does not scale) */
.small-text {
    font-size: 12px;
    line-height: 18px;
}

عددی ضرب vs em: line-height: 1.5 اور line-height: 1.5em مختلف چیزیں ہیں۔ عددی ضرب حساب شدہ قیمت کے طور پر وراثت پاتا ہے اور ہر بچے عنصر کے لیے اس کے font-size کی بنیاد پر دوبارہ حساب کیا جاتا ہے۔ em والد کے font-size پر مبنی فائکس حساب شدہ قیمت کے طور پر وراثت پاتا ہے۔ یہ ایک اہم فرق ہے: جب font-size: 20px font-size: 16px کے اندر ہو تو line-height: 1.5 30px دے گا، جبکہ line-height: 1.5em 24px (والد سے) دے گا۔ سفارش: ہمیشہ عددی ضرب استعمال کریں۔

iOS، Android اور ویب پر لیڈنگ کی ترتیبات کا موازنہ

مختلف APIs کے باوجود، سطر کے فاصلے کے مقرر کرنے کا اصول تمام پلیٹ فارمز پر ایک جیسا ہے۔ ضرب فونٹ سائز بدلنے پر مقیاس کرتا ہے اور رسائیت دوستانہ ہے۔ مطلق قیمت (خلا) مقیاس نہیں کرتی اور Dynamic Type یا بڑے متن کی ترتیبات استعمال کرتے وقت مسائل کا سبب بن سکتی ہے۔

کراس پلیٹ فارم حکمت عملی: ڈیزائن سسٹم میں fontSize کے ضرب کے طور پر lineHeight مقرر کریں۔ مثال کے طور پر، ڈیزائن ٹوکن میں: line-height-body = 1.5، line-height-heading = 1.1۔ ہر پلیٹ فارم اس ضرب کو اپنے API سے نافذ کرتا ہے: iOS — lineHeightMultiple، Android — lineSpacingMultiplier، Web — line-height: 1.5۔ یہ تمام پلیٹ فارمز پر ایک جیسا بصری نتیجہ یقینی بناتا ہے۔

اہم نیوانس: iOS پر lineHeightMultiple کل سطر کی اونچائی (فونٹ کے ascender + descender سمیت) پر لاگو کیا جاتا ہے، جبکہ Android پر lineSpacingMultiplier Minikin رینڈرنگ انجن کے ذریعے حساب کردہ سطر کی اونچائی پر لاگو کیا جاتا ہے۔ عمل میں اس کے نتائج میں ایک ہی ضرب قیمت پر بصری لیڈنگ میں تھوڑی سی مختلفیاں پیدا ہوتی ہیں۔ پکسل پرفیکٹ مطابقت کے لیے پلیٹ فارم کے مطابق ایڈجسٹمنٹ کے ساتھ مطلق قیمتیں استعمال کریں۔