লেআউট তৈরি করা এবং এমন ফন্ট উপস্থাপন করার জন্য ঘনত্ব-নিরপেক্ষ পিক্সেল (dp) এবং স্কেলেবল পিক্সেল (sp) অপরিহার্য যা Android ডিভাইস তৈরি করে এমন স্ক্রিন ঘনত্ব, সাইজ ক্লাস, ফর্ম ফ্যাক্টর এবং অ্যাস্পেক্ট রেশিওর বিস্তৃত রেঞ্জের সাথে সামঞ্জস্যপূর্ণভাবে কাজ করে।
টেকঅ্যাওয়ে
- বেসলাইন গ্রিড ব্যবহার করলে, ৪ ও ৮-এর পরিমাপ মেনে চলুন।
- পিক্সেলের পরিবর্তে dp ও sp-তে স্পেসিফিকেশন নোট করুন।
- সব বালতির জন্য বিটম্যাপ (রাস্টার) গ্রাফিক এক্সপোর্ট করুন।
- বিভিন্ন সাইজ ক্লাস, রেজোলিউশন ও অ্যাস্পেক্ট রেশিওর কথা মাথায় রেখে রেসপন্সিভ ডিজাইন করুন।
- ঘনত্ব-নিরপেক্ষ পিক্সেল (dp): ঘনত্ব-নিরপেক্ষ পিক্সেল হল এমন ফ্লেক্সিবল ইউনিট যা যেকোনও স্ক্রিনে একই রকম ডাইমেনশন পেতে স্কেল করা হয়। এগুলি স্ক্রিনের ফিজিক্যাল ডেনসিটির উপর ভিত্তি করে তৈরি হয়। এইসব ইউনিট ১৬০ ডিপিআই (ডট পার ইঞ্চি) স্ক্রিনের সাথে সম্পর্কিত, যেখানে ১ ডিপি মোটামুটি ১ পিক্সেলের সমান।
- স্কেলেবল পিক্সেল (sp): স্কেলেবল পিক্সেল dp-এর মতোই কাজ করে, তবে ফন্টের ক্ষেত্রে। sp-এর ডিফল্ট ভ্যালু dp-এর ডিফল্ট ভ্যালুর সমান। Android সিস্টেম, ডিভাইসের সেটিংস থেকে ডিভাইসের প্রকারের উপর ভিত্তি করে ব্যবহার করার জন্য প্রকৃত ফন্ট সাইজ গণনা করে।
এইসব পরিমাপের এককগুলির মধ্যে প্রধান পার্থক্য হল, স্কেলেবল পিক্সেল ব্যবহারকারীর ফন্ট সেটিংস সংরক্ষণ করে। অ্যাক্সেসিবিলিটির জন্য বড় টেক্সট সেটিং ব্যবহারকারী ফন্ট সাইজকে তাদের টেক্সট সাইজ সংক্রান্ত পছন্দের সাথে মানানসই হিসেবে দেখতে পান। Compose-এ কীভাবে ফন্ট সাইজ পরিবর্তন করবেন তা দেখুন।
বিভিন্ন ডিভাইস ও রেজোলিউশন জুড়ে স্কেল ও ট্রান্সলেট করতে সাহায্য করার জন্য Android এইসব ইউনিট ব্যবহার করে।
ডেনসিটি বাকেট
হাই-ডেনসিটি স্ক্রিনে লো-ডেনসিটি স্ক্রিনের তুলনায় প্রতি ইঞ্চিতে বেশি পিক্সেল থাকে। এর ফলে, একই পিক্সেল ডাইমেনশনের UI এলিমেন্ট কম ডেনসিটি স্ক্রিনে বড় এবং বেশি ডেনসিটি স্ক্রিনে ছোট দেখায়। এই কারণে, আপনাকে পিক্সেলে মাপ ঘোষণা করা উচিত নয়।
Android, স্ক্রিন ডেনসিটির রেঞ্জকে "বাকেট" হিসেবে গ্রুপ করে এবং আপনার ডিভাইসে অ্যাসেটের অপ্টিমাল সেট ডেলিভার করতে
সেগুলি ব্যবহার করে। সবচেয়ে বেশি ব্যবহৃত ডেনসিটি
বাকেট হল mdpi, hdpi, xhdpi, xxhdpi ও xxxhdpi (nodpi ও
anydpi এমন বাকেটকে বোঝায় যা ডিভাইস রেজোলিউশন অনুযায়ী স্কেল করে না, সাধারণত
ভেক্টর ড্রয়েবলসের জন্য ব্যবহার করা হয়) প্রত্যেকটি আপনার অ্যাপের রিসোর্স ফাইলের সাথে সম্পর্কিত।
dp গণনা করতে:
dp = (পিক্সেলে প্রস্থ * ১৬০) / স্ক্রিন ডেনসিটি
বেসলাইন গ্রিড
আন্ডারলায়িং গ্রিড ব্যবহার করে তৈরি করলে, আপনার UI জুড়ে স্পেসিং ও অ্যালাইনমেন্ট একই রকম থাকে। Android UI লেআউট, কম্পোনেন্ট ও স্পেসিংয়ের জন্য ৮ dp গ্রিড ব্যবহার করে।
আইকন, টাইপ ও কম্পোনেন্টের মধ্যে থাকা কিছু এলিমেন্টের মতো ছোট এলিমেন্ট ৪ dp গ্রিডের সাথে সবচেয়ে ভালভাবে অ্যালাইন করা হয়।
লেআউট গ্রিড
যেকোনও লেআউটের মূল ভিত্তি হল গ্রিড। কন্টেন্টের হায়ারার্কি, পরিমাণ এবং এমনকি মেসেজ বিবেচনা করুন।
হায়ারের্কিক্যাল গ্রিড
কন্টেন্টের গুরুত্ব বা হায়রার্কি মাথায় রেখে একটি হায়রার্কিক্যাল গ্রিড তৈরি করা হয়। সংবাদপত্রের লেআউটের কথা ভাবুন: একটি ধারাবাহিক শীর্ষ খবর লেআউটের বেশিরভাগ অংশ জুড়ে থাকে, অন্যদিকে একটি ছোট কলামে পুরনো নিবন্ধ দেখানো হয়।
বিভিন্ন স্ক্রিন সাইজ অনুযায়ী অ্যাডজাস্ট করার সময়, হায়ারার্কিক্যাল লেআউট রিফ্লো, রিসাইজ এবং গ্রিড সেল দেখাতে পারে।
মডিউলার গ্রিড
মডুলার গ্রিডকে একই ধরনের কলাম ও সারিতে সেট-আপ করা হয়, এর ফলে কন্টেন্টকে অ্যালাইন করার জন্য একটি আয়তাকার গ্রিড সিস্টেম তৈরি হয়। মডুলার গ্রিড এমন কন্টেন্টের জন্য ভালো কাজ করে যেগুলির গুরুত্ব ও সাইজ একই রকম হয়, যেমন কার্ড গ্যালারি।
অ্যাডাপ্টিভ মডুলার গ্রিড আরও গ্রিড সেল যোগ করতে পারে এবং এর মধ্যে থাকা কন্টেন্ট বিভিন্ন গ্রিড সেলে স্ন্যাপ বা র্যাপ করতে পারে। কন্টেন্টের প্রয়োজনীয়তা অনুযায়ী গ্রিড সেলগুলি একই সাইজের হতে পারে অথবা সাইজ পরিবর্তন করা যেতে পারে।
কলাম গ্রিড
কলামগুলি বডি এরিয়ার মধ্যে কন্টেন্ট ভাগ করে লেআউটকে উল্লম্ব সংজ্ঞা প্রদান করার জন্য একটি গ্রিড স্ট্রাকচার তৈরি করে। কলাম আছে এমন স্ক্রিনের জায়গায় কন্টেন্ট প্লেস করা হয়। কন্টেন্ট অ্যালাইন করতে, অন্তর্নিহিত গ্রিডের সাথে অ্যালাইন করুন, কিন্তু সাইজিং যেন ফ্লেক্সিবল হয়।
কীভাবে কলাম গ্রিড সেট-আপ করতে হয় এবং লেআউটের প্রাথমিক বিষয় থেকে কন্টেন্ট প্রয়োগ করতে হয় সেই সম্পর্কে প্রাথমিক বিষয়গুলি জানুন। কলামের সাইজ ও কলামের সংখ্যা পরিবর্তন করে কলাম গ্রিড বিভিন্ন ফর্ম ফ্যাক্টরকে অ্যাডজাস্ট করতে পারে। এটি নির্দিষ্ট পয়েন্টে স্ক্রিনের সাইজ অনুযায়ী করা হয় এবং কন্টেন্টকেও স্কেল করার অনুমতি দেওয়া হয়।
সাইজ ক্লাস
উইন্ডো সাইজ ক্লাস হল ভিউপোর্ট ব্রেকপয়েন্টের একটি সেট যা আপনাকে রেসপন্সিভ ও অ্যাডাপ্টিভ অ্যাপ্লিকেশন লেআউট ডিজাইন, ডেভেলপ ও টেস্ট করতে সাহায্য করে। Android উইন্ডো সাইজ ক্লাসকে ৩টি ভাগে ভাগ করে: কম্প্যাক্ট, মিডিয়াম ও এক্সপ্যান্ডেড। উইন্ডো সাইজ ক্লাস সম্পর্কে আরও জানুন।
অ্যাস্পেক্ট রেশিও
অ্যাস্পেক্ট রেশিও হল কোনও এলিমেন্টের প্রস্থ ও উচ্চতার অনুপাত। আয়তন অনুপাতকে প্রস্থ:দৈর্ঘ্য হিসেবে লেখা হয়।
লেআউটে সামঞ্জস্য বজায় রাখতে, ছবি, সারফেস ও স্ক্রিনের সাইজের মতো এলিমেন্টে সামঞ্জস্যপূর্ণ অ্যাস্পেক্ট রেশিও ব্যবহার করুন।
আপনার UI জুড়ে ব্যবহার করার জন্য নিম্নলিখিত অ্যাস্পেক্ট রেশিও সাজেস্ট করা হয়:
- ১৬:৯
- ৩:২
- ৪:৩
- ১:১
- ৩:৪
- ২:৩