ভিউ সহ একটি UI বিকাশ করুন

Jetpack Compose implementation arrow_forward

লেআউট এডিটর আপনাকে লেআউট XML লেখার পরিবর্তে UI এলিমেন্টগুলোকে একটি ভিজ্যুয়াল ডিজাইন এডিটরে ড্র্যাগ করে দ্রুত View -ভিত্তিক লেআউট তৈরি করতে সক্ষম করে। এই ডিজাইন এডিটরটি বিভিন্ন অ্যান্ড্রয়েড ডিভাইস এবং সংস্করণে আপনার লেআউটের প্রিভিউ দেখাতে পারে এবং বিভিন্ন স্ক্রিন সাইজে এটি সঠিকভাবে কাজ করছে কিনা তা নিশ্চিত করতে আপনি লেআউটটিকে ডায়নামিকভাবে রিসাইজ করতে পারেন।

ConstraintLayout ব্যবহার করে লেআউট তৈরি করার ক্ষেত্রে লেআউট এডিটর বিশেষভাবে শক্তিশালী।

এই পৃষ্ঠায় লেআউট এডিটর সম্পর্কে একটি সংক্ষিপ্ত বিবরণ দেওয়া হয়েছে। লেআউটের মৌলিক বিষয়গুলো সম্পর্কে আরও জানতে, লেআউটস (Layouts) দেখুন।

লেআউট এডিটরের পরিচিতি

একটি XML লেআউট ফাইল খুললে লেআউট এডিটরটি প্রদর্শিত হয়।

1. প্যালেট : এতে বিভিন্ন ভিউ এবং ভিউ গ্রুপ থাকে যা আপনি আপনার লেআউটে ড্র্যাগ করে আনতে পারেন।
2. কম্পোনেন্ট ট্রি : আপনার লেআউটে কম্পোনেন্টগুলোর ক্রমবিন্যাস দেখায়।
3. টুলবার : এতে এমন বাটন রয়েছে যা এডিটরে আপনার লেআউটের চেহারা কনফিগার করে এবং লেআউটের বৈশিষ্ট্য পরিবর্তন করে।
4. ডিজাইন এডিটর : এটি আপনাকে ডিজাইন ভিউ, ব্লুপ্রিন্ট ভিউ অথবা উভয়টিতেই আপনার লেআউট সম্পাদনা করার সুযোগ দেয়।
5. অ্যাট্রিবিউটস : নির্বাচিত ভিউয়ের অ্যাট্রিবিউটগুলো নিয়ন্ত্রণের জন্য কন্ট্রোল রয়েছে।
6. ভিউ মোড : এটি আপনাকে কোড ভিউ মোডে আপনার লেআউট দেখার সুযোগ দেয়। , বিভক্ত অথবা ডিজাইন মোডসমূহ। স্প্লিট মোডে কোড এবং ডিজাইন উইন্ডো একই সাথে প্রদর্শিত হয়।
7. জুম ও প্যান কন্ট্রোল : এডিটরের মধ্যে প্রিভিউয়ের আকার ও অবস্থান নিয়ন্ত্রণ করে।

যখন আপনি একটি XML লেআউট ফাইল খোলেন, তখন ডিফল্টরূপে ডিজাইন এডিটরটি খোলে, যেমনটি চিত্র ১-এ দেখানো হয়েছে। টেক্সট এডিটরে লেআউট XML সম্পাদনা করতে, Code- এ ক্লিক করুন। উইন্ডোর উপরের ডান কোণায় থাকা বাটন। উল্লেখ্য যে, কোড ভিউতে আপনার লেআউট সম্পাদনা করার সময় প্যালেট , কম্পোনেন্ট ট্রি এবং অ্যাট্রিবিউটস প্যানেলগুলো উপলব্ধ থাকে না।

পরামর্শ: ডিজাইন ও টেক্সট এডিটরের মধ্যে পরিবর্তন করতে, Alt (macOS-এ Control ) এর সাথে Shift এবং ডান বা বাম অ্যারো কী চাপুন।

প্রিভিউয়ের চেহারা পরিবর্তন করুন

ডিজাইন এডিটরের উপরের সারির বাটনগুলো আপনাকে এডিটরের মধ্যে আপনার লেআউটের চেহারা কনফিগার করতে দেয়।

