Android Tutorial: Button

By:   –  Last updated:   –  #android ·  #java

Code Theme [Dark]

Content Overview [Hide]

Tutorial about how to use Android button.

1 Add Button

Button (android.widget.Button) and image button (android.widget.ImageButton) are the simplest buttons of Android UI controls.

It's easy to add Andorid UI controls using Android Studio layout editor.

android_ui_button

By selecting Design mode of the Android Studio layout editor, you can just drag and drop controls or widgets to UI interface of your application. Android Studio will generate XML markup automatically for controls you added.

Alternatively, you can add XML markup of UI controls directly using the text mode.

For example, add markups for a Button and an ImageButton in layout file: res/layout/activity_uicontrols_button.xml. And set a drawable resource to android:src attribute of the image button.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.codevoila.androidtuts.uicontrols.ButtonActivity"
    android:orientation="vertical">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAllCaps="false"
        android:text="I am a Button"
        android:id="@+id/btn_a_button" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btn_an_imagebutton"
        android:src="@android:drawable/ic_btn_speak_now"/>
</LinearLayout>

2 Ways to handle button click

There are five common ways to set button click listener in Android.

2.1 Use an inner class which implements listener interface

/* ButtonActivity.java */

public class ButtonActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_uicontrols_button);

        Button btn = (Button) this.findViewById(R.id.btn_a_button);
        ImageButton btnImage = (ImageButton) this.findViewById(R.id.btn_an_imagebutton);

        btn.setOnClickListener(new MyListener());
        // Or
        MyListener myListener = new MyListener();
        btnImage.setOnClickListener(myListener);
    }

    class MyListener implements View.OnClickListener {

        @Override
        public void onClick(View view) {
            switch (view.getId()) {
                case R.id.btn_a_button:
                    Toast.makeText(ButtonActivity.this, "I am a Button!", Toast.LENGTH_LONG).show();
                    break;
                case R.id.btn_an_imagebutton:
                    Toast.makeText(ButtonActivity.this, "I am an ImageButton!", Toast.LENGTH_LONG).show();
                    break;
            }
        }
    }
}

2.2 Create an instance of the inner class which implements listener interface

/* ButtonActivity.java */

public class ButtonActivity extends AppCompatActivity {

    private View.OnClickListener myListener = new View.OnClickListener(){

        @Override
        public void onClick(View view) {
            switch (view.getId()) {
                case R.id.btn_a_button:
                    Toast.makeText(ButtonActivity.this, "I am a Button!", Toast.LENGTH_LONG).show();
                    break;
                case R.id.btn_an_imagebutton:
                    Toast.makeText(ButtonActivity.this, "I am an ImageButton!", Toast.LENGTH_LONG).show();
                    break;
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_uicontrols_button);

        Button btn = (Button) this.findViewById(R.id.btn_a_button);
        ImageButton btnImage = (ImageButton) this.findViewById(R.id.btn_an_imagebutton);

        btn.setOnClickListener(myListener);
        btnImage.setOnClickListener(myListener);
    }


}

2.3 Anonymous inner class extends the default listener

/* ButtonActivity.java */

public class ButtonActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_uicontrols_button);

        Button btn = (Button) this.findViewById(R.id.btn_a_button);
        ImageButton btnImage = (ImageButton) this.findViewById(R.id.btn_an_imagebutton);
        
        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(ButtonActivity.this,"I am a Button!", Toast.LENGTH_LONG).show();
            }
        });

        btnImage.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(ButtonActivity.this,"I am an ImageButton!", Toast.LENGTH_LONG).show();
            }
        });
    }
}

2.4 Implement listener interface in Activity

/* ButtonActivity.java */

public class ButtonActivity extends AppCompatActivity implements View.OnClickListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_uicontrols_button);

        Button btn = (Button) this.findViewById(R.id.btn_a_button);
        ImageButton btnImage = (ImageButton) this.findViewById(R.id.btn_an_imagebutton);
        
        btn.setOnClickListener(this);
        btnImage.setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.btn_a_button:
                Toast.makeText(ButtonActivity.this,"I am a Button!", Toast.LENGTH_LONG).show();
                break;
            case R.id.btn_an_imagebutton:
                Toast.makeText(ButtonActivity.this,"I am an ImageButton!", Toast.LENGTH_LONG).show();
                break;
        }
    }
}

2.5 Set listener method in layout markup

Create a method to listen button click. This method must:

  • be public
  • return void
  • has only one parameter whose type is android.view.View.
/* ButtonActivity.java */

public class ButtonActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_uicontrols_button);
    }

    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.btn_a_button:
                Toast.makeText(ButtonActivity.this,"I am a Button!", Toast.LENGTH_LONG).show();
                break;
            case R.id.btn_an_imagebutton:
                Toast.makeText(ButtonActivity.this,"I am an ImageButton!", Toast.LENGTH_LONG).show();
                break;
        }
    }
}

Specify the defined method as button click listener in XML markup.

<!-- res/layout/activity_uicontrols_button.xml -->

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAllCaps="false"
    android:text="I am a Button"
    android:id="@+id/btn_a_button"
    android:onClick="onClick"/>

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/btn_an_imagebutton"
    android:src="@android:drawable/ic_btn_speak_now"
    android:onClick="onClick"/>