Jetpack Compose Glimmer-এ, সারফেসগুলো তাদের দৃশ্যমান সীমানা এবং গোলাকারত্ব নির্ধারণ করতে শেপ ব্যবহার করে। Shapes ক্লাসটি বিভিন্ন ধরণের কম্পোনেন্টের জন্য বিভিন্ন মাত্রার গোলাকারত্ব প্রদান করে।
আকৃতির বিভাগ
GlimmerTheme ক্লাসটি তিনটি প্রমিত আকারের আকৃতি নির্ধারণ করে:
- ছোট : এমন একটি আকৃতি যার চারটি কোণাই সমান আকারের। এটি কার্ডের মতো উপাদানের জন্য ব্যবহৃত হয়। ডিফল্টরূপে, এটি 24.dp আকারের একটি
RoundedCornerShape। - মিডিয়াম : এমন একটি আকৃতি যার চারটি কোণা একই আকারের এবং যার মাপ ছোট ও বড়র মাঝামাঝি। এটি সবচেয়ে বেশি ব্যবহৃত আকৃতি এবং সারফেসে ডিফল্ট হিসেবে ব্যবহৃত হয়। ডিফল্টরূপে, এটি ৩৬.ডিপি (36.dp) আকারের একটি
RoundedCornerShape)। - বৃহৎ : এমন একটি আকৃতি যার চারটি কোণই সম্পূর্ণরূপে গোলাকার। এই আকৃতিটি বাটনের মতো কম্পোনেন্টের জন্য ব্যবহৃত হয়। ডিফল্টরূপে, এটি একটি
CircleShape)।
উদাহরণ: GlimmerTheme থেকে আকারগুলি নিন এবং সেগুলিকে কম্পোনেন্টগুলিতে প্রয়োগ করুন।
প্রথমে, GlimmerTheme.shapes থেকে নির্ধারিত আকারগুলো নিন এবং তারপর সেই আকারগুলো কিছু কম্পোনেন্টে প্রয়োগ করুন:
@Composable fun ShapesSample() { val shapes = GlimmerTheme.shapes GlimmerLazyColumn { item { ShapeItem("small", shape = shapes.small) } item { ShapeItem("medium", shape = shapes.medium) } item { ShapeItem("large", shape = shapes.large) } } } @Composable private fun ShapeItem(name: String, shape: Shape, modifier: Modifier = Modifier) { val interactionSource = remember { MutableInteractionSource() } Box( modifier .aspectRatio(2.5f) .fillMaxWidth() .surface(interactionSource = interactionSource, shape = shape), contentAlignment = Alignment.Center, ) { Text(name) } }
আকৃতি কাস্টমাইজ করুন
Shapes ক্লাসটি @Immutable । আপনি copy ফাংশন ব্যবহার করে বিদ্যমান থিম শেপগুলোর একটি কপি তৈরি করতে এবং নির্দিষ্ট মান ওভাররাইড করতে পারেন। আপনার অ্যাপের ব্র্যান্ডের জন্য নির্দিষ্ট ব্যাসার্ধ সামঞ্জস্য করার পাশাপাশি থিমের কাঠামো বজায় রাখতে এটি করুন।
উদাহরণ: নির্দিষ্ট আকৃতির মান পরিবর্তন করুন
নিম্নলিখিত কোডটি নির্দিষ্ট আকৃতির মানগুলিকে ওভাররাইড করে:
@Composable fun CustomShapesSample() { val customShapes = GlimmerTheme.shapes.copy( small = RoundedCornerShape(12.dp), medium = RoundedCornerShape(20.dp) ) val interactionSource = remember { MutableInteractionSource() } Box( Modifier .aspectRatio(2.5f) .fillMaxWidth() .surface(interactionSource = interactionSource, shape = customShapes.small), contentAlignment = Alignment.Center, ) { Text("custom small") } }
ডিফল্ট মান
GlimmerTheme অন্যভাবে নির্দিষ্ট করা না থাকলে, সিস্টেম ডিফল্টরূপে নিম্নলিখিত মানগুলি ব্যবহার করে:
| টোকেন | ডিফল্ট আকৃতি | আকার বা ব্যাসার্ধ |
|---|---|---|
| | ২৪.ডিপি |
| | ৩৬.ডিপি |
| | সম্পূর্ণ গোলাকার |