How To Use Image Button In Android

Introduction:-
In this tutorial I'll show you how to use image button in android.

Implementation:-

1. Create New Android Project

• Click File > New > New Android Project

• Add image button in your activity_main.xml file

<ImageButton

        android:id="@+id/imageButton1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_centerVertical="true"

        android:src="@drawable/ic_launcher" />

• Add image button listener and toast message to show image button is clicked in your Mainactivity.xml

private ImageButton button;

//Add image button listener

        button = (ImageButton) findViewById(R.id.imageButton1);

        button.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

//Add toast message to show image button clicked

Toast.makeText(getApplicationContext(), getResources().getString(R.string.toast), Toast.LENGTH_SHORT).show();

}

});

• Add in string.xml

    <string name="image_button">Image Button</string>

    <string name="toast">Image Button clicked</string>

2. MainActivity.java (paste this code in your MainActivity.java file)

package com.example.imagebuttonexample;

import android.support.v7.app.ActionBarActivity;

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.widget.Button;

import android.widget.ImageButton;

import android.widget.Toast;

public class MainActivity extends ActionBarActivity {

private ImageButton button;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        

        //Add image button listener

        button = (ImageButton) findViewById(R.id.imageButton1);

        button.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

//Add toast message to show image button clicked

Toast.makeText(getApplicationContext(), getResources().getString(R.string.toast), Toast.LENGTH_SHORT).show();

}

});

    }

    @Override

    public boolean onCreateOptionsMenu(Menu menu) {

        // Inflate the menu; this adds items to the action bar if it is present.

        getMenuInflater().inflate(R.menu.main, menu);

        return true;

    }

    @Override

    public boolean onOptionsItemSelected(MenuItem item) {

        // Handle action bar item clicks here. The action bar will

        // automatically handle clicks on the Home/Up button, so long

        // as you specify a parent activity in AndroidManifest.xml.

        int id = item.getItemId();

        if (id == R.id.action_settings) {

            return true;

        }

        return super.onOptionsItemSelected(item);

    }

}

3. activity_main.xml (paste this code in your activity_main.xml file)

<RelativeLayout 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.example.imagebuttonexample.MainActivity" >

    <ImageButton

        android:id="@+id/imageButton1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_centerVertical="true"

        android:src="@drawable/ic_launcher" />

    <TextView

        android:id="@+id/textView1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_above="@+id/imageButton1"

        android:layout_centerHorizontal="true"

        android:layout_marginBottom="38dp"

        android:text="@string/image_button" />

</RelativeLayout>

4. string.xml (paste this code in your string.xml file)

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <string name="app_name">Image Button Example</string>

    <string name="image_button">Image Button</string>

    <string name="action_settings">Settings</string>

    <string name="toast">Image Button clicked</string>

</resources>

5. AndroidMenifest.xml 

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

    package="com.example.imagebuttonexample"

    android:versionCode="1"

    android:versionName="1.0" >

    <uses-sdk

        android:minSdkVersion="8"

        android:targetSdkVersion="21" />

    <application

        android:allowBackup="true"

        android:icon="@drawable/ic_launcher"

        android:label="@string/app_name"

        android:theme="@style/AppTheme" >

        <activity

            android:name=".MainActivity"

            android:label="@string/app_name" >

            <intent-filter>

                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />

            </intent-filter>

        </activity>

    </application>

</manifest>

Now run your application

Output:-

You can also download full source code .zip file.

Download

You can also download .apk file.

Download