Create An ImageButton In Android App Using Android Studio

Introduction

In this article you will learn how to create an image button in Android applications using Android studio.

Requirements

Android Studio version 2.1.3

If you want to develop the image button, it should follow the below steps.

Step 1

Now, open Android Studio and you can choose the File and New and afterwards choose NewProject.

android

Step 2

Here, we can create your application name and choose where to store your project and click on the NEXT button.

android

Now, we can choose the version -- it is Target Android Devices.Then click the NEXT button.

android

Step 3

Here,we can add the activity and click the NEXT button.

android

Now, we can write the activity name and Click the FINISH button.

android

Step 4

Now, open your project and you will go to activity_main.xml and afterwards you build the design, it should be in toolbox, and if you want some options, (Image Button), and use the drag and drop method.

android

Step 5

Now, you will go to project Drawable and click the Show Explorer button, and go to the Drawable folder and copy and paste some images and generate the images in your project.

android

Now, you can go to Drawable folder. You can choose some images and you can copy and paste them.

android

Now some images are added to your project.

android

Here, you can see the layout of your design.

android

Step 6

Here, your build on the design and write the .XML code .

activity_mai.xml code

<?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: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="xyz.rvconstructions.www.imagebutton.MainActivity">
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Image Button " android:id="@+id/textView" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_alignParentStart="true" />
<ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/cshabutton" android:padding="20dp" android:src="@drawable/csharp" android:layout_alignTop="@+id/textView" android:layout_toRightOf="@+id/textView" android:layout_toEndOf="@+id/textView" />
<ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/googlbutton" android:padding="20dp" android:src="@drawable/google" android:layout_below="@+id/cshabutton" android:layout_centerHorizontal="true" />
</RelativeLayout>

Step 7

Now, you will go to MainActivity.java page and build the Java code. First, you declare the heaterfile is an extention file.

android

Now, you will declare the full Java code in your project.

package xyz.rvconstructions.www.imagebutton;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.graphics.Color;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ImageButton;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageButton simpleImageButtonCsharp = (ImageButton) findViewById(R.id.cshabutton);
ImageButton simpleImageButtonGoogle = (ImageButton) findViewById(R.id.googlbutton);
simpleImageButtonCsharp.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(), "your clicked c-Sharp", Toast.LENGTH_LONG).show();
}
); simpleImageButtonGoogle.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(), "your clicked Google", Toast.LENGTH_LONG).show();
}
});
}
} // This is just a sample script. Paste your real code (javascript or HTML) here.
if ('this_is' == /an_example/) {
of_beautifier();
} else {
var a = b ? (c % d) : e[f];
}

Step 8

Here, you will go to run it, and select the RUN App option.

android

Here, you will choose the emulator or device, it is Nokia Nokia _X.

android

Step 9

Here you can see the output.

android

Now, you will click the C-sharp button

android

Now, you will click the Google button .

android