বোতাম

কীওয়ার্ড: AiAssisted, পণ্য: JetpackCompose

বোতামগুলি হল মৌলিক উপাদান যা ব্যবহারকারীকে একটি সংজ্ঞায়িত ক্রিয়া ট্রিগার করতে দেয়। পাঁচ ধরনের বোতাম রয়েছে। এই টেবিলটি পাঁচটি বোতাম প্রকারের প্রতিটির উপস্থিতি বর্ণনা করে, সেইসাথে আপনার সেগুলি কোথায় ব্যবহার করা উচিত:

এই চিত্রটি ম্যাটেরিয়াল ডিজাইনে পাঁচ ধরনের বোতাম প্রদর্শন করে:

API পৃষ্ঠ

onClick

ব্যবহারকারী বোতাম টিপলে সিস্টেমটি যে ফাংশনটি কল করে।

enabled

false হলে, এই প্যারামিটারটি বোতামটিকে অনুপলব্ধ এবং নিষ্ক্রিয় দেখায়।

colors

ButtonColors এর একটি উদাহরণ যা বোতামে ব্যবহৃত রং নির্ধারণ করে।

contentPadding

বোতামের মধ্যে প্যাডিং।

ভরা বোতাম

ভরা বোতাম উপাদান মৌলিক Button কম্পোজেবল ব্যবহার করে। এটি ডিফল্টরূপে একটি কঠিন রঙ দিয়ে ভরা হয়। স্নিপেট দেখায় কিভাবে উপাদান বাস্তবায়ন করতে হয়:

@Composable
fun FilledButtonExample(onClick: () -> Unit) {
    Button(onClick = { onClick() }) {
        Text("Filled")
    }
}
Button.kt

এই বাস্তবায়ন দেখানো হিসাবে প্রদর্শিত হয়:

ভরা টোনাল বোতাম

ভরা টোনাল বোতাম উপাদানটি FilledTonalButton কম্পোজেবল ব্যবহার করে। এটি ডিফল্টরূপে একটি টোনাল রঙ দিয়ে ভরা হয়।

স্নিপেট দেখায় কিভাবে উপাদান বাস্তবায়ন করতে হয়:

@Composable
fun FilledTonalButtonExample(onClick: () -> Unit) {
    FilledTonalButton(onClick = { onClick() }) {
        Text("Tonal")
    }
}
Button.kt

এই বাস্তবায়ন দেখানো হিসাবে প্রদর্শিত হয়:

আউটলাইন বোতাম

আউটলাইন করা বোতাম কম্পোনেন্ট OutlinedButton কম্পোজেবল ব্যবহার করে। এটি ডিফল্টরূপে একটি রূপরেখা সহ প্রদর্শিত হয়।

স্নিপেট দেখায় কিভাবে উপাদান বাস্তবায়ন করতে হয়:

@Composable
fun OutlinedButtonExample(onClick: () -> Unit) {
    OutlinedButton(onClick = { onClick() }) {
        Text("Outlined")
    }
}
Button.kt

এই বাস্তবায়ন দেখানো হিসাবে প্রদর্শিত হয়:

এলিভেটেড বোতাম

এলিভেটেড বোতাম কম্পোনেন্ট ElevatedButton বাটন কম্পোজেবল ব্যবহার করে। এটির একটি ছায়া রয়েছে যা ডিফল্টরূপে উচ্চতার প্রভাবকে উপস্থাপন করে। এটি একটি ভরাট বোতাম যা একটি ছায়া অন্তর্ভুক্ত করে।

স্নিপেট দেখায় কিভাবে উপাদান বাস্তবায়ন করতে হয়:

@Composable
fun ElevatedButtonExample(onClick: () -> Unit) {
    ElevatedButton(onClick = { onClick() }) {
        Text("Elevated")
    }
}
Button.kt

এই বাস্তবায়ন দেখানো হিসাবে প্রদর্শিত হয়:

পাঠ্য বোতাম

টেক্সট বোতাম কম্পোনেন্ট TextButton কম্পোজেবল ব্যবহার করে। এটি চাপা না হওয়া পর্যন্ত শুধুমাত্র পাঠ্য হিসাবে প্রদর্শিত হবে। এটি ডিফল্টরূপে একটি কঠিন পূরণ বা রূপরেখা নেই।

স্নিপেট দেখায় কিভাবে উপাদান বাস্তবায়ন করতে হয়:

@Composable
fun TextButtonExample(onClick: () -> Unit) {
    TextButton(
        onClick = { onClick() }
    ) {
        Text("Text Button")
    }
}
Button.kt

এই বাস্তবায়ন দেখানো হিসাবে প্রদর্শিত হয়:

অতিরিক্ত সম্পদ

• ফ্লোটিং অ্যাকশন বোতাম
• মেটেরিয়াল ডিজাইন 3 বোতাম ওভারভিউ