ক্যানোনিকাল উইজেট লেআউট

আপনার মূল কন্টেন্ট শনাক্ত করার মাধ্যমে কার্যকরী উইজেট লেআউট তৈরি করুন। আপনার লেআউট নির্ধারণ করে যে আপনার উইজেটের মধ্যে তথ্য ও ইন্ট্যার‍্যাক্টিভ এলিমেন্ট কীভাবে সাজানো হবে। এই প্রসেস স্ট্রিমলাইন করার জন্য Android, টুলবার, টেক্সট, তালিকা এবং গ্রিড-টাইপ উইজেটের জন্য আগে থেকে তৈরি করা বেশ কিছু লেআউট অফার করে।

টেক্সট

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

শুধুমাত্র টেক্সট

শীর্ষক, স্ট্যাটাস আপডেট, সংক্ষিপ্ত বিবরণ বা এমন যেকোনও পরিস্থিতির জন্য আদর্শ যেখানে এক লাইনের টেক্সট কার্যকরভাবে মেসেজটি বোঝায়।

টেক্সট ও ছবি

আরও ভাল ভিজ্যুয়াল ইমপ্যাক্টের জন্য ছবি যোগ করুন। আরও তথ্যের জন্য, ব্রেকপয়েন্ট দেখুন এবং বিভিন্ন স্ক্রিন সাইজের জন্য কীভাবে এই লেআউট মানানসই করবেন তা জানুন।

টুলবার

আপনার অ্যাপে প্রায়শই ব্যবহৃত টাস্কে ব্যবহারকারীদের দ্রুত অ্যাক্সেস দিতে টুলবার লেআউট ব্যবহার করুন। এটি এমন একটি ফ্লেক্সিবল লেআউট যা বিভিন্ন উইজেট সাইজ অনুযায়ী অ্যাডজাস্ট হয়ে যায়।

Search Toolbar

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

টুলবার

টুলবারে অ্যাপ ব্র্যান্ডিংয়ের পরে সবচেয়ে বেশি ব্যবহৃত টাস্কের বোতাম থাকে যা টগল করা যায় এমন সেটিংস বা টাস্ক লিঙ্কের জন্য আদর্শ। ছোট বড় করার সময়, কম ব্যবহার করা হয় এমন বিকল্পগুলি আরও সাধারণ অ্যাকশনের জন্য লুকানো হতে পারে। জায়গা থাকলে, ব্রেকপয়েন্ট ব্যবহার করে নতুন ন্যূনতম ৪৮ডিপি ট্যাপ করা যায় এমন বোতাম যোগ করুন।

তালিকা

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

টেক্সট ও ছবির তালিকা

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

চেকলিস্ট

চেকলিস্ট লেআউট টাস্ক দেখানোর জন্য উপযুক্ত, এটি ব্যবহারকারীদের জন্য স্পষ্ট ট্যাপ টার্গেট প্রদান করে যাতে তারা দ্রুত আইটেমগুলিকে সম্পূর্ণ হিসেবে চিহ্নিত করতে পারেন।

অ্যাকশনের তালিকা

অ্যাকশন তালিকার সাথে ইনট্যুইটিভ কন্ট্রোল গ্রুপিং প্রদান করুন, যেখানে ভিজ্যুয়াল চালু/বন্ধ স্ট্যাটাস আইটেমের স্ট্যাটাস সম্পর্কে তাৎক্ষণিক মতামত প্রদান করে।

ফুল ব্লিড ছবি

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

গ্রিড

ঐচ্ছিক লেবেল সহ একটি কমপ্যাক্ট, নমনীয়, দৃশ্যত সমৃদ্ধ গ্রিডে ছবি উপস্থাপন করুন। বিভিন্ন স্ক্রিনের সাইজের সাথে মানানসই কলাম ও সারি ব্যবহার করুন।

শুধুমাত্র ছবি

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

ছবি এবং টেক্সট

এছাড়াও, আপনি টেক্সট লেবেল ও বিবরণ যোগ করতে পারেন, যা আপনার ইমেজ গ্রিড কন্টেন্টকে অতিরিক্ত প্রসঙ্গ ও তথ্য দিয়ে সমৃদ্ধ করে।

কোডের নমুনা

নিচের সারণীটি প্রতিটি প্রামাণিক লেআউটকে Android Platform Samples GitHub repository-তে এর সংশ্লিষ্ট Jetpack Glance ইমপ্লিমেন্টেশনের সাথে ম্যাপ করে।

ক্যানোনিকাল লেআউট রেফারেন্স ফাইল নির্দেশিকা
অ্যাকশন লিস্ট লেআউট
  • Glance অ্যাকশন কলব্যাকের মাধ্যমে তালিকা আইটেম অ্যাকশন ম্যানেজ করুন এবং সঠিক স্ট্যাটাস আপডেট নিশ্চিত করুন।
