Mobile App and

Development
BSCS 8th
Android Event Handling using Button
Android buttons are GUI components which are sensible to taps (clicks) by the
user. When the user taps/clicks on button in an Android app, the app can respond to the
click/tap.

Button code in XML:

The below code will create Button and write “Abhi Android” text on it.

<Button
android:id="@+id/simpleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Abhi Android"/>

Attributes of Button in Android:

Now let’s we discuss some important attributes that helps us to configure a Button in
your xml file (layout).
1. id: id is an attribute used to uniquely identify a text Button. Below is the example
code in which we set the id of a Button.

<Button
android:id="@+id/simpleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Abhi Android"/>

2. gravity: The gravity attribute is an optional attribute which is used to control the
alignment of the text like left, right, center, top, bottom, center_vertical,
center_horizontal etc.
Below is the example code with explanation included in which we set the right and
center vertical gravity for text of a Button.
<Button
android:id="@+id/simpleButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Abhi Android"
android:layout_centerInParent="true"
android:gravity="right|center_vertical"/><!--set the gravity of button-->

3. text: text attribute is used to set the text in a Button. We can set the text in xml as
well as in the java class.
Below is the example code with explanation included in which we set the text “Learning
Android @ AbhiAndroid” in a Button.

<Button
android:id="@+id/simpleButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Learn Android @ AbhiAndroid"/><!--display text on button-->
4.textColor: textColor attribute is used to set the text color of a Button. Color value is in
the form of “#argb”, “#rgb”

<Button
android:id="@+id/simpleButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="AbhiAndroid"
android:textColor="#f00"/><!--red color for the text-->

5. textSize: textSize attribute is used to set the size of the text on Button. We can set the
text size in sp(scale independent pixel) or dp(density pixel).
Below is the example code in which we set the 25sp size for the text of a Button.

<Button
android:id="@+id/simpleButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="AbhiAndroid"
android:textSize="25sp" /><!--25sp text size-->

6. textStyle: textStyle attribute is used to set the text style of a Button. The possible text
styles are bold, italic and normal. If we need to use two or more styles for a Button then
“|” operator is used for that.
Below is the example code with explanation included, in which we set the bold and italic
text styles for text of a button.

<Button
android:id="@+id/simpleButton"
android:layout_width="fill_parent"
 android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="AbhiAndroid"
android:textSize="20sp"
android:textStyle="bold|italic"/><!--bold and italic text style-->

7. background: background attribute is used to set the background of a Button. We can

set a color or a drawable in the background of a Button.
Below is the example code in which we set the gren color for the background, Black
color for the displayed text and set 15dp padding from all the side’s for Button.

<Button
android:id="@+id/simpleButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Download"
android:textSize="20sp"
android:padding="15dp"
android:textStyle="bold|italic"
android:background="#147D03" /><!--Background green color-->

8. padding: padding attribute is used to set the padding from left, right, top or bottom.
In above example code of background we also set the 10dp padding from all the side’s of
button.

Button Example In Android Studio:

Step 1: Create a new project in Android Studio and name it ButtonExample.

Select File -> New -> New Project and Fill the forms and click "Finish" button.
Step 2: Now open res -> layout -> xml (or) activity_main.xml and add following code.
Here we are designing the UI of two button in Relative Layout.

<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=".MainActivity">

<Button
android:id="@+id/simpleButton1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="100dp"
android:background="#00f"
android:drawableRight="@drawable/ic_launcher"
android:hint="AbhiAndroid Button1"
android:padding="5dp"
android:textColorHint="#fff"
android:textSize="20sp"
android:textStyle="bold|italic" />

<Button
android:id="@+id/simpleButton2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#f00"
android:drawableLeft="@drawable/ic_launcher"
 android:hint="AbhiAndroid Button2"
android:padding="5dp"
android:textColorHint="#fff"
android:textSize="20sp"
android:textStyle="bold|italic" />

</RelativeLayout>

Step 3: Now Open app -> package -> MainActivity.java and the following code. Here
using setOnClickListener() method on button and using Toast we will display which
button is clicked by user.

package example.abhiandriod.buttonexample;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

Button simpleButton1, simpleButton2;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
simpleButton1 = (Button) findViewById(R.id.simpleButton1);//get id of button
1
simpleButton2 = (Button) findViewById(R.id.simpleButton2);//get id of button
2
 simpleButton1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(), "Simple Button 1",
Toast.LENGTH_LONG).show();//display the text of button1
}
});
simpleButton2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(), "Simple Button 2",
Toast.LENGTH_LONG).show();//display the text of button2
}
});
}

