বোতাম

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

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

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

এপিআই সারফেস

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

এই বাস্তবায়নটি দেখানো হয়েছে:

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

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