Home > Uncategorized > Building an android application

Building an android application

January 10th, 2011 Leave a comment Go to comments

In this post and series of post, we will talk about how you can start creating your android app in eclipse. In last we had explained setting up your development environment Getting started with android development where you had setup up android SDK , JDK and eclipse and created your first test app.

In this post, we will explain how to build a UI with android.

Good UI (user interface) is very essential for the success of any application in this competitive market. UI acts as a bridge between the user and the device. It provides all components required for communication with the device.

In case of android following components are required to build visual user interface:

1)   Activity

2)   View (widgets)

3)   View Group (layout )

Activity

Every thing that you see on the android screen is an Activity e.g. Inbox messages that you see in the messaging application, your contact list, graphics – games all are activities.  An activity is used to create a window to place your UI elements like buttons, text box etc. You can create an activity just by implementing the Activity base class as shown below.

public class MyClass extends Activity{

//extend the base class Activity and implement the onCreate method

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

}

}

View

View class is the base class for Widgets.

Widgets are fully implemented UI objects like buttons, text fields etc. By implementing View class we can create our own UI objects.

View Group

View Group is a collection of different views and other view groups as shown in the figure. Layouts define the arrangement of different views in view group e.g. Linear layout will arrange all the views (ex buttons) in a single column or row

Now in the first part we will see how to use the default view and view groups provided by Android. In the second part we will learn how to create our own view and view group.

Android Widget Toolkit

Different Views provided by android toolkit are:

1)   TextView

2)   EditText

3)   ListView

4)   Spinner

5)   Button

6)   CheckBox

7)   RadioButton

8)   WebView

Different Layouts provided by android toolkit are:

1)   LinearLayout   : Adds each view(child) in a straight line either horizontally or vertically

2)   FrameLayout   : Adds each view(child) to the top left corner

3)   RelativeLayout         : Here position of each view is decided with respect to another view

4)   TableLayout              : Here all child views are arranged in the form of a table. No. of rows and columns of the          table can be explicitly defined.

5)   AbsoluteLayout       : Here position of each child is defined by the absolute co-ordinates.

We can create user interfaces either programmatically or by using XML.

Creating UI the XML way

1)   In eclipse create a new project and right click on the folder res/layout

2)  Select New-> Android XML

3)  Type the name of the XML file and click finish

1)   Open the newly created XML file.

Now you can start creating your layout either by writing the XML code or by just adding layouts and views provided by android tool kit.

Let’s go the activity which we created in the introduction part. Now that we have created so many layouts, which layout is going to get displayed when we run the program.  Out of so many layouts you can select the layout to be displayed by using the function “setContentView(R.layout.myview);” my view is the name of the xml file to be displayed.

public class MyClass extends Activity{

//extend the base class Activity and implement the onCreate method

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.myview);

}

}

Writing XML code for Layouts

Linear Layout:

Absolute Layout:

Scroll View

Table Layout

Defining Layout Programmatically

We can create a Layout Programmatically by creating view objects in the  activity class.

public class MyClass extends Activity{

//extend the base class Activity and implement the onCreate method

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

//setContentView(R.layout.myview);

}

}

1)   Do not use the method “setContentView(R.layout.myview);”

2)   After commenting out setContentView , create objects of the view by passing the context value.

Eg.  TextView  tv=new TextView(this);

Button but=new Button(this);

Here “this ”  represents the current context.

3)   In the similar fashion you can create the Layouts too.

Eg.  LinearLayout li=new LinearLayout(this);

FrameLayout  fm = new FrameLayout(this);

4)   Now add the child view to the layout as

li.addView(but);

li.addView(tv);

5)    You can also change the properties of the view and Layout as

li.setOrientation(LinearLayout.VERTICAL);

li.setGravity(Gravity.CENTER);

6)   Finally pass this layout to the activity by calling the method

“setContentView(li);” and pass the reference of the root layout, which is li in our case.

Some of the Screen shots from google developers site can give you a better picture.

LINEAR LAYOUT

RELATIVE LAYOUT

TABLE LAYOUT

GRID VIEW

TAB LAYOUT

LIST VIEW

MAP VIEW

WEB VIEW

DATE PICKER

Categories: Uncategorized Tags:
  1. July 17th, 2013 at 04:51 | #1

    Hello i am kavin, its my first time to commenting anyplace, when i read this article i thought i could
    also make comment due to this sensible piece of writing.

  1. January 10th, 2011 at 13:00 | #1
  2. January 10th, 2011 at 17:57 | #2
  3. March 27th, 2011 at 19:00 | #3
  4. May 4th, 2011 at 12:48 | #4
  5. May 30th, 2011 at 00:53 | #5
  6. June 15th, 2011 at 06:47 | #6
  7. October 26th, 2011 at 07:08 | #7
  8. August 22nd, 2013 at 10:04 | #8