Output:
Now start the AVD in Emulator and run the App. You will see two button. Click on any
button and you will see the message on screen which button is clicked.
Multiple Buttons ClickListener()

Creating multiple buttons with onClickListener() in Android is one of

the most common tasks for Android developers. As a result, many
developers have struggled with finding a good solution to this problem.

Implementing this feature can be a bit tricky, as you need to be aware of

the different events that can occur when a user interacts with your app.
To help you out, here’s a quick guide on how to properly
implement onClickListener for multiple buttons

Step 1: Implement OnClickListener() interface in your Activity

First, you’ll need to create a class that implements

the OnClickListener interface. This class will be responsible for
handling all the button click events.

public class MainActivity extends AppCompatActivity implements

View.OnClickListener {
}

After implementing an interface to your Activity/Fragment it will ask

you to implement its method onClick().

Step 2: Implement onClick() method in your Activity/Fragment

Next, you’ll need to override the onClick method. This is where you’ll
be able to determine which button was clicked and respond
accordingly. You can use

public class MainActivity extends AppCompatActivity implements

View.OnClickListener {

@Override
public void onClick(View v) {
// handling onClick Events
}
}

Here, you can see that it added onClick() method to your class. It is the
default method when onClick is called from view. It means that when
the user will perform click on your view, your class will redirect calls to
this method.

Step 3: Implement OnClickListener() For Buttons

public class MainActivity extends AppCompatActivity implements

View.OnClickListener {

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

Button one = (Button) findViewById(R.id.buttonOne);

one.setOnClickListener(this); // calling onClick() method
Button two = (Button) findViewById(R.id.buttonTwo);
two.setOnClickListener(this);
Button three = (Button) findViewById(R.id.buttonThree);
three.setOnClickListener(this);
}
 @Override
public void onClick(View v) {
}
}

Here we are adding this keyword to the onClickListener() method. It

redirects the call to the onClick() method. If you don’t
use this keyword here, your call will not be redirected
to onClick() method when a user performs a click.

Note that: If you haven’t implemented View.OnClickListener interface

to your class, it will show an error when you implement this keyword
to onClickListener() method for the view.

Step 4: Find the button by ID and implement your logic to

handle the click action for the button.

public class MainActivity extends AppCompatActivity implements

View.OnClickListener {

@Override
public void onClick(View v) {

switch (v.getId()) {
case R.id.buttonOne:
// TODO: action to perform when user clicks buttonOne.
break;

case R.id.buttonTwo:
// TODO: handle button click action
break;

case R.id.buttonThree:
 // TODO: handle button click action
break;

default:
break;
}
}
}

Here, we are separating all the views by their id. So, we can implement
different tasks for different views. It will allow you to handle all
the onClick calls from one place and it will look better if you manage
your code like this.
Toast
In Android, Toast is used to display information for a period of time. It contains a
message to be displayed quickly and disappears after specified period of time. It does
not block the user interaction. we use two constants for setting the duration for
the Toast. Toast notification in android always appears near the bottom of the screen.
We can also create our custom toast by using custom layout(xml file).
In Android, Toast is used when we required to notify user about an operation without
expecting any user input. It displays a small popup for message and automatically fades
out after timeout.

Important Methods Of Toast:

1. makeText(Context context, CharSequence text, int duration): This method is used to
initiate the Toast. This method take three parameters First is for the application
Context, Second is text message and last one is duration for the Toast.
Constants of Toast: Below is the constants of Toast that are used for setting the
duration for the Toast.
1. LENGTH_LONG: It is used to display the Toast for a long period of time. When we set
this duration the Toast will be displayed for a long duration.
2. LENGTH_SHORT: It is used to display the Toast for short period of time. When we set
this duration the Toast will be displayed for short duration.

Below we show the use of makeText() method of Toast in which we set application
context, a text message and duration for the Toast.

Toast toast = Toast.makeText(getApplicationContext(), "Simple Toast",

Toast.LENGTH_LONG);

2. show(): This method is used to display the Toast on the screen. This method is display
the text which we create using makeText() method of Toast.
Below we Firstly initiate the Toast and then display it using show() method.
Toast toast = Toast.makeText(getApplicationContext(), "Simple Toast In Android",
Toast.LENGTH_LONG); // initiate the Toast with context, message and duration for the
Toast
toast.show(); // display the Toast
Intents
Android uses Intent for communicating between the components of an Application and
also from one application to another application.
Intent are the objects which is used in android for passing the information among
Activities in an Application and from one app to another also. Intent are used for
communicating between the Application components and it also provides the
connectivity between two apps.
For example: Intent facilitate you to redirect your activity to another activity on
occurrence of any event. By calling, startActivity() you can perform this task.

