জেটপ্যাক কম্পোজ গ্লিমারের আইকনগুলি

প্রযোজ্য এক্সআর ডিভাইস
এই নির্দেশিকা আপনাকে এই ধরনের এক্সআর ডিভাইসগুলির জন্য অভিজ্ঞতা তৈরি করতে সাহায্য করে।
ডিসপ্লে গ্লাস

Jetpack Compose Glimmer-এ, Icon কম্পোনেন্টটি হলো একরঙা আইকন রেন্ডার করার জন্য একটি UI এলিমেন্ট। আইকনগুলো বুদ্ধিমত্তার সাথে রঙের আভা ও স্কেলিং নিয়ন্ত্রণ করে, যাতে সেগুলো পাঠযোগ্য থাকে এবং GlimmerTheme সাথে দৃষ্টিনন্দনভাবে সামঞ্জস্যপূর্ণ হয়।

আকার

যদিও আইকনগুলো ডিফল্টভাবে LocalIconSize দ্বারা প্রদত্ত আকারে সেট হয়, আপনি একটি নির্দিষ্ট আকার সেট করার জন্য প্রদত্ত তিনটি আইকন সাইজও ব্যবহার করতে পারেন। এই আকারগুলো নিম্নলিখিত প্রেক্ষাপটগুলোর জন্যও ডিফল্টভাবে ব্যবহৃত হয়:

আকারের টোকেন ডিফল্ট ব্যবহার

small

সাধারণ তালিকার আইটেম বা ছোট চিপসের জন্য।

medium

স্বতন্ত্র আইকন এবং শিরোনাম চিপের জন্য।

large

কার্ডের মতো গুরুত্বপূর্ণ উপাদানগুলোর জন্য।

আইকন উৎস

আইকনগুলো তাদের উৎস হিসেবে ImageVector , ImageBitmap , বা Painter গ্রহণ করতে পারে। নিজের আইকন তৈরি করার সময়, ডিসপ্লে গ্লাসে যেকোনো স্কেলে স্পষ্ট রেন্ডারিং নিশ্চিত করতে যেখানে সম্ভব ImageVector ব্যবহার করুন।

রঙ এবং আভা

  • স্বয়ংক্রিয় রঙ : আইকনটি তার মূল পৃষ্ঠ (যেমন কোনো surface বা Button দ্বারা প্রদত্ত LocalContentColor LocalContentColor উপর ভিত্তি করে নিজের রঙ নির্ধারণ করে।
  • ম্যানুয়াল টিন্টিং : একটি নির্দিষ্ট রঙ প্রয়োগ করতে tint প্যারামিটারটি ব্যবহার করুন।
  • বহুরঙা অ্যাসেট : যেসব আইকনে রঙ করা উচিত নয় (যেমন বহুরঙা ব্র্যান্ড লোগো), সেগুলোর ক্ষেত্রে tint = Color.Unspecified সেট করুন।
  • সাধারণ ছবি : যেসব ফটোগ্রাফ বা সাধারণ ছবি আইকনের আকার ও রঙের নিয়ম মেনে চলে না, সেগুলোর জন্য স্ট্যান্ডার্ড androidx.compose.foundation.Image ব্যবহার করুন।

উদাহরণ: মৌলিক আইকন

নিম্নলিখিত কোডটি একটি সাধারণ আইকন তৈরি করে:

@Composable
fun IconSample() {
    Icon(FavoriteIcon, contentDescription = "Localized description")
}

উদাহরণ: রঙিন আইকন

নিম্নলিখিত কোডটি থিমের প্রাথমিক রঙ ব্যবহার করে একটি রঙিন আইকন তৈরি করে:

@Composable
fun ColoredIconSample() {
    Icon(
        FavoriteIcon,
        tint = GlimmerTheme.colors.primary,
        contentDescription = "Localized description",
    )
}

উদাহরণ: বিভিন্ন আকারের আইকন

নিম্নলিখিত কোডটি একটি আইকন তৈরি করে যা একটি নির্দিষ্ট আকারে পরিবর্তিত হয়:

@Composable
fun SizedIconSample() {
    Icon(
        FavoriteIcon,
        contentDescription = "Localized description",
        modifier = Modifier.size(GlimmerTheme.iconSizes.large),
    )
}

কোড সম্পর্কে মূল বিষয়গুলো

  • GlimmerTheme.iconSizes এর সাথে একটি মডিফায়ার ব্যবহার করে আইকনের আকার কাস্টমাইজ করা হয়। আইকনের জন্য, ডিফল্ট মান হলো GlimmerTheme.iconSizes.medium । আপনার UI জুড়ে সামঞ্জস্য বজায় রাখতে, নির্দিষ্ট মান হার্ড-কোড করার পরিবর্তে এই আকারগুলো ব্যবহার করুন।
  • আইকনটির জন্য একটি স্থানীয় contentDescription প্রদান করে। আইকনটি যদি শুধুমাত্র আলংকারিক না হয়, তবে সর্বদা এই বিবরণগুলো প্রদান করুন।