1. ডিজাইন ও ব্লুপ্রিন্ট : এডিটরে আপনার লেআউটটি কীভাবে দেখতে চান তা নির্বাচন করুন। এছাড়াও, এই ভিউ টাইপগুলোর মধ্যে পর্যায়ক্রমে পরিবর্তন করার জন্য আপনি B চাপতে পারেন।
   • আপনার লেআউটের রেন্ডার করা প্রিভিউ দেখতে ডিজাইন নির্বাচন করুন।
   • প্রতিটি দৃশ্যের শুধু রূপরেখা দেখতে ব্লুপ্রিন্ট নির্বাচন করুন।
   • উভয় ভিউ পাশাপাশি দেখতে ডিজাইন + ব্লুপ্রিন্ট বেছে নিন।
2. স্ক্রিন ওরিয়েন্টেশন এবং লেআউট ভ্যারিয়েন্ট : ল্যান্ডস্কেপ বা পোর্ট্রেট স্ক্রিন ওরিয়েন্টেশনের মধ্যে থেকে বেছে নিন অথবা অন্যান্য স্ক্রিন মোড বেছে নিন, যেগুলোর জন্য আপনার অ্যাপ বিকল্প লেআউট সরবরাহ করে, যেমন নাইট মোড। এই মেনুতে একটি নতুন লেআউট ভ্যারিয়েন্ট তৈরি করার কমান্ডও রয়েছে, যেমনটি এই পৃষ্ঠার একটি বিভাগে বর্ণনা করা হয়েছে। ওরিয়েন্টেশন পরিবর্তন করার জন্য আপনি আপনার কীবোর্ডের O অক্ষরটিও চাপতে পারেন।

3. সিস্টেম UI মোড : আপনি যদি আপনার অ্যাপে ডাইনামিক কালার চালু করে থাকেন, তাহলে ওয়ালপেপার পরিবর্তন করে দেখুন বিভিন্ন ব্যবহারকারীর নির্বাচিত ওয়ালপেপারে আপনার লেআউটগুলো কীভাবে সাড়া দেয়। মনে রাখবেন, আপনাকে প্রথমে থিমটি একটি ম্যাটেরিয়াল ডাইনামিক কালার থিমে পরিবর্তন করতে হবে, তারপর ওয়ালপেপার পরিবর্তন করতে হবে।

4. ডিভাইসের ধরন এবং আকার : ডিভাইসের ধরন (ফোন/ট্যাবলেট, অ্যান্ড্রয়েড টিভি, বা ওয়্যার ওএস) এবং স্ক্রিন কনফিগারেশন (আকার এবং ঘনত্ব) নির্বাচন করুন। আপনি আগে থেকে কনফিগার করা বেশ কয়েকটি ডিভাইসের ধরন এবং আপনার নিজস্ব এভিডি ডেফিনিশন থেকে বেছে নিতে পারেন, এবং চিত্র ৩-এ দেখানো অনুযায়ী তালিকা থেকে 'অ্যাড ডিভাইস ডেফিনিশন' নির্বাচন করে একটি নতুন এভিডি তৈরি করতে পারেন।

   • ডিভাইসটির আকার পরিবর্তন করতে লেআউটের নিচের-ডান কোণাটি টেনে ধরুন।
   • ডিভাইস তালিকাটি পর্যায়ক্রমে দেখতে D চাপুন।

   এই মেনুতে থাকা রেফারেন্স ডিভাইসগুলোর সাথে আপনার লেআউট পরীক্ষা করলে, আপনার অ্যাপটি আসল ডিভাইসের লেআউট স্টেটগুলোর সাথে ভালোভাবে খাপ খাইয়ে নিতে পারে।

   

5. এপিআই সংস্করণ : আপনার লেআউট প্রিভিউ করার জন্য অ্যান্ড্রয়েডের সংস্করণ নির্বাচন করুন। উপলব্ধ অ্যান্ড্রয়েড সংস্করণগুলির তালিকা নির্ভর করে আপনি এসডিকে ম্যানেজার ব্যবহার করে কোন এসডিকে প্ল্যাটফর্ম সংস্করণগুলি ইনস্টল করেছেন তার উপর।

6. অ্যাপ থিম : প্রিভিউতে কোন UI থিমটি প্রয়োগ করতে হবে তা নির্বাচন করুন। এটি শুধুমাত্র সমর্থিত লেআউট স্টাইলগুলির জন্য কাজ করে, তাই এই তালিকার অনেক থিম একটি ত্রুটির কারণ হয়।

