একটি গ্রিড ভিউ প্রতিটি ছবির নিচে সংক্ষিপ্ত টেক্সট সহ বিষয়বস্তু আইটেম প্রতিনিধিত্বকারী চিত্রগুলির দুই বা ততোধিক কলাম প্রদর্শন করে। এই দৃশ্যটি সর্বোত্তম হয় যখন ব্যবহারকারীরা তাদের নির্বাচন করতে প্রাথমিকভাবে ছবির উপর নির্ভর করে।
গ্রিডগুলি উল্লম্বভাবে স্ক্রোলযোগ্য এবং আকার, ব্যবধান এবং কলামের সংখ্যায় পরিবর্তিত হতে পারে। গ্রিডে থাকা বিষয়বস্তুকেও শ্রেণীতে ভাগ করা যায়।
তালিকা আইটেম উপাদান
তালিকাগুলি আরও ব্যাখ্যামূলক পাঠ্যের প্রয়োজন এমন বিষয়বস্তু প্রদর্শনের একটি বিকল্প উপায় প্রদান করে৷
অ্যানাটমি
গ্রিডে পাঠ্য এবং UI নিয়ন্ত্রণ রয়েছে। যেহেতু ব্যবহারকারীদের অবশ্যই তাদের প্রতিক্রিয়া জানাতে হবে, সেগুলিকে কখনই অস্পষ্ট করা উচিত নয়, অন্য উপাদান দ্বারা বা পর্দার প্রান্ত দ্বারা।
গ্রিড আইটেম
প্রাথমিক এবং মাধ্যমিক পাঠ্য
গ্রিড পটভূমি
চশমা
লেআউট লেবেল
E, M, KL, P, Flex এর সংজ্ঞা
তালিকা আইটেম উপাদান
চশমা, শৈলী নির্দেশিকা, এবং আরো
সামগ্রী গ্রিড (3 বা 4 কলাম)
অ্যাপ গ্রিড (4 কলাম)
উপরের সারিতে প্রায়শই ব্যবহৃত আইটেম সহ অ্যাপ গ্রিড
গ্রিড লেআউটে সূচক আইকন বসানো
স্কেলিং লেআউট
এই রেফারেন্স লেআউটগুলি দেখায় কিভাবে গ্রিডগুলিকে বিভিন্ন প্রস্থ এবং উচ্চতার স্ক্রিনগুলিকে মিটমাট করার জন্য মানিয়ে নেওয়া যায়। (প্রস্থ এবং উচ্চতা বিভাগগুলি লেআউট বিভাগে সংজ্ঞায়িত করা হয়েছে।) নোট করুন যে কোনও ডাউন-স্যাম্পলিং বা আপ-স্যাম্পলিং হওয়ার আগে সমস্ত পিক্সেল মান রেন্ডার করা পিক্সেলে রয়েছে।
লেআউট
মার্জিন, কীলাইন এবং বিভিন্ন স্ক্রিনের মাপের জন্য প্যাডিং
লেআউট লেবেল
E, M, KL, P, Flex এর সংজ্ঞা
স্ট্যান্ডার্ড-প্রস্থ স্ক্রীন
প্রশস্ত পর্দা
প্রশস্ত পর্দার জন্য, একটি 3-কলাম বিন্যাস সুপারিশ করা হয়। 4-কলামের লেআউট ব্যবহার করলে, ন্যূনতম 219dp টাইলের আকার বজায় রাখুন।
অতিরিক্ত-প্রশস্ত এবং সুপার-ওয়াইড স্ক্রিন
বিভিন্ন উচ্চতার স্ক্রিনে অ্যাপ গ্রিডের উল্লম্ব ব্যবধান
ছোট স্ক্রিনের জন্য, গ্রিড সামগ্রীর আইটেম এবং অ্যাপ আইকন এবং শিরোনামের মধ্যে উল্লম্ব ব্যবধান হ্রাস করা উচিত।
শৈলী
টাইপোগ্রাফি নির্দেশিকা
স্কেল এবং গ্রিড রেফারেন্স, টাইপোগ্রাফিক উদাহরণ, এবং আরও অনেক কিছু
রঙ নির্দেশিকা
প্যালেট, উচ্চতা এবং অস্বচ্ছতার মান এবং আরও অনেক কিছু
টাইপোগ্রাফি
টাইপ স্টাইল
টাইপফেস
ওজন
আকার (dp)
শরীর ঘ
রোবোটো
নিয়মিত
32
শরীর 2
রোবোটো
নিয়মিত
28
শরীর 3
রোবোটো
নিয়মিত
24
রঙ
উপাদান
রঙ (দিন মোড)
রঙ (নাইট মোড)
প্রাথমিক প্রকার / আইকন
সাদা
সাদা @ 88%
সেকেন্ডারি টাইপ/আইকন
সাদা @ 72%
সাদা @ 60%
বিভাজক লাইন
সাদা @ 22%
সাদা @ 12%
গ্রিড পটভূমি
কালো
কালো
বিষয়বস্তু scrim
N/A
কালো @ 22%
গ্রেডিয়েন্ট ট্রাঙ্কেট
টেক্সটের 10% জায়গায় কালো @ 0-100%
টেক্সটের 10% জায়গায় কালো @ 0-100%
সাইজিং
উপাদান
আকার (dp)
অ্যাপ আইকন
76
মিন অ্যাপ সেল
135
মিন কন্টেন্ট সেল
158
উচ্চতা
উপাদান
রঙ
Y অক্ষ
ঝাপসা
গ্রিড টালি
কালো @ 22%
2
2
উদাহরণ
অ্যাপ গ্রিড - দিন অ্যাপ গ্রিড - রাত
বিষয়বস্তু গ্রিড - দিন বিষয়বস্তু গ্রিড - রাত
ব্যবহারকারী বিষয়বস্তু স্ক্রোল করতে উপরের দিকে বা নিচের দিকে টেনে আনে
[null,null,["2024-10-30 UTC-তে শেষবার আপডেট করা হয়েছে।"],[[["Grid view displays content items as images with brief text, best for image-based selections, and can be vertically scrolled, categorized, and varied in size and spacing."],["Grids contain text and UI controls which should remain visible; they include a grid item, primary and secondary text, and a background."],["Layouts scale for various screen sizes, recommending a 3-column layout for wide screens or a 4-column layout with minimum tile size of 219dp, and adjusting vertical spacing for short screens."],["Grids have specific styles for typography, color (with day and night modes), sizing, and elevation, ensuring visual consistency and usability."],["Examples are provided for both app and content grids, demonstrating their appearance in day and night modes, and showcasing user interaction with scrolling."]]],[]]