Wednesday, June 13, 2012

Event Handling

What are events? Why do we need to handle them? Events occur when an user interact with the UI components of our app like buttons. When these events occurs, a function/method is called. As a programmer, it is our responsibility to dump a block of code inside that method/function and make the UI respond to the user, like closing the application when the user presses the "quit" button. Seems like a good idea. Lets do just that.


Create a project. First, we need to include a button in our layout and id it. I do the same in the following code:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.60"
android:text="@string/t_some_text"
/>
<Button
android:id="@+id/quit_button_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/b_quit" />
</LinearLayout>
view raw main.xml hosted with ❤ by GitHub


In our source code ( java file ), we need to add a variable for this button and add a listener to it, which is done in the following code:

package com.android.sample.events;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
public class BaseActivity extends Activity
{
// declare variable to represent our components...
Button quitButton;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// inside this method we reference our button and add event listener...
setupViews();
}
private void setupViews()
{
// quitButton is linked to our button created in the layout...
// using the id...
quitButton=(Button)findViewById(R.id.quit_button_id);
// on-click listener is added to the button...
// the method onClick() is called whenever the button is pressed...
quitButton.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v)
{
// this will close our activity ...
// since there are no other activities running..
// this will quit our app...
finish();
}
});
}
}


This can also be done another way. Instead of adding OnClickListener on the java file, we can handle events by addding the tag android:onClick="myOnClickMethod". "myOnClickMethod" is a method defined inside our activity class(java file). Any name can be given to the method but it must have an argument of type "View". Take a look at my button in layout and the method myOnClickMethod() in my activity class:

A code snippet for button:





<Button
android:id="@+id/quit_button_id "
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/b_quit"
android:onClick="myOnClickMethod"
/>


The Activity:
package com.android.sample.events;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
public class BaseActivity extends Activity
{
// declare variable to represent our components...
Button quitButton;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// inside this method we reference our button...
setupViews();
}
private void setupViews()
{
// quitButton is linked to our button created in the layout...
// using the id...
quitButton=(Button)findViewById(R.id.quit_button_id);
}
// this method is called when the quit button is pressed...
// note that it has an argument of type "View" which is mandatory...
public void myOnClickMethod(View v)
{
finish();
}
}


These methods are enough to implement event listeners for 2 or 3 buttons. But what if we need to handle the events of 10 buttons. For this situation, there is a special way of implementing listeners. Lets say we have 4 buttons and a text view as in the layout below. We need to print the event occurred like printing "Button 1 is pressed" when button1 is pressed. What we do is that, we make our activity to implement a class "View.OnClickListener" and then, we implement the common method onClick(), in which we differentiate events occurred by using id of the buttons. This is done in the code given below.


main.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/t_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.54"
android:text="@string/t_some_text" />
<Button
android:id="@+id/b_1_id "
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/b_1" />
<Button
android:id="@+id/b_2_id "
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/b_2" />
<Button
android:id="@+id/b_3_id "
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/b_3" />
<Button
android:id="@+id/b_4_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/b_4" />
</LinearLayout>
view raw main.xml hosted with ❤ by GitHub


BaseActivity.java

package com.android.sample.events;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
public class BaseActivity extends Activity implements View.OnClickListener
{
// declare variable to represent our components...
Button b1,b2,b3,b4;
TextView t1;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// inside this method we reference our buttons, textview and add event listeners...
setupViews();
}
private void setupViews()
{
b1=(Button)findViewById(R.id.b_1_id);
b2=(Button)findViewById(R.id.b_2_id);
b3=(Button)findViewById(R.id.b_3_id);
b4=(Button)findViewById(R.id.b_4_id);
t1=(TextView)findViewById(R.id.t_id);
b1.setOnClickListener(this);
b2.setOnClickListener(this);
b3.setOnClickListener(this);
b4.setOnClickListener(this);
}
// this method is called when any of the buttons is clicked...
// the text on the TextView is set according the button pressed...
@Override
public void onClick(View v)
{
switch(v.getId())
{
case R.id.b_1_id:
t1.setText("Button 1 is pressed");
break;
case R.id.b_2_id:
t1.setText("Button 2 is pressed");
break;
case R.id.b_3_id:
t1.setText("Button 3 is pressed");
break;
case R.id.b_4_id:
t1.setText("Button 4 is pressed");
break;
}
}
}
Some snaps:


1. The quit button:






2. Button2 event:






3. Button4 event:








OK... thats it for now guys!!! See ya later with more.....

No comments:

Post a Comment