Google आपकी पसंदीदा भाषा में कॉन्टेंट का अनुवाद करने के लिए, एआई टेक्नोलॉजी का इस्तेमाल करता है. एआई से मिले अनुवादों में गलतियां हो सकती हैं.

बटन

बटन, बुनियादी कॉम्पोनेंट होते हैं. इनकी मदद से, उपयोगकर्ता किसी तय कार्रवाई को ट्रिगर कर सकता है. बटन पांच तरह के होते हैं. इस टेबल में, पांचों तरह के बटन के दिखने के तरीके के बारे में बताया गया है. साथ ही, यह भी बताया गया है कि आपको उनका इस्तेमाल कहां करना चाहिए:

प्रकार	दिखने की जानकारी	मकसद
भरा गया	सॉलिड बैकग्राउंड के साथ कंट्रास्ट टेक्स्ट.	ज़्यादा ज़ोर देने वाले बटन. इनका इस्तेमाल, किसी ऐप्लिकेशन में मुख्य कार्रवाइयों के लिए किया जाता है. जैसे, "सबमिट करें" और "सेव करें". शैडो इफ़ेक्ट, बटन की अहमियत को हाइलाइट करता है.
फ़िल्ड टोनल	बैकग्राउंड का रंग, प्लैटफ़ॉर्म के हिसाब से अलग-अलग होता है.	साथ ही, प्राइमरी या अहम कार्रवाइयों के लिए भी. भरे हुए टोनल बटन, ज़्यादा विज़ुअल वेट देते हैं. साथ ही, ये "कार्ट में जोड़ें" और "साइन इन करें" जैसे फ़ंक्शन के लिए सही होते हैं.
बहुत ज़्यादा गर्म	शैडो की वजह से अलग दिखता है.	यह टोनल बटन की तरह ही काम करता है. बटन को और ज़्यादा उभारने के लिए, एलिवेशन बढ़ाएं.
आउटलाइंड	इसमें बॉर्डर होता है, लेकिन कोई रंग नहीं भरा होता.	मीडियम-एम्फ़सिस बटन, जिनमें ऐसी कार्रवाइयां शामिल होती हैं जो ज़रूरी हैं, लेकिन मुख्य नहीं हैं. इन्हें अन्य बटन के साथ इस्तेमाल किया जा सकता है, ताकि "रद्द करें" या "वापस जाएं" जैसी वैकल्पिक और सेकंडरी कार्रवाइयों को दिखाया जा सके.
टेक्स्ट	बिना बैकग्राउंड या बॉर्डर के टेक्स्ट दिखाता है.	कम अहमियत वाले बटन, जो कम ज़रूरी कार्रवाइयों के लिए सही होते हैं. जैसे, नेविगेशन लिंक या "ज़्यादा जानें" या "जानकारी देखें" जैसे सेकंडरी फ़ंक्शन.

इस इमेज में, मटीरियल डिज़ाइन में मौजूद पांच तरह के बटन दिखाए गए हैं:

पांचों बटन कॉम्पोनेंट का एक उदाहरण, जिसमें उनकी खास विशेषताएं हाइलाइट की गई हैं. — पहली इमेज. पांच बटन कॉम्पोनेंट.

एपीआई सरफ़ेस

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