बटन बनाना

बटन की मदद से, उपयोगकर्ता किसी तय की गई कार्रवाई को ट्रिगर कर सकता है. बटन पांच तरह के होते हैं:

टाइप

थीम

मकसद

भरा गया

एक ही रंग का बैकग्राउंड और उससे अलग रंग का टेक्स्ट.

"सबमिट करें" और "सेव करें" जैसी मुख्य कार्रवाइयों के लिए. शैडो इफ़ेक्ट, बटन की अहमियत को हाइलाइट करता है.

टोनल

बैकग्राउंड का रंग, दीवार की सतह के हिसाब से अलग-अलग होता है.

प्राइमरी या अहम कार्रवाइयों के लिए. भरी हुई बॉर्डर वाले बटन, विज़ुअल वज़न देते हैं. साथ ही, ये "कार्ट में जोड़ें" और "साइन इन करें" जैसी कार्रवाइयों के लिए सही होते हैं.

बहुत ज़्यादा गर्म

शेडो की मदद से, इमेज को अलग दिखाया जा सकता है.

प्राइमरी या अहम कार्रवाइयों के लिए. बटन को ज़्यादा प्रमुख बनाने के लिए, ऊंचाई बढ़ाएं.

आउटलाइन किया गया

इसमें कोई भरा हुआ बॉर्डर नहीं है.

उन कार्रवाइयों के लिए जो अहम हैं, लेकिन प्राइमरी नहीं हैं. आउटलाइन वाले बटन, अन्य बटन के साथ अच्छी तरह से काम करते हैं. इनसे "रद्द करें" या "वापस जाएं" जैसी वैकल्पिक और दूसरी कार्रवाइयों के बारे में पता चलता है.

टेक्स्ट

ऐसा टेक्स्ट जिसमें कोई बैकग्राउंड या बॉर्डर न हो.

नेविगेशनल लिंक या "ज़्यादा जानें" या "जानकारी देखें" जैसी सेकंडरी कार्रवाइयों के लिए.

वर्शन के साथ काम करना

इसे लागू करने के लिए, ज़रूरी है कि आपके प्रोजेक्ट का minSDK एपीआई लेवल 21 या उससे ज़्यादा पर सेट हो.

डिपेंडेंसी

भरा हुआ बटन बनाना

भरा हुआ बटन कॉम्पोनेंट, बुनियादी Button कॉम्पोज़ेबल का इस्तेमाल करता है. यह डिफ़ॉल्ट रूप से एक ही रंग से भरा होता है.

नतीजे

बैंगनी रंग के बैकग्राउंड वाला भरा हुआ बटन, जिस पर 'भरा हुआ' लिखा है.
पहली इमेज. भरा हुआ बटन.

भरा हुआ टोनल बटन बनाना

भरा हुआ टोनल बटन कॉम्पोनेंट, FilledTonalButton कॉम्पोज़ेबल का इस्तेमाल करता है. यह डिफ़ॉल्ट रूप से टोनल कलर से भरा होता है.

नतीजे

हल्के बैंगनी रंग के बैकग्राउंड वाला एक टोनल बटन, जिस पर 'भरा हुआ' लिखा है.
दूसरी इमेज. टोन वाला बटन.

आउटलाइन वाला बटन बनाना

आउटलाइन वाला बटन कॉम्पोनेंट, OutlinedButton कॉम्पोज़ेबल का इस्तेमाल करता है. यह डिफ़ॉल्ट रूप से आउटलाइन के साथ दिखता है.

नतीजे

पारदर्शी आउटलाइन वाला बटन, जिसमें काले रंग का बॉर्डर है. इस पर 'आउटलाइन वाला' लिखा है.
तीसरी इमेज. आउटलाइन वाला बटन.

एलिमेंट को हाइलाइट करने वाला बटन बनाना

एलिवेटेड बटन कॉम्पोनेंट, ElevatedButton कॉम्पोज़ेबल का इस्तेमाल करता है. इसमें एक शेडो होता है, जो डिफ़ॉल्ट रूप से ऊंचाई के असर को दिखाता है. यह शेडो के साथ, आउटलाइन वाले बटन के तौर पर दिखता है.

नतीजे

स्लेटी रंग के बैकग्राउंड वाला उभरा हुआ बटन, जिस पर 'उभरा हुआ' लिखा है.
चौथी इमेज. उभरा हुआ बटन.

टेक्स्ट बटन बनाना

टेक्स्ट बटन कॉम्पोनेंट, TextButton कॉम्पोज़ेबल का इस्तेमाल करता है. क्लिक किए जाने तक, यह सिर्फ़ टेक्स्ट के तौर पर दिखता है. इसमें डिफ़ॉल्ट रूप से कोई सॉलिड फ़िल या आउटलाइन नहीं होता.

नतीजे

'टेक्स्ट बटन' वाला टेक्स्ट बटन
पांचवीं इमेज. टेक्स्ट बटन.

प्रमुख बिंदु

  • onClick: यह फ़ंक्शन तब कॉल किया जाता है, जब उपयोगकर्ता बटन दबाता है.
  • enabled: अगर इस पैरामीटर की वैल्यू गलत है, तो बटन उपलब्ध नहीं होगा और बंद रहेगा.
  • colors: ButtonColors का एक इंस्टेंस, जो बटन में इस्तेमाल किए गए रंगों का पता लगाता है.
  • contentPadding: बटन के अंदर पैडिंग.

ऐसे संग्रह जिनमें यह गाइड शामिल है

यह गाइड, चुने गए क्विक गाइड के कलेक्शन का हिस्सा है. इसमें Android डेवलपमेंट के बड़े लक्ष्यों के बारे में बताया गया है:

जानें कि कॉम्पोज़ेबल फ़ंक्शन की मदद से, Material Design डिज़ाइन सिस्टम के आधार पर, आसानी से खूबसूरत यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट कैसे बनाए जा सकते हैं.

क्या आपका कोई सवाल है या सुझाव/राय देनी है

अक्सर पूछे जाने वाले सवालों के पेज पर जाएं और क्विक गाइड के बारे में जानें. इसके अलावा, हमसे संपर्क करके अपने सुझाव/राय दें.