চেকলিস্ট লেআউট
  • কালেকশন আইটেম আপডেট করতে অ্যাকশন প্যারামিটার বা কলব্যাক ব্যবহার করে চেকবক্স স্টেট টগল করার সুবিধা প্রয়োগ করুন।
  • চেকবক্সে ট্যাপ করার মতো ক্লিক ইভেন্ট ম্যানেজ করতে, উইজেট `onClick` প্যারামিটারের জন্য `actionRunCallback`, `ActionCallback(actionParametersOf(...))` বা `actionStartActivity(...)`-এর মতো Glance অ্যাকশন কলব্যাক ব্যবহার করুন।
এক্সপ্রেসিভ টুলবার লেআউট
  • `ColorProvider` ইমপোর্ট সংক্রান্ত সমস্যা এড়িয়ে চলুন: `androidx.glance.unit.ColorProvider` ইমপোর্ট করুন এবং `androidx.glance.color.ColorProvider(dayColor, nightColor)` ব্যবহার করুন।
  • `ColorProvider`-এর পরিবর্তে সলিড ব্যাকগ্রাউন্ড কালারের জন্য সরাসরি `GlanceModifier.background(Color)` ব্যবহার করুন।
ইমেজ গ্রিড লেআউট
  • ইমেজ লোডিং লাইব্রেরি কনফিগার বা অনুরোধ করা না হলে, ইমেজ আইটেমের জন্য সলিড কালার (`GlanceModifier.background`) বা লোকাল ড্রয়েবল ব্যবহার করুন।
ছবি, টেক্সট, তালিকা লেআউট
  • সাধারণ ব্যবহারের ক্ষেত্র: নিউজ ফিড, নিবন্ধের তালিকা, ওয়ার্কআউট ইতিহাস, মেসেজ ফিড এবং উল্লম্ব থাম্বনেল তালিকা।
  • প্রাইমারি/সেকেন্ডারি টেক্সটের সাথে থাম্বনেল ছবি একত্রিত করার সময় তালিকার সারির উচ্চতা ও টেক্সট ক্লিপিংয়ের মধ্যে ভারসাম্য বজায় রাখা।
দীর্ঘ টেক্সট লেআউট
  • আপনি যদি `Dp` ভ্যালু গুণ করেন, যেমন `2 * padding`, তাহলে `androidx.compose.ui.unit.times` ইমপোর্ট করুন।
  • সাইজ সংক্রান্ত নিয়ম মেনে চলুন: প্যাডিং ও টাইপোগ্রাফি স্কেলিংয়ের জন্য `dimens.xml` থেকে নেওয়া ডাইমেনশন ব্যবহার করা হয়েছে কিনা দেখুন।
সার্চ টুলবার লেআউট
  • `ColorProvider` ইমপোর্ট সংক্রান্ত সমস্যা এড়ানো: `androidx.glance.unit.ColorProvider` ইমপোর্ট করুন এবং `androidx.glance.color.ColorProvider(dayColor, nightColor)` ব্যবহার করুন।
  • ColorProvider-এর পরিবর্তে সলিড ব্যাকগ্রাউন্ড কালারের জন্য সরাসরি `GlanceModifier.background(Color)` ব্যবহার করুন।
ফুল-ব্লিড ইমেজ লেআউট / স্ন্যাপ স্ক্রলিং
  • স্ন্যাপ স্ক্রলিংয়ের জন্য LazyColumn-এ `verticalScrollMode = VerticalScrollMode.SnapScrollMatchHeight(size.height)` সেট করুন।
  • আপনি স্ন্যাপ স্ক্রলিং প্রয়োগ করলে, Glance 1.3.0-alpha02 বা এর পরের যেকোনও ভার্সন, SDK 37 (Baklava) বা এর পরের যেকোনও ভার্সন এবং Android Gradle Plugin (AGP) 9.1.0 বা এর পরের যেকোনও ভার্সন প্রয়োজনীয়।
  • উইজেট প্রোভাইডার ক্লাসে `override val sizeMode: SizeMode = SizeMode.Exact` সেট করুন।
স্ট্যান্ডার্ড টুলবার লেআউট
  • `ColorProvider` ইমপোর্ট সংক্রান্ত সমস্যা এড়াতে সমস্যার সমাধানকরণ দেখুন: `androidx.glance.color.ColorProvider(dayColor, nightColor)` ব্যবহার করুন।
  • `ColorProvider`-এর পরিবর্তে সলিড ব্যাকগ্রাউন্ড কালারের জন্য সরাসরি `GlanceModifier.background(Color)` ব্যবহার করুন।
ছবি লেআউট সহ টেক্সট
  • উপলভ্য উইজেট ডাইমেনশনের উপর ভিত্তি করে টেক্সট এবং ছবি পাশাপাশি বা স্ট্যাক করে দেখানোর জন্য রেসপন্সিভ লেআউট সাইজিং সংক্রান্ত নিয়ম অনুসরণ করুন।