Android ImageButton Control - ImageButton Control Example | W3schools

An ImageButton UI control falls under the AbsoluteLayout which makes it possible for the ImageButton to specify the accurate location of its children. This UI control usually appears as a button with an icon or image rather than a text on it. To use this UI control during the runtime of the application, a user can either click or press it.

Also Read: Android Spinner

Various ImageButton Attributes
The below-provided tables contain major attributes associated with the ImageButton control. In case, you want to see the complete list of the ImageButton attributes then check out the official Android document. The document will also introduce you to the methods which are capable of changing the values of Imagebutton attributes even at the runtime.

[post_middile_section_ad]

The following list of ImageButton attributes is inherited from the android.widget.ImageView class.

S. No. Attribute Description
1 android:src * This attribute accepts a drawable value which is then set as the content of the ImageView.
2 android:baseline * The value of this attribute depicts the offset of the baseline used. This is applicable to a particular ImageView.
3 android:baselineAlignBottom * The value for this attribute can either be true or false.
* If you want to align the baseline with the bottom edge then set the value as true.
4 android:cropToPadding * This attribute accepts either true or false as its value.

* If it is set as true then the provided image will be cropped to fit within the mentioned padding.

5 android:adjustViewBounds * The value of this attribute can either be accepted as true or false.
* If this value is set to true then the ImageView will adjust its boundaries to aspect ration of the drawable provided.

The following list of ImageButton attributes is inherited from the android.view.View class.

S. No. Attribute Description
1 android:id * The value passed to this attribute will be considered as the identifier name of the view.
2 android:background * This attribute accepts a drawable value which is then be set as a background for the view.
3 android:visibility * The value of this attribute decides the visibility of the view on the application.
4 android:contentDescription * This value accepts textual content which briefly explains the content carried by the view.
5 android:onClick * This is a method which gets invoked when the view is clicked.

 

[post_middile_section_ad]

To understand the use of above-mentioned attributes, take a look at the below-given example. It will introduce you to a step-to-step guide for the creation of an Android application with the help of Linear layout and ImageButton control.

Step 1: Start with opening the Android Studio IDE. In here, create an app under the name of myapplication. Store it within the com.example.myapplication. For the better understanding of this step, you can refer to the Hello World Example chapter.

Step 2: It’s time to add a click event to your application. For this, you need to open the MainActivity.java file. Go to src/ directory to find this file. Besides your entered code, the file will also be containing the pre-defined fundamental lifecycle callback methods. 

package com.example.myapplication;
import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageButton;
import android.widget.Toast; 

public class MainActivity extends Activity
{
   ImageButton imgButton;   

   @Override
   protected void onCreate(Bundle savedInstanceState)
   {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      
      imgButton =(ImageButton)findViewById(R.id.imageButton);
      imgButton.setOnClickListener(new View.OnClickListener()
      {
         @Override
         public void onClick(View v)
         {
            Toast.makeText(getApplicationContext(),”You download is
               resumed”,Toast.LENGTH_LONG).show();
         }
      });
   }
}

[post_middile_section_ad]

Step 3: Include the following section of code in the activity_main.xml file. To locate this file, you can trace the res/layout/ directory. In here, you need to add the required Android UI control. 

<?xml version=”1.0″ encoding=”utf-8″?>
<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:paddingLeft=”@dimen/activity_horizontal_margin”
   android:paddingRight=”@dimen/activity_horizontal_margin”
   android:paddingTop=”@dimen/activity_vertical_margin”
   android:paddingBottom=”@dimen/activity_vertical_margin”
   tools:context=”.MainActivity”>   

   <TextView android:text=”W3School”
      android:layout_width=”wrap_content”
      android:layout_height=”wrap_content”
      android:textSize=”30dp”
      android:layout_alignParentTop=”true”
      android:layout_alignRight=”@+id/imageButton”
      android:layout_alignEnd=”@+id/imageButton” />      

   <ImageButton
      android:layout_width=”wrap_content”
      android:layout_height=”wrap_content”
      android:id=”@+id/imageButton”
      android:layout_centerVertical=”true”
      android:layout_centerHorizontal=”true”
      android:src=”@drawable/abc”/>
</RelativeLayout>

Step 4: In the strings.xml file, you will get the definitions of the new string constants. You can find this file under the res/values/ path. Also, you don’t need to define these constants manually as the Android Studio takes care of it on its own. 

<?xml version=”1.0″ encoding=”utf-8″?>
<resources>
   <string name=”app_name”>myapplication</string>
</resources> 

[post_middile_section_ad]

Step 5: Make sure you leave the code of the AndroidManifest.xml file as it is. The default content of the file is given below. 

<?xml version=”1.0″ encoding=”utf-8″?>
<manifest xmlns:android=”http://schemas.android.com/apk/res/android”
   package=”com.example.myapplication” >      
   <application
      android:allowBackup=”true”
      android:icon=”@drawable/ic_launcher”
      android:label=”@string/app_name”
      android:theme=”@style/AppTheme” >

      <activity
         android:name=”com.example.myapplication.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>

Step 6: Just run your myapplication on Android Studio IDE. For that, open any of the project’s activity files and click on the Run button. The Studio will install the app on your AVD (which has been already created during the environment setup) and then initiate the running process of your application. If the setup and the application run successfully, you will be displayed with a final output on the Emulator window.

On the screen, you will be displayed with an ImageButton and once you click on it, you will see a toast message on the screen.