अपने ऐप्लिकेशन में बटन जोड़ना

Compose को आज़माएं
Jetpack Compose, Android के लिए यूज़र इंटरफ़ेस (यूआई) टूलकिट है. हमारा सुझाव है कि आप इसका इस्तेमाल करें. Compose में कॉम्पोनेंट जोड़ने का तरीका जानें.
बटन →

बटन में टेक्स्ट या कोई आइकॉन या दोनों हो सकते हैं. इससे यह पता चलता है कि उपयोगकर्ता के टैप करने पर कौनसी कार्रवाई होती है.

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

  
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingLeft="16dp"
      android:paddingRight="16dp"
      android:orientation="vertical" >
  
      <Button
          android:id="@+id/supabutton"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="I'm a button" />
  
      <ImageButton
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:contentDescription="A tiny Android icon"
          android:src="@drawable/baseline_android_24"
          app:tint="#ff0000" />
  
      <Button
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:drawableStart="@drawable/baseline_android_24"
          android:drawablePadding="4dp"
          android:drawableTint="#ff0000"
          android:text="I'm a button with an icon" />
  </LinearLayout>

ऊपर दिया गया कोड, कुछ इस तरह का आउटपुट जनरेट करता है:

तीन तरह के बटन दिखाने वाली इमेज
पहली इमेज. बटन के तीन स्टाइल.

क्लिक इवेंट का जवाब देना

जब उपयोगकर्ता किसी बटन पर टैप करता है, तो Button ऑब्जेक्ट को ऑन-क्लिक इवेंट मिलता है.

इवेंट हैंडलर को प्रोग्राम के ज़रिए तय करने के लिए, एक View.OnClickListener ऑब्जेक्ट बनाएं और इसे बटन को असाइन करें. इसके लिए, setOnClickListener(View.OnClickListener), को कॉल करें. जैसे, यहां दिए गए उदाहरण में दिखाया गया है:

Kotlin

findViewById<Button>(R.id.supabutton)
  .setOnClickListener {
      Log.d("BUTTONS", "User tapped the Supabutton")
  }

Java

Button button = (Button) findViewById(R.id.supabutton);
button.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
      Log.d("BUTTONS", "User tapped the Supabutton");
    }
});

बटन को स्टाइल करना

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

अलग-अलग बैकग्राउंड वाले बटन को पसंद के मुताबिक बनाने के लिए, android:background एट्रिब्यूट के साथ, ड्रॉएबल या कलर रिसॉर्स तय करें. इसके अलावा, बटन के लिए स्टाइल लागू किया जा सकता है. यह एचटीएमएल स्टाइल की तरह काम करता है. इससे बैकग्राउंड, फ़ॉन्ट, और साइज़ जैसी कई स्टाइल प्रॉपर्टी तय की जा सकती हैं. स्टाइल लागू करने के बारे में ज़्यादा जानने के लिए, स्टाइल और थीम देखें.

बिना बॉर्डर वाला बटन

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

बिना बॉर्डर वाला बटन बनाने के लिए, बटन पर borderlessButtonStyle स्टाइल लागू करें. जैसे, यहां दिए गए उदाहरण में दिखाया गया है:

<Button
  android:id="@+id/supabutton"
  style="?android:attr/borderlessButtonStyle"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="I'm a button" />

पसंद के मुताबिक बैकग्राउंड

अगर आपको अपने बटन के दिखने के तरीके में पूरी तरह से बदलाव करना है, तो पसंद के मुताबिक बैकग्राउंड तय किया जा सकता है. हालांकि, सामान्य बिटमैप या रंग देने के बजाय, आपका बैकग्राउंड स्टेट लिस्ट रिसॉर्स होना चाहिए. यह बटन की मौजूदा स्थिति के हिसाब से बदलता है.

स्टेट लिस्ट को किसी एक्सएमएल फ़ाइल में तय किया जा सकता है. इसमें बटन की अलग-अलग स्थितियों के लिए इस्तेमाल की जाने वाली तीन इमेज या रंग तय किए जाते हैं.

बटन के बैकग्राउंड के लिए, स्टेट लिस्ट ड्रॉएबल बनाने के लिए, यह तरीका अपनाएं:

  1. बटन के बैकग्राउंड के लिए तीन बिटमैप बनाएं. ये बिटमैप, बटन की डिफ़ॉल्ट, टैप की गई, और फ़ोकस की गई बटन स्थितियों को दिखाते हैं. यह पक्का करने के लिए कि आपकी इमेज, अलग-अलग साइज़ के बटन पर फ़िट हों, बिटमैप को नाइन-पैच बिटमैप के तौर पर बनाएं.
  2. बिटमैप को अपने प्रोजेक्ट की res/drawable/ डायरेक्ट्री में रखें. हर बिटमैप का नाम, बटन की उस स्थिति के हिसाब से रखें जिसे वह दिखाता है. जैसे, button_default.9.png, button_pressed.9.png, और button_focused.9.png.
  3. res/drawable/ डायरेक्ट्री में एक नई एक्सएमएल फ़ाइल बनाएं. इसका नाम कुछ ऐसा रखें button_custom.xml. इसमें, यहां दिया गया एक्सएमएल डालें: 
    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/button_pressed"
          android:state_pressed="true" />
    <item android:drawable="@drawable/button_focused"
          android:state_focused="true" />
    <item android:drawable="@drawable/button_default" />
</selector>

    इससे एक ड्रॉएबल रिसॉर्स तय होता है. बटन की मौजूदा स्थिति के हिसाब से इसकी इमेज बदलती है.

    • पहले <item> में, वह बिटमैप तय किया जाता है जिसका इस्तेमाल तब किया जाता है, जब बटन को टैप (चालू) किया जाता है.
    • दूसरे <item> में, वह बिटमैप तय किया जाता है जिसका इस्तेमाल तब किया जाता है, जब बटन फ़ोकस में होता है. जैसे, जब ट्रैकबॉल या डायरेक्शनल पैड का इस्तेमाल करके बटन को हाइलाइट किया जाता है.
    • तीसरे <item> में, वह बिटमैप तय किया जाता है जिसका इस्तेमाल तब किया जाता है, जब बटन डिफ़ॉल्ट स्थिति में होता है. यानी, न तो उसे टैप किया गया हो और न ही वह फ़ोकस में हो.

    यह एक्सएमएल फ़ाइल, एक ड्रॉएबल रिसॉर्स को दिखाती है. जब Button के बैकग्राउंड के लिए इसका रेफ़रंस दिया जाता है, तो बटन की स्थिति के हिसाब से दिखने वाली इमेज बदल जाती है.

  4. ड्रॉएबल एक्सएमएल फ़ाइल को बटन के बैकग्राउंड के तौर पर लागू करें: 
    <Button
    android:id="@+id/button_send"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button_send"
    android:onClick="sendMessage"
    android:background="@drawable/button_custom"  />

इस एक्सएमएल सिंटैक्स के बारे में ज़्यादा जानने के लिए, StateListDrawable के बारे में पढ़ें. इसमें यह भी बताया गया है कि बंद, कर्सर वाले या किसी अन्य स्थिति में मौजूद बटन को कैसे तय किया जाता है.