px: جوہر، موبائل ڈیولپمنٹ میں فزیکل پکسلز
px — ایک فزیکل پکسل، ڈیوائس اسکرین پر تصویر کا سب سے چھوٹا عنصر۔ موبائل ڈیولپمنٹ میں، px اسکرین ریزولوشن اور پکسل کثافت (PPI) کی بنیادی اکائی کے طور پر استعمال ہوتا ہے، لیکن انٹرفیس لے آؤٹ کے لیے عملی طور پر استعمال نہیں ہوتا — اس کے بجائے منطقی اکائیاں pt، dp اور sp استعمال ہوتی ہیں۔ یہ مضمون وضاحت کرتا ہے کہ px منطقی اکائیوں سے کیسے مختلف ہے، ریزولوشن اور PPI کا آپس میں کیا تعلق ہے، اور کوڈ میں براہ راست px استعمال کرنا ایک اینٹی پیٹرن کیوں ہے۔
اہم نکات
- px — ڈسپلے کا ایک فزیکل پکسل جو اسکرین کی کثافت (PPI) کو مدنظر نہیں رکھتا
- اسکرین ریزولوشن px میں — چوڑائی اور اونچائی میں پکسلز کی تعداد، مثال 1179 × 2556 px
- PPI — پکسلز فی انچ، تصویر کی وضاحت کا سب سے اہم اشارہ
- منطقی اکائیاں (dp, pt, sp) px کو تجریدی بناتی ہیں اور انٹرفیس کو مختلف اسکرینوں کے مطابق ڈھالتی ہیں
- کوڈ میں px کا استعمال ایک اینٹی پیٹرن ہے کیونکہ مختلف کثافت والے ڈیوائسز پر انٹرفیس صحیح طریقے سے ظاہر نہیں ہوگا
px کیا ہے؟
px (پکسل، تصویری عنصر) — راسٹر تصویر یا ڈسپلے کا سب سے چھوٹا قابلِ پتہ عنصر۔ ہر پکسل RGB ماڈل (سرخ، سبز، نیلا) میں 8 سے 10 بٹ فی چینل کی رنگین گہرائی کے ساتھ رنگین معلومات ذخیرہ کرتا ہے۔ جدید موبائل ڈیوائسز کے ڈسپلے میں لاکھوں پکسلز ہوتے ہیں: iPhone 15 Pro — 3 ملین، iPad Pro 12.9" — 5.6 ملین پکسلز۔
پکسل کا فزیکل سائز ڈسپلے کثافت (PPI) پر منحصر ہے۔ 326 PPI (iPhone 11) والے ڈیوائس پر، ایک پکسل تقریباً 0.078 ملی میٹر ہوتا ہے۔ 460 PPI (iPhone 15 Pro) والے ڈسپلے پر — 0.055 ملی میٹر۔ پکسل کا فزیکل سائز جتنا چھوٹا ہوگا، تصویر کی وضاحت اتنی ہی زیادہ ہوگی۔ اسی وقت، پکسل کثافت براہ راست رینڈرنگ کارکردگی کو متاثر کرتی ہے: زیادہ پکسلز = GPU کے لیے زیادہ کام۔
Apple کے مطابق، iPhone 15 Pro کا ڈسپلے ریزولوشن 460 PPI پر 1179 × 2556 px ہے۔ مقابلے کے لیے، iPhone SE (تیسری نسل) — 326 PPI پر 750 × 1334 px۔ کل پکسلز کی تعداد میں فرق تقریباً 3 گنا ہے، جو Pro ماڈلز پر زیادہ GPU ضروریات کی وضاحت کرتا ہے۔
پکسلز میں اسکرین ریزولوشن
اسکرین ریزولوشن — افقی اور عمودی طور پر فزیکل پکسلز کی تعداد۔ اسے چوڑائی × اونچائی کے فارمیٹ میں لکھا جاتا ہے، مثال 1179 × 2556 px۔ ریزولوشن ڈسپلے کی ایک بنیادی خصوصیت ہے جسے پروگرام کے ذریعے تبدیل نہیں کیا جا سکتا — یہ ہارڈویئر اور میٹرکس کی سطح پر طے شدہ ہے۔
| ڈیوائس | ریزولوشن (px) | PPI | پہلو تناسب |
|---|---|---|---|
| iPhone SE (تیسری نسل) | 750 × 1334 | 326 | 16:9 |
| iPhone 14 | 1170 × 2532 | 460 | 19.5:9 |
| iPhone 15 Pro Max | 1290 × 2796 | 460 | 19.5:9 |
| Samsung Galaxy S24 Ultra | 1440 × 3120 | 505 | 19.5:9 |
| Google Pixel 8 Pro | 1344 × 2992 | 490 | 20:9 |
| iPad Pro 12.9" | 2048 × 2732 | 264 | 4:3 |
پکسلز میں ریزولوشن کو اسکرین کے منطقی سائز (iOS کے لیے pt یا Android کے لیے dp) کے ساتھ الجھانا نہیں چاہیے۔ مثال کے طور پر، iPhone 14 کا منطقی سائز 390 × 844 pt ہے، لیکن فزیکل ریزولوشن 1170 × 2532 px ہے — بالکل 3 گنا بڑا، کیونکہ اسکیل فیکٹر 3 ہے۔
PPI اور پکسل کثافت
PPI (پکسلز فی انچ) — ڈسپلے کے فی انچ پکسلز کی تعداد۔ فارمولے سے حساب کیا جاتا ہے: PPI = √(چوڑائی² + اونچائی²) / ترچھا۔ PPI جتنا زیادہ ہوگا، انفرادی پکسلز اتنے ہی چھوٹے ہوں گے اور تصویر اتنی ہی ہموار نظر آئے گی۔ Apple عام دیکھنے کے فاصلے پر 300 سے زیادہ PPI والے ڈسپلے کو Retina ڈسپلے سمجھتا ہے۔
مختلف ڈیوائس کیٹیگریز کی مختلف کثافتیں ہوتی ہیں: Apple Watch — 326 PPI، iPhone — 326–460 PPI، iPad — 264 PPI، MacBook Pro — 254–264 PPI۔ Android ڈیوائسز Density Buckets کے ذریعے کثافت کو درجہ بند کرتی ہیں: mdpi (160 dpi)، hdpi (240)، xhdpi (320)، xxhdpi (480)، xxxhdpi (640)۔ یہ بالٹیاں طے کرتی ہیں کہ ڈیوائس کے لیے کون سا وسیلہ (تصویر، dimens) لوڈ کیا جائے گا۔
ڈیولپمنٹ پر PPI کا اثر: کثافت جتنی زیادہ ہوگی، ساختوں اور تصاویر کو ذخیرہ کرنے کے لیے اتنی ہی زیادہ میموری درکار ہوگی۔ 500 PPI ڈسپلے پر ایک پکسل کو اسی منطقی عنصر سائز کے لیے 320 PPI ڈسپلے کے مقابلے میں 2.5 گنا زیادہ GPU میموری درکار ہوتی ہے۔ مخصوص کثافت بالٹیوں کے لیے اثاثوں کو بہتر بنانا Android ڈیولپمنٹ میں ایک معیاری عمل ہے۔
px بمقابلہ منطقی اکائیاں: pt, dp, sp
فزیکل پکسلز (px) منطقی اکائیوں (pt، dp، sp) سے اس لحاظ سے مختلف ہیں کہ وہ ہارڈویئر ریزولوشن سے منسلک ہوتے ہیں اور اسکیل نہیں ہوتے۔ منطقی اکائیاں، اس کے برعکس، ڈیولپر کو مخصوص ڈسپلے سے تجریدی بناتی ہیں، جس سے 100 pt کی ایک قدر مختلف ڈیوائسز پر ایک ہی فزیکل سائز کے ساتھ ظاہر ہو سکتی ہے۔
| اکائی | پلیٹ فارم | PPI پر منحصر | اسکیل ہوتی ہے | مقصد |
|---|---|---|---|---|
| px | تمام | ہاں (فزیکل پکسل) | نہیں | تصاویر، بفرز، Metal |
| pt | iOS/macOS | نہیں (منطقی نقطہ) | اسکیل فیکٹر | لے آؤٹ، UIKit، SwiftUI |
| dp | Android | نہیں (کثافت سے آزاد) | کثافت بالٹی | لے آؤٹ، عناصر کے سائز |
| sp | Android | نہیں (اسکیل سے آزاد) | کثافت + فونٹ اسکیل | متن (textSize) |
تبادلوں کے فارمولے: iOS کے لیے — px = pt × scale (جہاں scale = 1، 2 یا 3)۔ Android کے لیے — px = dp × (dpi / 160)۔ کوڈ میں px کا براہ راست استعمال means کہ انٹرفیس مختلف کثافت والے ڈیوائسز پر مختلف نظر آئے گا: زیادہ PPI اسکرین پر عنصر بہت چھوٹا ہوگا، اور کم PPI پر — بہت بڑا۔
کوڈ میں px کیوں استعمال نہیں ہوتا
موبائل ایپلیکیشن کے سورس کوڈ میں px کا استعمال ایک اینٹی پیٹرن ہے جو مختلف پکسل کثافت والے ڈیوائسز پر انٹرفیس کی غلط نمائش کا باعث بنتا ہے۔ جدید فریم ورک (UIKit، SwiftUI، Jetpack Compose، XML Layouts) پکسلز میں سائز بتانے سے منع کرتے ہیں یا اس کی سفارش نہیں کرتے۔
- iOS UIKit — تمام frame، bounds اور constraint constants pt میں سیٹ کیے جاتے ہیں۔ پکسلز صرف UIGraphicsImageRenderer کے ذریعے راسٹرائزیشن مرحلے میں ظاہر ہوتے ہیں
- SwiftUI — px میں سائز سیٹ کرنے کے لیے کوئی API نہیں ہے۔ تمام قدریں Font، frame، padding کے ذریعے pt میں ہوتی ہیں
- Android XML — اگر آپ dimens.xml میں px بتاتے ہیں، تو Android Studio ایک lint انتباہ دکھاتا ہے: "متن کے سائز کے لیے `px` کی بجائے `sp` استعمال کریں"
- Jetpack Compose — متن کے لیے TextUnit، عناصر کے لیے Dp۔ کمپائلر اقسام کو مکس کرنے کی اجازت نہیں دیتا
کوڈ میں px کے استعمال کا واحد جائز طریقہ راسٹرز کے ساتھ کام کرنا ہے: Bitmap لوڈ کرنا، Canvas میں تصویر رینڈر کرنا، Metal یا OpenGL کے ساتھ کام کرنا۔ ان صورتوں میں، px ہدف بفر کے فزیکل پکسلز ہوتے ہیں اور درست رینڈرنگ کے لیے ان کو مدنظر رکھنا ضروری ہے۔ باقی تمام صورتوں میں، منطقی اکائیاں استعمال ہوتی ہیں۔
تصاویر اور اثاثوں میں پکسلز
تصاویر اور آئیکنز پکسلز میں محفوظ ہوتے ہیں، لیکن ہر اسکرین کی قسم کے لیے مختلف ورژن فراہم کیے جاتے ہیں۔ iOS Assets.xcassets میں @1x، @2x، @3x لاحقے استعمال کرتا ہے۔ Android drawable-mdpi (1×)، drawable-hdpi (1.5×)، drawable-xhdpi (2×)، drawable-xxhdpi (3×)، drawable-xxxhdpi (4×) فولڈرز استعمال کرتا ہے۔ نظام اسکرین کی کثافت کی بنیاد پر خود بخود درست فائل منتخب کرتا ہے۔
| iOS اسکیل | Android بالٹی | فیکٹر | مثال (48 pt/dp) |
|---|---|---|---|
| @1x | mdpi (160 dpi) | 1× | 48 × 48 px |
| @2x | xhdpi (320 dpi) | 2× | 96 × 96 px |
| @3x | xxhdpi (480 dpi) | 3× | 144 × 144 px |
| — | xxxhdpi (640 dpi) | 4× | 192 × 192 px |
اثاثہ فراہمی کا اصول: تصویر کو ویکٹر فارمیٹ (PDF, SVG) میں بنائیں اور مطلوبہ سائز کی راسٹر کاپیوں میں ایکسپورٹ کریں۔ ویکٹر اثاثے معیار کے نقصان کے بغیر اسکیل ہوتے ہیں اور ذخیرہ میں کم جگہ لیتے ہیں۔ Android میں، ویکٹر وسائل کو VectorDrawable کے ذریعے براہ راست استعمال کیا جا سکتا ہے، جو متعدد راسٹر کاپیوں کی ضرورت کو ختم کرتا ہے۔
اکثر پوچھے گئے سوالات
px اور dp میں کیا فرق ہے؟
px — اسکرین کا ایک فزیکل پکسل۔ dp (کثافت سے آزاد پکسل) — ایک منطقی Android اکائی جو 160 dpi کثافت والی اسکرین پر 1 px کے برابر ہے۔ مختلف کثافتوں پر، dp خود بخود px کی مختلف تعداد میں تبدیل ہو جاتا ہے، عنصر کے فزیکل سائز کو محفوظ رکھتا ہے۔
کوڈ میں px میں سائز کیوں نہیں بتائے جا سکتے؟
کیونکہ px اسکرین کی کثافت کو مدنظر نہیں رکھتا۔ 100 px کا عنصر مختلف PPI والے ڈیوائسز پر مختلف نظر آئے گا: 326 PPI اسکرین پر یہ 460 PPI سے بڑا ہوگا۔ منطقی اکائیاں (dp, pt, sp) اس مسئلے کو خود بخود حل کرتی ہیں۔
PPI کیا ہے اور اس کا حساب کیسے لگایا جاتا ہے؟
PPI (پکسلز فی انچ) — ڈسپلے کے فی انچ پکسلز کی تعداد۔ فارمولے سے حساب: PPI = √(c² + ا²) / t، جہاں c اور ا px میں ریزولوشن، t انچ میں ترچھا ہے۔ PPI جتنا زیادہ ہوگا، تصویر اتنی ہی واضح ہوگی۔ Apple Retina ڈسپلے 300 PPI سے شروع ہوتا ہے۔
px کا استعمال کب جائز ہے؟
px راسٹر بفرز کے ساتھ کام کرتے وقت جائز ہے: Bitmap بنانا، Canvas میں رینڈر کرنا، Metal/OpenGL شیڈر پروگرامنگ، کیمرے سے تصویر پروسیسنگ۔ لے آؤٹ اور ٹائپوگرافی میں، px استعمال نہیں ہوتا — pt (iOS)، dp اور sp (Android) لاگو ہوتے ہیں۔
px میں اسکرین ریزولوشن کیسے معلوم کریں؟
iOS میں: UIScreen.main.nativeBounds px میں سائز لوٹاتا ہے۔ Android میں: DisplayMetrics.widthPixels اور heightPixels context.resources.displayMetrics سے۔ SwiftUI میں: GeometryReader pt میں سائز لوٹاتا ہے، px کے لیے displayScale سے ضرب کرنا ضروری ہے۔
خلاصہ
- px — ڈسپلے کا ایک فزیکل پکسل، اسکرین ریزولوشن کی بنیادی اکائی
- ریزولوشن — افقی اور عمودی پکسلز کی تعداد، ہارڈویئر سطح پر طے شدہ
- PPI — پکسلز فی انچ، تصویر کی وضاحت اور GPU ضروریات کا تعین کرتا ہے
- منطقی اکائیاں (pt, dp, sp) px کو تجریدی بناتی ہیں اور انٹرفیس کو کسی بھی اسکرین کے مطابق ڈھالتی ہیں
- اینٹی پیٹرن — لے آؤٹ اور ٹائپوگرافی میں px کا استعمال؛ صحیح ڈومین راسٹر بفرز ہیں
- اثاثے مختلف ریزولوشنز میں فراہم کیے جاتے ہیں (iOS کے لیے @1x/@2x/@3x، Android کے لیے density buckets)
- ویکٹر فارمیٹس (PDF, SVG, VectorDrawable) متعدد راسٹر کاپیوں سے بہتر ہیں
ہم ایک موبائل ایپلیکیشن ٹرنکی تیار کریں گے
IT Sectr 2017 سے اسٹارٹ اپس اور کاروبار کے لیے iOS اور Android ایپلیکیشنز بناتا ہے۔ ہم آپ کو مشورہ دیں گے اور بہترین حل تجویز کریں گے۔
مزید پڑھیں