Android OS App Development: Buttons


After the “Hello World” project, the next project that most people jump into is a simple app that uses buttons.

In this tutorial we will use XML to create the layout of our project and the code the rest in java using the Exclipse IDE.

Eclipse has a built in XML editor (through the Android SDK) that allows you to edit and create your app layout.  You can also use DroidDraw as I did in the tutorial, which is available for free (please donate!) from http://www.droiddraw.org

The code is straight forward (if you have a lot of java experience).  For those who are lacking in that experience, let’s break it down a little:

Import:

In this section we will use the object oriented programming capabilities of Java to import the right routines and widgets for use in our app.  You will need to add the following lines to the import section of your app:

import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import java.util.Date;

The next area starts the main routine that is run as soon as the app is launched:

public class myTime extends Activity
implements View.OnClickListener{
Button btn;
TextView txtv;

The public class line already exists from creating the file.  You need to add the implements for the button event and the two variables, btn and txtv, which connect to the button and textview created in the xml document (see the video below).

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

btn=(Button)this.findViewById(R.id.timebutton);
txtv =(TextView)this.findViewById(R.id.time);
btn.setOnClickListener(this);
updateTime();

}

In this section we connect the btn and txtv variables to the Button and TextView  that was created in the xml file.  Then the btn variable is associated with a listener so that when it is pressed and event will occur.

Finally, the updateTime routine is called so that the current date and time is displayed on the application launch.

public void onClick(View view) {
updateTime();
}
private void updateTime() {
txtv.setText(new Date().toString());
}
}

The onClick view routine is called when the onClickListener is activated when someone presses the button.  When the button is pressed it then calls the next routine, updateTime.

The final routine, updateTime takes the current system date and time, converts it to a string and sets it to the text of our variable txtv, which is also the TextView that was created in the XML file.

The final program should look like this:

package com.burtonsmediagroup.datentime;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import java.util.Date;

public class myTime extends Activity
implements View.OnClickListener{
Button btn;
TextView txtv;

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

btn=(Button)this.findViewById(R.id.timebutton);
txtv =(TextView)this.findViewById(R.id.time);
btn.setOnClickListener(this);
updateTime();
}

public void onClick(View view) {
updateTime();
}
private void updateTime() {
txtv.setText(new Date().toString());
}
}


Demonstration:


Recent Posts