پیکسلهای مستقل از چگالی (dp) و پیکسلهای مقیاسپذیر (sp) برای ساخت طرحبندیها و ارائه فونتهایی که به طور یکنواخت به طیف گستردهای از تراکمهای صفحه نمایش، کلاسهای اندازه، فاکتورهای فرم و نسبتهای ابعادی که دستگاههای اندروید را تشکیل میدهند، پاسخ میدهند، ضروری هستند.
غذاهای بیرونبر
- اگر از یک شبکه پایه استفاده میکنید، به اندازههای ۴ و ۸ پایبند باشید.
- مشخصات را به جای پیکسل، با dp و sp یادداشت کنید.
- گرافیکهای بیتمپ (شطرنجی) را برای همه باکتها صادر کنید.
- با در نظر گرفتن کلاسهای اندازه، وضوح تصویر و نسبتهای ابعاد مختلف، با ذهنیت واکنشگرا طراحی کنید.
- پیکسلهای مستقل از چگالی (dp) : پیکسلهای مستقل از چگالی، واحدهای انعطافپذیری هستند که برای داشتن ابعاد یکنواخت در هر صفحهای، مقیاسپذیر میشوند. آنها بر اساس چگالی فیزیکی صفحه نمایش هستند. این واحدها نسبت به صفحه نمایش ۱۶۰ dpi (نقطه در هر اینچ) هستند که در آن ۱ dp تقریباً برابر با ۱ پیکسل است.
- پیکسلهای مقیاسپذیر (sp) : پیکسلهای مقیاسپذیر همان عملکرد dp را دارند، اما برای فونتها. مقدار پیشفرض sp همان مقدار پیشفرض dp است. سیستم اندروید اندازه فونت واقعی مورد استفاده را بر اساس دستگاه و تنظیمات برگزیده کاربر که در تنظیمات دستگاه تنظیم شده است، محاسبه میکند.
تفاوت اصلی بین این واحدهای اندازهگیری این است که پیکسلهای مقیاسپذیر، تنظیمات فونت کاربر را حفظ میکنند. کاربرانی که تنظیمات متن بزرگتری برای دسترسیپذیری دارند، اندازه فونت را با تنظیمات اندازه متن خود مطابقت میدهند. نحوه تغییر اندازه فونت را در نوشتن ببینید.
اندروید از این واحدها برای کمک به مقیاسبندی و ترجمه در طیف وسیعی از دستگاهها و وضوح تصویرها استفاده میکند.
سطلهای چگالی
صفحه نمایشهای با تراکم بالا، پیکسلهای بیشتری در هر اینچ نسبت به صفحه نمایشهای با تراکم پایین دارند. در نتیجه، عناصر رابط کاربری با ابعاد پیکسلی یکسان، در صفحه نمایشهای با تراکم پایین بزرگتر و در صفحه نمایشهای با تراکم بالا کوچکتر به نظر میرسند. به همین دلیل است که نباید اندازهها را بر حسب پیکسل اعلام کنید.
اندروید محدودههای مختلف تراکم صفحه نمایش را در "سطلها" گروهبندی میکند و از آنها برای ارائه مجموعه بهینهای از عناصر به دستگاه شما استفاده میکند. رایجترین سطلهای تراکم عبارتند از mdpi ، hdpi ، xhdpi ، xxhdpi و xxxhdpi ( nodpi و anydpi به سطلی اشاره دارند که بر اساس وضوح دستگاه مقیاسبندی نمیشود و معمولاً برای ترسیمهای برداری استفاده میشود) که هر کدام مربوط به یک فایل منبع از برنامه شما هستند.
برای محاسبهی dp:
dp = (عرض بر حسب پیکسل * ۱۶۰) / تراکم صفحه نمایش
شبکه پایه
ساخت با یک شبکهبندی زیربنایی به ایجاد فاصلهگذاری و ترازبندی منظم در رابط کاربری شما کمک میکند. رابط کاربری اندروید از یک شبکهبندی 8dp برای طرحبندی، اجزا و فاصلهگذاری استفاده میکند.
عناصر کوچکتر مانند آیکونها، متن و برخی عناصر درون کامپوننتها بهتر است با یک شبکه ۴dp تراز شوند.
شبکههای طرحبندی
شبکهها ستون فقرات هر طرحبندی هستند. سلسله مراتب محتوا، تعداد و حتی پیام آن را در نظر بگیرید.
شبکه سلسله مراتبی
یک شبکه سلسله مراتبی با در نظر گرفتن سلسله مراتب محتوا یا اهمیت آن ایجاد میشود. به طرحبندی یک روزنامه فکر کنید: یک داستان مهم و ثابت، بیشتر طرحبندی را به خود اختصاص میدهد در حالی که یک ستون کوچکتر، مقالات گذشته را نمایش میدهد.
هنگام تطبیق با اندازههای مختلف صفحه نمایش، یک طرح سلسله مراتبی میتواند سلولهای شبکهای را تغییر شکل دهد، اندازه را تغییر دهد و آشکار کند.
شبکه مدولار
یک شبکه مدولار در ستونها و ردیفهای ثابت تنظیم میشود و یک سیستم شبکه مستطیلی برای ترازبندی محتوا ایجاد میکند. شبکههای مدولار برای محتوایی با اهمیت و اندازه مشابه، مانند یک گالری کارت، به خوبی کار میکنند.
یک شبکه ماژولار تطبیقی میتواند سلولهای شبکه بیشتری اضافه کند و محتوای درون آن میتواند به سلولهای شبکه مختلف بچسبد یا در آنها قرار گیرد. سلولهای شبکه میتوانند در اندازههای مختلف ثابت بمانند یا بسته به نیاز محتوا تغییر اندازه دهند.
شبکه ستونی
ستونها با تقسیم محتوا در ناحیه بدنه، یک ساختار شبکهای ایجاد میکنند تا تعریف عمودی برای طرحبندی ارائه دهند. محتوا در قسمتهایی از صفحه نمایش که حاوی ستونها هستند قرار میگیرد. برای تراز کردن محتوا، آن را با یک شبکه زیرین تراز کنید، اما باید اندازه انعطافپذیری را حفظ کنید.
اصول اولیه نحوه تنظیم یک شبکه ستونی و اعمال محتوا را در اصول اولیه طرحبندی بیاموزید. شبکه ستونی میتواند با تغییر اندازه ستونها و تعداد ستونها در صورت نیاز با توجه به اندازه صفحه نمایش در نقاط خاص، عوامل شکل مختلف را در خود جای دهد و در عین حال به محتوا نیز اجازه مقیاسبندی دهد.
کلاسهای اندازه
کلاسهای اندازه پنجره مجموعهای از نقاط توقف دیدگاههای مختلف هستند که به شما در طراحی، توسعه و آزمایش طرحبندیهای واکنشگرا و تطبیقی برنامههای کاربردی کمک میکنند. اندروید کلاسهای اندازه پنجره را به 3 دسته تقسیم میکند: فشرده (Compact)، متوسط (Medium) و گسترده (Expanded). درباره کلاسهای اندازه پنجره بیشتر بخوانید.
نسبتهای ابعاد
نسبت ابعاد، نسبت عرض یک عنصر به ارتفاع آن است. نسبتهای ابعاد به صورت عرض:ارتفاع نوشته میشوند.
برای حفظ ثبات در طرحبندی خود، از نسبت ابعاد ثابتی برای عناصری مانند تصاویر، سطوح و اندازه صفحه نمایش استفاده کنید.
نسبتهای ابعاد زیر برای استفاده در رابط کاربری شما توصیه میشوند:
- ۱۶:۹
- ۳:۲
- ۴:۳
- ۱:۱
- ۳:۴
- ۲:۳