7. ভাষা : আপনার UI স্ট্রিংগুলির জন্য যে ভাষাটি প্রদর্শন করতে চান, তা নির্বাচন করুন। এই তালিকাটি শুধুমাত্র আপনার স্ট্রিং রিসোর্সগুলিতে উপলব্ধ ভাষাগুলিই প্রদর্শন করে। আপনি যদি আপনার অনুবাদগুলি সম্পাদনা করতে চান, তাহলে মেনু থেকে ‘অনুবাদ সম্পাদনা করুন’ (Edit Translations)- এ ক্লিক করুন। অনুবাদ নিয়ে কাজ করার বিষয়ে আরও তথ্যের জন্য, ‘অনুবাদ সম্পাদক’ (Translations Editor) দিয়ে UI-কে স্থানীয়করণ করুন (Localize the UI with Translations Editor ) দেখুন।

একটি নতুন লেআউট তৈরি করুন

আপনার অ্যাপের জন্য একটি নতুন লেআউট যোগ করার সময়, প্রথমে আপনার প্রোজেক্টের `default layout/ ডিরেক্টরিতে একটি ডিফল্ট লেআউট ফাইল তৈরি করুন, যাতে এটি সমস্ত ডিভাইস কনফিগারেশনে প্রযোজ্য হয়। একবার আপনার একটি ডিফল্ট লেআউট তৈরি হয়ে গেলে, আপনি এই পৃষ্ঠার একটি বিভাগে বর্ণিত পদ্ধতি অনুসারে, নির্দিষ্ট ডিভাইস কনফিগারেশনের জন্য, যেমন বড় পর্দার জন্য, লেআউটের বিভিন্ন রূপ তৈরি করতে পারেন।

আপনি নিম্নলিখিত উপায়গুলির মধ্যে যেকোনো একটি ব্যবহার করে একটি নতুন লেআউট তৈরি করতে পারেন:

অ্যান্ড্রয়েড স্টুডিওর প্রধান মেনু ব্যবহার করুন

1. প্রজেক্ট উইন্ডোতে, যে মডিউলটিতে আপনি লেআউট যোগ করতে চান, সেটিতে ক্লিক করুন।
2. প্রধান মেনু থেকে ফাইল > নতুন > এক্সএমএল > লেআউট এক্সএমএল ফাইল নির্বাচন করুন।
3. প্রদর্শিত ডায়ালগ বক্সে ফাইলের নাম, রুট লেআউট ট্যাগ এবং লেআউটটি যে সোর্স সেটের অন্তর্গত, তা প্রদান করুন।
4. লেআউটটি তৈরি করতে ফিনিশ-এ ক্লিক করুন।

প্রজেক্ট ভিউ ব্যবহার করুন

1. প্রজেক্ট উইন্ডোর ভেতর থেকে প্রজেক্ট ভিউ নির্বাচন করুন।
2. লেআউট ডিরেক্টরিতে যেখানে আপনি লেআউটটি যোগ করতে চান, সেখানে রাইট-ক্লিক করুন।
3. প্রদর্শিত কনটেক্সট মেনুতে, New > Layout Resource File-এ ক্লিক করুন।

অ্যান্ড্রয়েড ভিউ ব্যবহার করুন

1. প্রজেক্ট উইন্ডোর ভেতর থেকে অ্যান্ড্রয়েড ভিউ নির্বাচন করুন।
2. layout ফোল্ডারটিতে ডান-ক্লিক করুন।
3. প্রদর্শিত কনটেক্সট মেনু থেকে New > Layout Resource File নির্বাচন করুন।

রিসোর্স ম্যানেজার ব্যবহার করুন

1. রিসোর্স ম্যানেজার- এ, লেআউট ট্যাবটি নির্বাচন করুন।
2. + বোতামে ক্লিক করুন, এবং তারপরে লেআউট রিসোর্স ফাইলে ক্লিক করুন।

বিভিন্ন স্ক্রিনের জন্য অপ্টিমাইজ করতে লেআউট ভ্যারিয়েন্ট ব্যবহার করুন।

লেআউট ভ্যারিয়েন্ট হলো বিদ্যমান কোনো লেআউটের একটি বিকল্প সংস্করণ, যা একটি নির্দিষ্ট স্ক্রিন সাইজ বা ওরিয়েন্টেশনের জন্য অপ্টিমাইজ করা হয়।

একটি প্রস্তাবিত লেআউট ভ্যারিয়েন্ট ব্যবহার করুন

অ্যান্ড্রয়েড স্টুডিওতে কিছু প্রচলিত লেআউট ভ্যারিয়েন্ট রয়েছে যা আপনি আপনার প্রজেক্টে ব্যবহার করতে পারেন। কোনো প্রস্তাবিত লেআউট ভ্যারিয়েন্ট ব্যবহার করতে, নিম্নলিখিত পদক্ষেপগুলো অনুসরণ করুন:

1. আপনার ডিফল্ট লেআউট ফাইলটি খুলুন।
2. ডিজাইনটি ক্লিক করুন উইন্ডোর উপরের ডান কোণায় থাকা আইকন।
3. লেআউট ফাইলের নামটি ‘অ্যাকশন টু সুইচ অ্যান্ড ক্রিয়েট কোয়ালিফায়ার্স ফর লেআউট ফাইলস’ ড্রপ-ডাউনে দেখা যায়। ড্রপ-ডাউনটি নির্বাচন করুন।
4. ড্রপ-ডাউন তালিকা থেকে 'Create Landscape Qualifier' বা 'Create Tablet Qualifier'- এর মতো একটি বিকল্প নির্বাচন করুন।

   

একটি নতুন লেআউট ডিরেক্টরি তৈরি করা হয়েছে।

আপনার নিজস্ব লেআউট সংস্করণ তৈরি করুন

আপনি যদি আপনার নিজস্ব লেআউট সংস্করণ তৈরি করতে চান, তাহলে নিম্নলিখিতগুলি করুন:

1. আপনার ডিফল্ট লেআউট ফাইলটি খুলুন।
2. ডিজাইনটি ক্লিক করুন উইন্ডোর উপরের ডান কোণায় থাকা আইকন।
3. লেআউট ফাইলের নামটি ‘অ্যাকশন টু সুইচ অ্যান্ড ক্রিয়েট কোয়ালিফায়ার্স ফর লেআউট ফাইলস’ ড্রপ-ডাউনে দেখা যায়। ড্রপ-ডাউনটি নির্বাচন করুন।

4. ড্রপ-ডাউন তালিকা থেকে ‘Add Resource Qualifier’ নির্বাচন করুন। (উপরের চিত্র ৪ দেখুন।)

   রিসোর্স ডিরেক্টরি নির্বাচন করার ডায়ালগ বক্সটি প্রদর্শিত হবে।

5. 'রিসোর্স ডিরেক্টরি নির্বাচন করুন' ডায়ালগে, ভ্যারিয়েন্টটির জন্য রিসোর্স কোয়ালিফায়ারগুলো সংজ্ঞায়িত করুন:

   1. উপলব্ধ কোয়ালিফায়ার তালিকা থেকে একটি কোয়ালিফায়ার নির্বাচন করুন।
   2. যোগ করুন ক্লিক করুন বোতাম।
   3. প্রয়োজনীয় মানগুলো প্রবেশ করান।
   4. অন্যান্য কোয়ালিফায়ার যোগ করতে এই ধাপগুলো পুনরাবৃত্তি করুন।

6. আপনার সমস্ত কোয়ালিফায়ার যোগ করা হয়ে গেলে, OK-তে ক্লিক করুন।

যখন আপনার একই লেআউটের একাধিক সংস্করণ থাকে, তখন আপনি 'অ্যাকশন টু সুইচ অ্যান্ড ক্রিয়েট কোয়ালিফায়ার্স ফর লেআউট ফাইলস' ড্রপ-ডাউন থেকে একটি সংস্করণ নির্বাচন করে সেগুলোর মধ্যে পরিবর্তন করতে পারেন।

বিভিন্ন ডিসপ্লের জন্য লেআউট তৈরি করার পদ্ধতি সম্পর্কে আরও তথ্যের জন্য, ‘বিভিন্ন ডিসপ্লে সাইজ সাপোর্ট’ দেখুন।

একটি ভিউ বা লেআউট রূপান্তর করুন

আপনি একটি ভিউকে অন্য ধরনের ভিউতে এবং একটি লেআউটকে অন্য ধরনের লেআউটে রূপান্তর করতে পারেন:

1. এডিটর উইন্ডোর উপরের ডান কোণায় থাকা ডিজাইন বাটনটিতে ক্লিক করুন।
2. কম্পোনেন্ট ট্রি- তে, ভিউ বা লেআউটের উপর রাইট-ক্লিক করুন এবং তারপরে 'কনভার্ট ভিউ'-তে ক্লিক করুন।
3. প্রদর্শিত ডায়ালগ বক্সে, নতুন ধরনের ভিউ বা লেআউট বেছে নিন এবং তারপরে 'Apply'-তে ক্লিক করুন।

একটি লেআউটকে ConstraintLayout-এ রূপান্তর করুন

লেআউটের উন্নত পারফরম্যান্সের জন্য, পুরোনো লেআউটগুলোকে ConstraintLayout এ রূপান্তর করুন। ConstraintLayout একটি কনস্ট্রেইন্ট-ভিত্তিক লেআউট সিস্টেম ব্যবহার করে, যা আপনাকে কোনো নেস্টেড ভিউ গ্রুপ ছাড়াই বেশিরভাগ লেআউট তৈরি করতে দেয়।

বিদ্যমান কোনো লেআউটকে ConstraintLayout এ রূপান্তর করতে, নিম্নলিখিত পদক্ষেপগুলো অনুসরণ করুন:

1. অ্যান্ড্রয়েড স্টুডিওতে একটি বিদ্যমান লেআউট খুলুন।
2. ডিজাইনটি ক্লিক করুন এডিটর উইন্ডোর উপরের ডান কোণায় থাকা আইকন।
3. কম্পোনেন্ট ট্রি- তে, লেআউটটির উপর রাইট-ক্লিক করুন এবং তারপরে 'Convert your-layout-type to ConstraintLayout'-এ ক্লিক করুন।

ConstraintLayout সম্পর্কে আরও জানতে, Build a Responsive UI with ConstraintLayout দেখুন।

প্যালেটে আইটেমগুলি খুঁজুন

প্যালেটে নাম দিয়ে কোনো ভিউ বা ভিউ গ্রুপ খুঁজতে, সার্চ- এ ক্লিক করুন। প্যালেটের শীর্ষে থাকা বাটন। বিকল্পভাবে, যখন প্যালেট উইন্ডোতে ফোকাস থাকে, তখন আপনি আইটেমটির নাম টাইপ করতে পারেন।

প্যালেটে , আপনি প্রায়শই ব্যবহৃত আইটেমগুলো 'কমন' ক্যাটাগরিতে খুঁজে পাবেন। এই ক্যাটাগরিতে কোনো আইটেম যোগ করতে, প্যালেটের কোনো ভিউ বা ভিউ গ্রুপের উপর রাইট-ক্লিক করুন এবং তারপর কনটেক্সট মেনু থেকে 'ফেভারিট'-এ ক্লিক করুন।

প্যালেট থেকে ডকুমেন্টেশন খুলুন

কোনো ভিউ বা ভিউ গ্রুপের অ্যান্ড্রয়েড ডেভেলপারস রেফারেন্স ডকুমেন্টেশন খুলতে, প্যালেট থেকে UI এলিমেন্টটি সিলেক্ট করে Shift + F1 চাপুন।

কোনো ভিউ বা ভিউ গ্রুপের জন্য ম্যাটেরিয়াল গাইডলাইনস ডকুমেন্টেশন দেখতে, প্যালেটে থাকা UI এলিমেন্টটির উপর রাইট-ক্লিক করুন এবং কনটেক্সট মেনু থেকে ম্যাটেরিয়াল গাইডলাইনস নির্বাচন করুন। যদি আইটেমটির জন্য কোনো নির্দিষ্ট এন্ট্রি না থাকে, তাহলে এই কমান্ডটি ম্যাটেরিয়াল গাইডলাইনস ডকুমেন্টেশনের হোমপেজটি খুলে দেবে।

আপনার লেআউটে ভিউ যোগ করুন

আপনার লেআউট তৈরি করা শুরু করতে, প্যালেট থেকে ভিউ এবং ভিউ গ্রুপগুলিকে ডিজাইন এডিটরে ড্র্যাগ করুন। আপনি যখন লেআউটে একটি ভিউ স্থাপন করবেন, এডিটরটি লেআউটের বাকি অংশের সাথে ভিউটির সম্পর্ক সম্পর্কে তথ্য প্রদর্শন করবে।

আপনি যদি ConstraintLayout ব্যবহার করেন, তাহলে Infer Constraints এবং Autoconnect ফিচারগুলো ব্যবহার করে স্বয়ংক্রিয়ভাবে কনস্ট্রেইন্ট তৈরি করতে পারেন।

ভিউ অ্যাট্রিবিউট সম্পাদনা করুন

আপনি লেআউট এডিটরের অ্যাট্রিবিউটস প্যানেল থেকে ভিউ অ্যাট্রিবিউটগুলো সম্পাদনা করতে পারেন। এই উইন্ডোটি শুধুমাত্র ডিজাইন এডিটর খোলা থাকলেই পাওয়া যায়, তাই এটি ব্যবহার করার জন্য আপনার লেআউটটি ডিজাইন অথবা স্প্লিট মোডে দেখুন।

আপনি যখন কোনো ভিউ নির্বাচন করেন, তা কম্পোনেন্ট ট্রি -তে ভিউটিতে ক্লিক করেই হোক বা ডিজাইন এডিটরেই হোক, অ্যাট্রিবিউটস প্যানেলটি নিম্নলিখিত বিষয়গুলো প্রদর্শন করে, যেমনটি চিত্র ৫-এ দেখানো হয়েছে:

1. ঘোষিত অ্যাট্রিবিউটসমূহ : লেআউট ফাইলে নির্দিষ্ট করা অ্যাট্রিবিউটগুলোর তালিকা। কোনো অ্যাট্রিবিউট যোগ করতে, ' যোগ করুন' বোতামে ক্লিক করুন। সেকশনের শীর্ষে থাকা বাটন।
2. লেআউট : এতে ভিউ-এর প্রস্থ এবং উচ্চতা নিয়ন্ত্রণের ব্যবস্থা থাকে। যদি ভিউটি একটি ConstraintLayout মধ্যে থাকে, তাহলে এই অংশে কনস্ট্রেইন্ট বায়াসও দেখানো হয় এবং ভিউটি যে কনস্ট্রেইন্টগুলো ব্যবহার করে তার একটি তালিকা দেওয়া থাকে। ConstraintLayout ব্যবহার করে ভিউ-এর আকার নিয়ন্ত্রণ করার বিষয়ে আরও তথ্যের জন্য, “ভিউ-এর আকার সামঞ্জস্য করুন” দেখুন।
3. সাধারণ অ্যাট্রিবিউটসমূহ : নির্বাচিত ভিউটির সাধারণ অ্যাট্রিবিউটগুলোর তালিকা দেখায়। সমস্ত উপলব্ধ অ্যাট্রিবিউট দেখতে, উইন্ডোর নিচের দিকে থাকা ' সমস্ত অ্যাট্রিবিউট' (All Attributes) অংশটি প্রসারিত করুন।
4. অনুসন্ধান : এর মাধ্যমে আপনি একটি নির্দিষ্ট ভিউ অ্যাট্রিবিউট অনুসন্ধান করতে পারবেন।

5. প্রতিটি অ্যাট্রিবিউট মানের ডানদিকে থাকা আইকনগুলো নির্দেশ করে যে অ্যাট্রিবিউট মানগুলো রিসোর্স রেফারেন্স কিনা। এই নির্দেশকগুলো নিরেট। যখন মানটি একটি রিসোর্স রেফারেন্স এবং খালি যখন মানটি হার্ডকোড করা থাকে, তখন আপনাকে এক নজরে হার্ডকোড করা মান চিনতে সাহায্য করার জন্য এটি করা হয়।

   যেকোনো অবস্থায় থাকা ইন্ডিকেটরগুলোতে ক্লিক করলে রিসোর্স ডায়ালগটি খুলবে, যেখানে আপনি সংশ্লিষ্ট অ্যাট্রিবিউটের জন্য একটি রিসোর্স রেফারেন্স নির্বাচন করতে পারবেন।

6. কোনো অ্যাট্রিবিউট মানের চারপাশে লাল হাইলাইট থাকলে তা মানটিতে কোনো ত্রুটি নির্দেশ করে। উদাহরণস্বরূপ, একটি ত্রুটি লেআউট-সংজ্ঞায়িত অ্যাট্রিবিউটের জন্য একটি অবৈধ এন্ট্রি নির্দেশ করতে পারে।

   কমলা রঙের হাইলাইট মানটির জন্য একটি সতর্কবার্তা নির্দেশ করে। উদাহরণস্বরূপ, যেখানে একটি রিসোর্স রেফারেন্স প্রত্যাশিত, সেখানে আপনি একটি হার্ডকোডেড মান ব্যবহার করলে একটি সতর্কবার্তা প্রদর্শিত হতে পারে।

আপনার ভিউতে নমুনা ডেটা যোগ করুন

যেহেতু অনেক অ্যান্ড্রয়েড লেআউট রানটাইম ডেটার উপর নির্ভর করে, তাই আপনার অ্যাপ ডিজাইন করার সময় একটি লেআউটের চেহারা ও অনুভূতি কল্পনা করা কঠিন হতে পারে। আপনি লেআউট এডিটরের ভেতর থেকে একটি TextView , একটি ImageView , বা একটি RecyclerView তে নমুনা প্রিভিউ ডেটা যোগ করতে পারেন।

ডিজাইন-টাইম ভিউ অ্যাট্রিবিউটস উইন্ডোটি প্রদর্শন করতে, এই ভিউ টাইপগুলির যেকোনো একটিতে রাইট-ক্লিক করুন এবং চিত্র ৬-এ দেখানো অনুযায়ী ‘সেট স্যাম্পল ডেটা’ (Set Sample Data) নির্বাচন করুন।

একটি TextView জন্য, আপনি বিভিন্ন নমুনা টেক্সট ক্যাটাগরি থেকে বেছে নিতে পারেন। নমুনা টেক্সট ব্যবহার করার সময়, Android Studio আপনার নির্বাচিত নমুনা ডেটা দিয়ে TextView এর text অ্যাট্রিবিউটটি পূরণ করে দেয়। মনে রাখবেন যে, আপনি Design-time View Attributes উইন্ডোর মাধ্যমে নমুনা টেক্সট বেছে নিতে পারবেন শুধুমাত্র যদি text অ্যাট্রিবিউটটি খালি থাকে।

একটি ImageView জন্য, আপনি বিভিন্ন নমুনা ছবির মধ্য থেকে বেছে নিতে পারেন। যখন আপনি একটি নমুনা ছবি বেছে নেন, তখন Android Studio ImageView টির tools:src অ্যাট্রিবিউটটি পূরণ করে দেয় (অথবা AndroidX ব্যবহার করলে tools:srcCompat )।

RecyclerView জন্য, আপনি কিছু টেমপ্লেট থেকে বেছে নিতে পারেন যেগুলোতে নমুনা ছবি এবং লেখা থাকে। এই টেমপ্লেটগুলো ব্যবহার করার সময়, Android Studio আপনার res/layout ডিরেক্টরিতে recycler_view_item.xml একটি ফাইল যোগ করে, যেটিতে নমুনা ডেটার লেআউট থাকে। নমুনা ডেটা সঠিকভাবে প্রদর্শন করার জন্য Android Studio RecyclerView তে মেটাডেটাও যোগ করে।

লেআউটের সতর্কতা এবং ত্রুটিগুলি দেখান

লেআউট এডিটর কম্পোনেন্ট ট্রিতে সংশ্লিষ্ট ভিউয়ের পাশে একটি লাল বৃত্তাকার বিস্ময়সূচক আইকন ব্যবহার করে যেকোনো লেআউট সমস্যা সম্পর্কে আপনাকে অবহিত করে। ভুলের জন্য অথবা একটি কমলা ত্রিভুজ বিস্ময়সূচক আইকন সতর্কবার্তার জন্য। আরও বিস্তারিত দেখতে আইকনটিতে ক্লিক করুন।

এডিটরের নিচের একটি উইন্ডোতে সমস্ত জ্ঞাত সমস্যা দেখতে, 'সতর্কতা এবং ত্রুটি দেখান' (Show Warnings and Errors ) এ ক্লিক করুন। অথবা টুলবারে )

ফন্ট ডাউনলোড করুন এবং টেক্সটে প্রয়োগ করুন।

অ্যান্ড্রয়েড ৮.০ (এপিআই লেভেল ২৬) অথবা জেটপ্যাক কোর লাইব্রেরি ব্যবহার করার সময়, আপনি এই ধাপগুলো অনুসরণ করে শত শত ফন্ট থেকে বেছে নিতে পারেন:

1. লেআউট এডিটরে, ডিজাইন- এ ক্লিক করুন। ডিজাইন এডিটরে আপনার লেআউট দেখার জন্য আইকনটি ব্যবহার করুন।
2. একটি টেক্সট ভিউ নির্বাচন করুন।
3. অ্যাট্রিবিউটস প্যানেলে, textAppearance প্রসারিত করুন এবং তারপরে fontFamily বক্সটি প্রসারিত করুন।
4. তালিকার একদম নিচে স্ক্রোল করুন এবং রিসোর্সেস ডায়ালগটি খুলতে ‘More Fonts’- এ ক্লিক করুন।
5. রিসোর্স ডায়ালগে, একটি ফন্ট নির্বাচন করতে, তালিকাটি ব্রাউজ করুন অথবা উপরের সার্চ বারে টাইপ করুন। আপনি যদি ডাউনলোডযোগ্য (Downloadable) এর অধীনে একটি ফন্ট নির্বাচন করেন, তাহলে আপনি হয় রানটাইমে ফন্টটিকে একটি ডাউনলোডযোগ্য ফন্ট হিসাবে লোড করতে 'Create downloadable font'-এ ক্লিক করতে পারেন অথবা আপনার APK-তে TTF ফন্ট ফাইলটি প্যাকেজ করতে 'Add font to project'- এ ক্লিক করতে পারেন। অ্যান্ড্রয়েডের অধীনে তালিকাভুক্ত ফন্টগুলি অ্যান্ড্রয়েড সিস্টেম দ্বারা সরবরাহ করা হয়, তাই সেগুলি ডাউনলোড করার বা আপনার APK-তে বান্ডল করার প্রয়োজন নেই।
6. শেষ করতে OK ক্লিক করুন।

লেআউট বৈধতা

লেআউট ভ্যালিডেশন হলো একটি ভিজ্যুয়াল টুল, যা আপনাকে একই সাথে বিভিন্ন ডিভাইস এবং ডিসপ্লে কনফিগারেশনের লেআউট প্রিভিউ করার সুযোগ দেয় এবং প্রক্রিয়ার শুরুতেই আপনার লেআউটের সমস্যাগুলো ধরতে সাহায্য করে। এই ফিচারটি ব্যবহার করতে, IDE উইন্ডোর উপরের ডান কোণায় থাকা লেআউট ভ্যালিডেশন ট্যাবে ক্লিক করুন:

চিত্র ১০। লেআউট যাচাইকরণ ট্যাব।

উপলব্ধ কনফিগারেশন সেটগুলির মধ্যে পরিবর্তন করতে, লেআউট ভ্যালিডেশন উইন্ডোর শীর্ষে থাকা রেফারেন্স ডিভাইস ড্রপ-ডাউন থেকে নিম্নলিখিতগুলির মধ্যে একটি নির্বাচন করুন:

• রেফারেন্স ডিভাইস
• কাস্টম
• বর্ণান্ধ
• ফন্টের আকার

চিত্র ১১। রেফারেন্স ডিভাইস ড্রপ-ডাউন।

রেফারেন্স ডিভাইস

রেফারেন্স ডিভাইস হলো এমন কিছু ডিভাইসের একটি সেট, যেগুলোর সাথে পরীক্ষা করার জন্য আমরা আপনাকে সুপারিশ করি। এগুলোর মধ্যে ফোন, ফোল্ডেবল, ট্যাবলেট এবং ডেস্কটপ ইন্টারফেস অন্তর্ভুক্ত। এই রেফারেন্স ডিভাইসগুলোতে আপনার লেআউটটি কেমন দেখায়, তা আপনার প্রিভিউ করে দেখা উচিত:

চিত্র ১২। লেআউট ভ্যালিডেশন টুলে রেফারেন্স ডিভাইসের প্রিভিউ।

কাস্টম

প্রিভিউ করার জন্য ডিসপ্লে কনফিগারেশন কাস্টমাইজ করতে, ভাষা, ডিভাইস বা স্ক্রিন ওরিয়েন্টেশন সহ বিভিন্ন সেটিংস থেকে বেছে নিন:

চিত্র ১৬। লেআউট ভ্যালিডেশন টুলে একটি কাস্টম ডিসপ্লে কনফিগার করুন।

বর্ণান্ধ

বর্ণান্ধ ব্যবহারকারীদের জন্য আপনার অ্যাপটিকে আরও সহজগম্য করে তুলতে, সাধারণ ধরনের বর্ণান্ধতার সিমুলেশনের মাধ্যমে আপনার লেআউটটি যাচাই করুন:

চিত্র ১৩। লেআউট ভ্যালিডেশন টুলে বর্ণান্ধতা সিমুলেশনের প্রিভিউ।

ফন্টের আকার

বিভিন্ন ফন্ট সাইজে আপনার লেআউটগুলো যাচাই করুন এবং বড় ফন্ট ব্যবহার করে পরীক্ষা করার মাধ্যমে দৃষ্টি প্রতিবন্ধী ব্যবহারকারীদের জন্য আপনার অ্যাপের অ্যাক্সেসিবিলিটি উন্নত করুন:

চিত্র ১৪। লেআউট ভ্যালিডেশন টুলে পরিবর্তনশীল ফন্ট সাইজের প্রিভিউ।