Intent intent = new Intent(getApplicationContext(), SecondActivity.class);

startActivity(intent);

Types of Intents:
Intent are of two types: Explicit Intent and Implicit Intent

Explicit Intent:
 Explicit Intents are used to connect the application internally.
 In Explicit we use the name of component which will be affected by Intent. For
Example: If we know class name then we can navigate the app from One Activity
to another activity using Intent. In the similar way we can start a service to
download a file in background process.
 Explicit Intent work internally within an application to perform navigation and
data transfer. The below given code snippet will help you understand the concept
of Explicit Intents
 Intent intent = new Intent(getApplicationContext(), SecondActivity.class);

 startActivity(intent);

 Here SecondActivity is the JAVA class name where the activity will now be
navigated.
Implicit Intent:
 In Implicit Intents we do need to specify the name of the component. We just
specify the Action which has to be performed and further this action is handled
by the component of another application.
 The basic example of implicit Intent is to open any web page

Let’s take an example to understand Implicit Intents more clearly. We have to open a
website using intent in your application. See the code snippet given below

Intent intentObj = new Intent(Intent.ACTION_VIEW);

intentObj.setData(Uri.parse("https://www.testwebsite.com"));
startActivity(intentObj);

Unlike Explicit Intent you do not use any class name to pass through Intent(). In this
example we has just specified an action. Now when we will run this code then Android
will automatically start your web browser and it will open test website home page.

Intent Example In Android:

Let’s implement Intent for a very basic use. In the below example we will Navigate from
one Activity to another and open a web homepage of AbhiAndroid using Intent. The
example will show you both implicit and explicit Intent together.

Create a project in Android Studio and named it “Intents”. Make an activity, which
would consists Java file; MainActivity.java and an xml file for User interface which would
be activity_main.xml
Step 1: Let’s design the UI of activity_main.xml:

 First design the text view displaying basic details of the App
 Second design the two button of Explicit Intent Example and Implicit Intent
Example

Below is the complete code of activity_main.xml

<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:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="If you click on Explicit example we will navigate to second
activity within App and if you click on Implicit example AbhiAndroid Homepage will
open in Browser"
android:id="@+id/textView2"
android:clickable="false"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:layout_marginTop="42dp"
android:background="#3e7d02"
android:textColor="#ffffff" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Explicit Intent Example"
android:id="@+id/explicit_Intent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="147dp" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
 android:text="Implicit Intent Example"
android:id="@+id/implicit_Intent"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />

</RelativeLayout>

Step 2: Design the UI of second activity activity_second.xml

Now lets design UI of another activity where user will navigate after he click on Explicit
Example button. Go to layout folder, create a new activity and name it
activity_second.xml.

 In this activity we will simply use TextView to tell user he is now on second
activity.

Below is the complete code of activity_second.xml

<?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"
android:background="#CCEEAA"
tools:context="com.example.android.intents.SecondActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="This is Second Activity"
 android:id="@+id/textView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>

Step 3: Implement onClick event for Implicit And Explicit Button inside
MainActivity.java
Now we will use setOnClickListener() method to implement OnClick event on both
the button. Implicit button will open AbhiAndroid.com homepage in browser and
Explicit button will move to SecondActivity.java.
Below is the complete code of MainActivity.java

package com.example.android.intents;

import android.content.Intent;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

Button explicit_btn, implicit_btn;

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

explicit_btn = (Button)findViewById(R.id.explicit_Intent);
implicit_btn = (Button) findViewById(R.id.implicit_Intent);
 //implement Onclick event for Explicit Intent

explicit_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

Intent intent = new Intent(getBaseContext(), SecondActivity.class);

startActivity(intent);

}
});
//implement onClick event for Implicit Intent

implicit_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

Intent intent = new Intent(Intent.ACTION_VIEW);

intent.setData(Uri.parse("https://www.abhiandroid.com"));
startActivity(intent);
}
});

}
}

Step 4: Create A New JAVA class name SecondActivity

Now we need to create another SecondActivity.java which will simply open the layout of
activity_second.xml . Also we will use Toast to display message that he is on second
activity.
Below is the complete code of SecondActivity.java:
package com.example.android.intents;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Toast;

public class SecondActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_second);
Toast.makeText(getApplicationContext(), "We are moved to second
Activity",Toast.LENGTH_LONG).show();
}
}