ক্যানোনিকাল লেআউটগুলি প্রমাণিত, বহুমুখী লেআউট যা বিভিন্ন ফর্ম ফ্যাক্টরের উপর সর্বোত্তম ব্যবহারকারীর অভিজ্ঞতা প্রদান করে।
ক্যানোনিকাল লেআউটগুলি ছোট স্ক্রিনের ফোনের পাশাপাশি ট্যাবলেট, ফোল্ডেবল এবং ChromeOS ডিভাইসগুলিকেও সমর্থন করে। মেটেরিয়াল ডিজাইন নির্দেশিকা থেকে প্রাপ্ত, লেআউটগুলি নান্দনিক এবং কার্যকরী উভয়ই।
অ্যান্ড্রয়েড ফ্রেমওয়ার্কে বিশেষায়িত উপাদান রয়েছে যা লেআউটগুলির বাস্তবায়নকে সহজ এবং নির্ভরযোগ্য করে তোলে।
ক্যানোনিকাল লেআউটগুলি আকর্ষণীয়, উৎপাদনশীলতা-বর্ধক UI তৈরি করে যা দুর্দান্ত অ্যাপগুলির ভিত্তি তৈরি করে।
তালিকা-বিস্তারিত
তালিকা-বিস্তারিত লেআউট ব্যবহারকারীদের বর্ণনামূলক, ব্যাখ্যামূলক, বা অন্যান্য সম্পূরক তথ্য - আইটেমের বিবরণ - সহ আইটেমের তালিকা অন্বেষণ করতে সক্ষম করে।
লেআউটটি অ্যাপ উইন্ডোটিকে দুটি পাশাপাশি দুটি প্যানে বিভক্ত করে: একটি তালিকার জন্য, একটি বিশদের জন্য। ব্যবহারকারীরা আইটেমের বিশদ প্রদর্শনের জন্য তালিকা থেকে আইটেম নির্বাচন করেন। বিশদের মধ্যে থাকা ডিপ লিঙ্কগুলি বিশদের প্যানে অতিরিক্ত সামগ্রী প্রকাশ করে।
প্রসারিত-প্রস্থ প্রদর্শন ( উইন্ডো আকারের ক্লাস ব্যবহার করুন দেখুন) একই সাথে তালিকা এবং বিশদ উভয়কেই সমন্বিত করে। একটি তালিকা আইটেম নির্বাচন নির্বাচিত আইটেমের জন্য সম্পর্কিত সামগ্রী দেখানোর জন্য বিশদ ফলক আপডেট করে।
মাঝারি এবং কমপ্যাক্ট-প্রস্থের ডিসপ্লেগুলি অ্যাপের সাথে ব্যবহারকারীর মিথস্ক্রিয়ার উপর নির্ভর করে তালিকা বা বিশদ প্রদর্শন করে। যখন কেবল তালিকাটি দৃশ্যমান হয়, তখন তালিকার আইটেম নির্বাচন করলে তালিকার পরিবর্তে বিশদ প্রদর্শন করা হয়। যখন কেবল বিশদটি দৃশ্যমান হয়, তখন পিছনের বোতাম টিপলে তালিকাটি পুনরায় প্রদর্শিত হয়।
ডিভাইসের ওরিয়েন্টেশন পরিবর্তন বা অ্যাপ উইন্ডোর আকার পরিবর্তনের মতো কনফিগারেশন পরিবর্তনগুলি ডিসপ্লের উইন্ডোর আকারের শ্রেণী পরিবর্তন করতে পারে। একটি তালিকা-বিস্তারিত লেআউট সেই অনুযায়ী সাড়া দেয়, অ্যাপের অবস্থা সংরক্ষণ করে:
- যদি একটি বর্ধিত-প্রস্থের ডিসপ্লে যেখানে তালিকা এবং বিস্তারিত উভয় প্যানেল দেখানো হয়, তা মাঝারি বা কম্প্যাক্টে সংকুচিত হয়, তাহলে বিস্তারিত প্যানেলটি দৃশ্যমান থাকে এবং তালিকা প্যানেলটি লুকানো থাকে।
- যদি একটি মাঝারি বা কমপ্যাক্ট-প্রস্থের ডিসপ্লেতে কেবল বিস্তারিত ফলকটি দৃশ্যমান হয় এবং উইন্ডো আকারের শ্রেণীটি প্রসারিত করার জন্য প্রশস্ত হয়, তাহলে তালিকা এবং বিস্তারিত একসাথে দেখানো হয় এবং তালিকাটি নির্দেশ করে যে বিস্তারিত ফলকের বিষয়বস্তুর সাথে সম্পর্কিত আইটেমটি নির্বাচন করা হয়েছে।
- যদি একটি মাঝারি বা কমপ্যাক্ট-প্রস্থের ডিসপ্লেতে কেবল তালিকার ফলকটি দৃশ্যমান হয় এবং প্রসারিত করার জন্য প্রশস্ত হয়, তাহলে তালিকা এবং একটি স্থানধারক বিশদ ফলক একসাথে দেখানো হয়।
তালিকা-বিস্তারিত মেসেজিং অ্যাপ , যোগাযোগ ব্যবস্থাপক , ইন্টারেক্টিভ মিডিয়া ব্রাউজার বা যেকোনো অ্যাপের জন্য আদর্শ যেখানে বিষয়বস্তু অতিরিক্ত তথ্য প্রকাশ করে এমন আইটেমের তালিকা হিসাবে সংগঠিত করা যেতে পারে।
বাস্তবায়ন
The declarative paradigm of Compose supports window size class logic that determines whether to show the list and detail panes at the same time (when the width window size class is expanded) or just the list or detail pane (when the width window size class is medium or compact).
To ensure unidirectional data flow, hoist all state, including current window size class and detail of the selected list item (if any), so all composables have access to the data and can render correctly.
When showing just the detail pane on small window sizes, add a BackHandler
to remove the detail pane and display just the list pane. The BackHandler is
not part of the overall app navigation since the handler is dependent on the
window size class and selected detail state.
For an example implementation, see the List-detail with Compose sample.
খাওয়ান
একটি ফিড লেআউট একটি কনফিগারযোগ্য গ্রিডে সমতুল্য কন্টেন্ট উপাদানগুলিকে সাজিয়ে রাখে যাতে প্রচুর পরিমাণে কন্টেন্ট দ্রুত এবং সুবিধাজনকভাবে দেখা যায়।
আকার এবং অবস্থান বিষয়বস্তুর উপাদানগুলির মধ্যে সম্পর্ক স্থাপন করে।
উপাদানগুলিকে একই আকারে তৈরি করে এবং তাদের একসাথে স্থাপন করে কন্টেন্ট গ্রুপ তৈরি করা হয়। উপাদানগুলিকে কাছাকাছি উপাদানগুলির চেয়ে বড় করে তাদের প্রতি দৃষ্টি আকর্ষণ করা হয়।
কার্ড এবং তালিকা হল ফিড লেআউটের সাধারণ উপাদান।
একটি ফিড লেআউট প্রায় যেকোনো আকারের ডিসপ্লে সমর্থন করে কারণ গ্রিডটি একটি একক, স্ক্রলিং কলাম থেকে একাধিক-কলাম স্ক্রলিং কন্টেন্ট ফিডে অভিযোজিত হতে পারে।
ফিডগুলি বিশেষ করে সংবাদ এবং সোশ্যাল মিডিয়া অ্যাপের জন্য উপযুক্ত।
বাস্তবায়ন
একটি ফিডে একটি গ্রিডে রাখা উল্লম্ব স্ক্রোলিং কন্টেনারে প্রচুর পরিমাণে বিষয়বস্তু উপাদান থাকে। অলস তালিকাগুলি দক্ষতার সাথে কলাম বা সারিগুলিতে প্রচুর পরিমাণে আইটেম রেন্ডার করে। অলস গ্রিডগুলি গ্রিডে আইটেমগুলিকে রেন্ডার করে, আইটেমের আকার এবং স্প্যানগুলির কনফিগারেশন সমর্থন করে৷
গ্রিড আইটেমগুলির জন্য ন্যূনতম অনুমোদিত প্রস্থ সেট করতে উপলব্ধ প্রদর্শন এলাকার উপর ভিত্তি করে গ্রিড বিন্যাসের কলামগুলি কনফিগার করুন৷ গ্রিড আইটেম সংজ্ঞায়িত করার সময়, কিছু আইটেম অন্যদের উপর জোর দিতে কলাম স্প্যান সামঞ্জস্য করুন।
সেকশন হেডার, ডিভাইডার বা ফিডের সম্পূর্ণ প্রস্থ দখল করার জন্য ডিজাইন করা অন্যান্য আইটেমগুলির জন্য, লেআউটের সম্পূর্ণ প্রস্থ নিতে maxLineSpan ব্যবহার করুন।
কমপ্যাক্ট-প্রস্থ ডিসপ্লেতে যেখানে একাধিক কলাম দেখানোর জন্য পর্যাপ্ত স্থান নেই, LazyVerticalGrid ঠিক একটি LazyColumn মতো আচরণ করে।
একটি উদাহরণ বাস্তবায়নের জন্য, কম্পোজ নমুনা সহ ফিড দেখুন।
,একটি ফিডে একটি গ্রিডে রাখা উল্লম্ব স্ক্রোলিং কন্টেনারে প্রচুর পরিমাণে বিষয়বস্তু উপাদান থাকে। অলস তালিকাগুলি দক্ষতার সাথে কলাম বা সারিগুলিতে প্রচুর পরিমাণে আইটেম রেন্ডার করে। অলস গ্রিডগুলি গ্রিডে আইটেমগুলিকে রেন্ডার করে, আইটেমের আকার এবং স্প্যানগুলির কনফিগারেশন সমর্থন করে৷
গ্রিড আইটেমগুলির জন্য ন্যূনতম অনুমোদিত প্রস্থ সেট করতে উপলব্ধ প্রদর্শন এলাকার উপর ভিত্তি করে গ্রিড বিন্যাসের কলামগুলি কনফিগার করুন৷ গ্রিড আইটেম সংজ্ঞায়িত করার সময়, কিছু আইটেম অন্যদের উপর জোর দিতে কলাম স্প্যান সামঞ্জস্য করুন।
সেকশন হেডার, ডিভাইডার বা ফিডের সম্পূর্ণ প্রস্থ দখল করার জন্য ডিজাইন করা অন্যান্য আইটেমগুলির জন্য, লেআউটের সম্পূর্ণ প্রস্থ নিতে maxLineSpan ব্যবহার করুন।
কমপ্যাক্ট-প্রস্থ ডিসপ্লেতে যেখানে একাধিক কলাম দেখানোর জন্য পর্যাপ্ত স্থান নেই, LazyVerticalGrid ঠিক একটি LazyColumn মতো আচরণ করে।
একটি উদাহরণ বাস্তবায়নের জন্য, কম্পোজ নমুনা সহ ফিড দেখুন।
সাপোর্টিং ফলক
সাপোর্টিং প্যান লেআউট অ্যাপের কন্টেন্টকে প্রাথমিক এবং মাধ্যমিক প্রদর্শন এলাকায় সংগঠিত করে।
প্রাথমিক প্রদর্শন এলাকাটি অ্যাপ উইন্ডোর বেশিরভাগ অংশ দখল করে (সাধারণত প্রায় দুই-তৃতীয়াংশ) এবং এতে মূল বিষয়বস্তু থাকে। সেকেন্ডারি প্রদর্শন এলাকাটি হল একটি ফলক যা অ্যাপ উইন্ডোর বাকি অংশ দখল করে এবং মূল বিষয়বস্তুকে সমর্থন করে এমন সামগ্রী উপস্থাপন করে।
ল্যান্ডস্কেপ ওরিয়েন্টেশনে সম্প্রসারিত-প্রস্থের ডিসপ্লেতে ( উইন্ডো আকারের ক্লাস ব্যবহার করুন দেখুন) সাপোর্টিং প্যান লেআউটগুলি ভালো কাজ করে। মাঝারি বা কমপ্যাক্ট-প্রস্থের ডিসপ্লেগুলি প্রাথমিক এবং মাধ্যমিক উভয় ডিসপ্লে এলাকা দেখানো সমর্থন করে যদি বিষয়বস্তু সংকীর্ণ ডিসপ্লে স্পেসের সাথে খাপ খাইয়ে নেওয়া যায়, অথবা অতিরিক্ত বিষয়বস্তু প্রাথমিকভাবে নীচে বা পাশের শীটে লুকানো যেতে পারে যা মেনু বা বোতামের মতো নিয়ন্ত্রণের মাধ্যমে অ্যাক্সেসযোগ্য।
একটি সাপোর্টিং প্যান লেআউট প্রাথমিক এবং গৌণ কন্টেন্টের সম্পর্কের ক্ষেত্রে একটি তালিকা-বিস্তারিত লেআউট থেকে আলাদা। গৌণ প্যান কন্টেন্ট শুধুমাত্র প্রাথমিক কন্টেন্টের সাথে সম্পর্কিত অর্থবহ; উদাহরণস্বরূপ, একটি সাপোর্টিং প্যান টুল উইন্ডো নিজেই অপ্রাসঙ্গিক। তবে, একটি তালিকা-বিস্তারিত লেআউটের বিশদ প্যানে সম্পূরক কন্টেন্ট প্রাথমিক কন্টেন্ট ছাড়াই অর্থবহ, উদাহরণস্বরূপ, একটি পণ্য তালিকা থেকে একটি পণ্যের বর্ণনা।
সাপোর্টিং প্যানের ব্যবহারের ক্ষেত্রে অন্তর্ভুক্ত:
- উৎপাদনশীলতা অ্যাপ: একটি ডকুমেন্ট বা স্প্রেডশিট যার সাথে একটি সাপোর্টিং প্যানে পর্যালোচকের মন্তব্য থাকবে।
- মিডিয়া অ্যাপস: একটি স্ট্রিমিং ভিডিও যা একটি সাপোর্টিং প্যানে সম্পর্কিত ভিডিওর তালিকা দ্বারা পরিপূরক , অথবা একটি প্লেলিস্টের সাথে সম্পূরক সঙ্গীতের অ্যালবামের চিত্রণ।
- টুলস এবং সেটিংস: একটি মিডিয়া এডিটিং টুল যেখানে প্যালেট, ইফেক্ট এবং অন্যান্য সেটিংস একটি সাপোর্ট প্যানে থাকে।
বাস্তবায়ন
Compose supports window size class logic, which enables you to determine whether to show both the main content and the supporting content at the same time or place the supporting content in an alternative location.
Hoist all state, including current window size class and information related to the data in the main content and supporting content.
For compact-width displays, place the supporting content below the main content or inside a bottom sheet. For medium and expanded widths, place the supporting content next to the main content, sized appropriately based on the content and space available. For medium width, split the display space equally between the main and supporting content. For expanded width, give 70% of the space to the main content, 30% to the supporting content.
For an example implementation, see the Supporting pane with Compose sample.
অতিরিক্ত সম্পদ
- মেটেরিয়াল ডিজাইন — ক্যানোনিকাল লেআউট
ক্যানোনিকাল লেআউটগুলি প্রমাণিত, বহুমুখী লেআউট যা বিভিন্ন ফর্ম ফ্যাক্টরের উপর সর্বোত্তম ব্যবহারকারীর অভিজ্ঞতা প্রদান করে।
ক্যানোনিকাল লেআউটগুলি ছোট স্ক্রিনের ফোনের পাশাপাশি ট্যাবলেট, ফোল্ডেবল এবং ChromeOS ডিভাইসগুলিকেও সমর্থন করে। মেটেরিয়াল ডিজাইন নির্দেশিকা থেকে প্রাপ্ত, লেআউটগুলি নান্দনিক এবং কার্যকরী উভয়ই।
অ্যান্ড্রয়েড ফ্রেমওয়ার্কে বিশেষায়িত উপাদান রয়েছে যা লেআউটগুলির বাস্তবায়নকে সহজ এবং নির্ভরযোগ্য করে তোলে।
ক্যানোনিকাল লেআউটগুলি আকর্ষণীয়, উৎপাদনশীলতা-বর্ধক UI তৈরি করে যা দুর্দান্ত অ্যাপগুলির ভিত্তি তৈরি করে।
তালিকা-বিস্তারিত
তালিকা-বিস্তারিত লেআউট ব্যবহারকারীদের বর্ণনামূলক, ব্যাখ্যামূলক, বা অন্যান্য সম্পূরক তথ্য - আইটেমের বিবরণ - সহ আইটেমের তালিকা অন্বেষণ করতে সক্ষম করে।
লেআউটটি অ্যাপ উইন্ডোটিকে দুটি পাশাপাশি দুটি প্যানে বিভক্ত করে: একটি তালিকার জন্য, একটি বিশদের জন্য। ব্যবহারকারীরা আইটেমের বিশদ প্রদর্শনের জন্য তালিকা থেকে আইটেম নির্বাচন করেন। বিশদের মধ্যে থাকা ডিপ লিঙ্কগুলি বিশদের প্যানে অতিরিক্ত সামগ্রী প্রকাশ করে।
প্রসারিত-প্রস্থ প্রদর্শন ( উইন্ডো আকারের ক্লাস ব্যবহার করুন দেখুন) একই সাথে তালিকা এবং বিশদ উভয়কেই সমন্বিত করে। একটি তালিকা আইটেম নির্বাচন নির্বাচিত আইটেমের জন্য সম্পর্কিত সামগ্রী দেখানোর জন্য বিশদ ফলক আপডেট করে।
মাঝারি এবং কমপ্যাক্ট-প্রস্থের ডিসপ্লেগুলি অ্যাপের সাথে ব্যবহারকারীর মিথস্ক্রিয়ার উপর নির্ভর করে তালিকা বা বিশদ প্রদর্শন করে। যখন কেবল তালিকাটি দৃশ্যমান হয়, তখন তালিকার আইটেম নির্বাচন করলে তালিকার পরিবর্তে বিশদ প্রদর্শন করা হয়। যখন কেবল বিশদটি দৃশ্যমান হয়, তখন পিছনের বোতাম টিপলে তালিকাটি পুনরায় প্রদর্শিত হয়।
ডিভাইসের ওরিয়েন্টেশন পরিবর্তন বা অ্যাপ উইন্ডোর আকার পরিবর্তনের মতো কনফিগারেশন পরিবর্তনগুলি ডিসপ্লের উইন্ডোর আকারের শ্রেণী পরিবর্তন করতে পারে। একটি তালিকা-বিস্তারিত লেআউট সেই অনুযায়ী সাড়া দেয়, অ্যাপের অবস্থা সংরক্ষণ করে:
- যদি একটি বর্ধিত-প্রস্থের ডিসপ্লে যেখানে তালিকা এবং বিস্তারিত উভয় প্যানেল দেখানো হয়, তা মাঝারি বা কম্প্যাক্টে সংকুচিত হয়, তাহলে বিস্তারিত প্যানেলটি দৃশ্যমান থাকে এবং তালিকা প্যানেলটি লুকানো থাকে।
- যদি একটি মাঝারি বা কমপ্যাক্ট-প্রস্থের ডিসপ্লেতে কেবল বিস্তারিত ফলকটি দৃশ্যমান হয় এবং উইন্ডো আকারের শ্রেণীটি প্রসারিত করার জন্য প্রশস্ত হয়, তাহলে তালিকা এবং বিস্তারিত একসাথে দেখানো হয় এবং তালিকাটি নির্দেশ করে যে বিস্তারিত ফলকের বিষয়বস্তুর সাথে সম্পর্কিত আইটেমটি নির্বাচন করা হয়েছে।
- যদি একটি মাঝারি বা কমপ্যাক্ট-প্রস্থের ডিসপ্লেতে কেবল তালিকার ফলকটি দৃশ্যমান হয় এবং প্রসারিত করার জন্য প্রশস্ত হয়, তাহলে তালিকা এবং একটি স্থানধারক বিশদ ফলক একসাথে দেখানো হয়।
তালিকা-বিস্তারিত মেসেজিং অ্যাপ , যোগাযোগ ব্যবস্থাপক , ইন্টারেক্টিভ মিডিয়া ব্রাউজার বা যেকোনো অ্যাপের জন্য আদর্শ যেখানে বিষয়বস্তু অতিরিক্ত তথ্য প্রকাশ করে এমন আইটেমের তালিকা হিসাবে সংগঠিত করা যেতে পারে।
বাস্তবায়ন
The declarative paradigm of Compose supports window size class logic that determines whether to show the list and detail panes at the same time (when the width window size class is expanded) or just the list or detail pane (when the width window size class is medium or compact).
To ensure unidirectional data flow, hoist all state, including current window size class and detail of the selected list item (if any), so all composables have access to the data and can render correctly.
When showing just the detail pane on small window sizes, add a BackHandler
to remove the detail pane and display just the list pane. The BackHandler is
not part of the overall app navigation since the handler is dependent on the
window size class and selected detail state.
For an example implementation, see the List-detail with Compose sample.
খাওয়ান
একটি ফিড লেআউট একটি কনফিগারযোগ্য গ্রিডে সমতুল্য কন্টেন্ট উপাদানগুলিকে সাজিয়ে রাখে যাতে প্রচুর পরিমাণে কন্টেন্ট দ্রুত এবং সুবিধাজনকভাবে দেখা যায়।
আকার এবং অবস্থান বিষয়বস্তুর উপাদানগুলির মধ্যে সম্পর্ক স্থাপন করে।
উপাদানগুলিকে একই আকারে তৈরি করে এবং তাদের একসাথে স্থাপন করে কন্টেন্ট গ্রুপ তৈরি করা হয়। উপাদানগুলিকে কাছাকাছি উপাদানগুলির চেয়ে বড় করে তাদের প্রতি দৃষ্টি আকর্ষণ করা হয়।
কার্ড এবং তালিকা হল ফিড লেআউটের সাধারণ উপাদান।
একটি ফিড লেআউট প্রায় যেকোনো আকারের ডিসপ্লে সমর্থন করে কারণ গ্রিডটি একটি একক, স্ক্রলিং কলাম থেকে একাধিক-কলাম স্ক্রলিং কন্টেন্ট ফিডে অভিযোজিত হতে পারে।
ফিডগুলি বিশেষ করে সংবাদ এবং সোশ্যাল মিডিয়া অ্যাপের জন্য উপযুক্ত।
বাস্তবায়ন
একটি ফিডে একটি গ্রিডে রাখা উল্লম্ব স্ক্রোলিং কন্টেনারে প্রচুর পরিমাণে বিষয়বস্তু উপাদান থাকে। অলস তালিকাগুলি দক্ষতার সাথে কলাম বা সারিগুলিতে প্রচুর পরিমাণে আইটেম রেন্ডার করে। অলস গ্রিডগুলি গ্রিডে আইটেমগুলিকে রেন্ডার করে, আইটেমের আকার এবং স্প্যানগুলির কনফিগারেশন সমর্থন করে৷
গ্রিড আইটেমগুলির জন্য ন্যূনতম অনুমোদিত প্রস্থ সেট করতে উপলব্ধ প্রদর্শন এলাকার উপর ভিত্তি করে গ্রিড বিন্যাসের কলামগুলি কনফিগার করুন৷ গ্রিড আইটেম সংজ্ঞায়িত করার সময়, কিছু আইটেম অন্যদের উপর জোর দিতে কলাম স্প্যান সামঞ্জস্য করুন।
সেকশন হেডার, ডিভাইডার বা ফিডের সম্পূর্ণ প্রস্থ দখল করার জন্য ডিজাইন করা অন্যান্য আইটেমগুলির জন্য, লেআউটের সম্পূর্ণ প্রস্থ নিতে maxLineSpan ব্যবহার করুন।
কমপ্যাক্ট-প্রস্থ ডিসপ্লেতে যেখানে একাধিক কলাম দেখানোর জন্য পর্যাপ্ত স্থান নেই, LazyVerticalGrid ঠিক একটি LazyColumn মতো আচরণ করে।
একটি উদাহরণ বাস্তবায়নের জন্য, কম্পোজ নমুনা সহ ফিড দেখুন।
,একটি ফিডে একটি গ্রিডে রাখা উল্লম্ব স্ক্রোলিং কন্টেনারে প্রচুর পরিমাণে বিষয়বস্তু উপাদান থাকে। অলস তালিকাগুলি দক্ষতার সাথে কলাম বা সারিগুলিতে প্রচুর পরিমাণে আইটেম রেন্ডার করে। অলস গ্রিডগুলি গ্রিডে আইটেমগুলিকে রেন্ডার করে, আইটেমের আকার এবং স্প্যানগুলির কনফিগারেশন সমর্থন করে৷
গ্রিড আইটেমগুলির জন্য ন্যূনতম অনুমোদিত প্রস্থ সেট করতে উপলব্ধ প্রদর্শন এলাকার উপর ভিত্তি করে গ্রিড বিন্যাসের কলামগুলি কনফিগার করুন৷ গ্রিড আইটেম সংজ্ঞায়িত করার সময়, কিছু আইটেম অন্যদের উপর জোর দিতে কলাম স্প্যান সামঞ্জস্য করুন।
সেকশন হেডার, ডিভাইডার বা ফিডের সম্পূর্ণ প্রস্থ দখল করার জন্য ডিজাইন করা অন্যান্য আইটেমগুলির জন্য, লেআউটের সম্পূর্ণ প্রস্থ নিতে maxLineSpan ব্যবহার করুন।
কমপ্যাক্ট-প্রস্থ ডিসপ্লেতে যেখানে একাধিক কলাম দেখানোর জন্য পর্যাপ্ত স্থান নেই, LazyVerticalGrid ঠিক একটি LazyColumn মতো আচরণ করে।
একটি উদাহরণ বাস্তবায়নের জন্য, কম্পোজ নমুনা সহ ফিড দেখুন।
সাপোর্টিং ফলক
সাপোর্টিং প্যান লেআউট অ্যাপের কন্টেন্টকে প্রাথমিক এবং মাধ্যমিক প্রদর্শন এলাকায় সংগঠিত করে।
প্রাথমিক প্রদর্শন এলাকাটি অ্যাপ উইন্ডোর বেশিরভাগ অংশ দখল করে (সাধারণত প্রায় দুই-তৃতীয়াংশ) এবং এতে মূল বিষয়বস্তু থাকে। সেকেন্ডারি প্রদর্শন এলাকাটি হল একটি ফলক যা অ্যাপ উইন্ডোর বাকি অংশ দখল করে এবং মূল বিষয়বস্তুকে সমর্থন করে এমন সামগ্রী উপস্থাপন করে।
ল্যান্ডস্কেপ ওরিয়েন্টেশনে সম্প্রসারিত-প্রস্থের ডিসপ্লেতে ( উইন্ডো আকারের ক্লাস ব্যবহার করুন দেখুন) সাপোর্টিং প্যান লেআউটগুলি ভালো কাজ করে। মাঝারি বা কমপ্যাক্ট-প্রস্থের ডিসপ্লেগুলি প্রাথমিক এবং মাধ্যমিক উভয় ডিসপ্লে এলাকা দেখানো সমর্থন করে যদি বিষয়বস্তু সংকীর্ণ ডিসপ্লে স্পেসের সাথে খাপ খাইয়ে নেওয়া যায়, অথবা অতিরিক্ত বিষয়বস্তু প্রাথমিকভাবে নীচে বা পাশের শীটে লুকানো যেতে পারে যা মেনু বা বোতামের মতো নিয়ন্ত্রণের মাধ্যমে অ্যাক্সেসযোগ্য।
একটি সাপোর্টিং প্যান লেআউট প্রাথমিক এবং গৌণ কন্টেন্টের সম্পর্কের ক্ষেত্রে একটি তালিকা-বিস্তারিত লেআউট থেকে আলাদা। গৌণ প্যান কন্টেন্ট শুধুমাত্র প্রাথমিক কন্টেন্টের সাথে সম্পর্কিত অর্থবহ; উদাহরণস্বরূপ, একটি সাপোর্টিং প্যান টুল উইন্ডো নিজেই অপ্রাসঙ্গিক। তবে, একটি তালিকা-বিস্তারিত লেআউটের বিশদ প্যানে সম্পূরক কন্টেন্ট প্রাথমিক কন্টেন্ট ছাড়াই অর্থবহ, উদাহরণস্বরূপ, একটি পণ্য তালিকা থেকে একটি পণ্যের বর্ণনা।
সাপোর্টিং প্যানের ব্যবহারের ক্ষেত্রে অন্তর্ভুক্ত:
- উৎপাদনশীলতা অ্যাপ: একটি ডকুমেন্ট বা স্প্রেডশিট যার সাথে একটি সাপোর্টিং প্যানে পর্যালোচকের মন্তব্য থাকবে।
- মিডিয়া অ্যাপস: একটি স্ট্রিমিং ভিডিও যা একটি সাপোর্টিং প্যানে সম্পর্কিত ভিডিওর তালিকা দ্বারা পরিপূরক , অথবা একটি প্লেলিস্টের সাথে সম্পূরক সঙ্গীতের অ্যালবামের চিত্রণ।
- টুলস এবং সেটিংস: একটি মিডিয়া এডিটিং টুল যেখানে প্যালেট, ইফেক্ট এবং অন্যান্য সেটিংস একটি সাপোর্ট প্যানে থাকে।
বাস্তবায়ন
Compose supports window size class logic, which enables you to determine whether to show both the main content and the supporting content at the same time or place the supporting content in an alternative location.
Hoist all state, including current window size class and information related to the data in the main content and supporting content.
For compact-width displays, place the supporting content below the main content or inside a bottom sheet. For medium and expanded widths, place the supporting content next to the main content, sized appropriately based on the content and space available. For medium width, split the display space equally between the main and supporting content. For expanded width, give 70% of the space to the main content, 30% to the supporting content.
For an example implementation, see the Supporting pane with Compose sample.
অতিরিক্ত সম্পদ
- মেটেরিয়াল ডিজাইন — ক্যানোনিকাল লেআউট