Creating an Android Application by using XML Layout

Android provides two types of UI construction model i.e. programmatic UI layout and XML-based layout. In this article I am going to explain how to create an Android application in Android Emulator by using XML layout files.

Expand the Project in the Package Explorer à Expand res folder à Layout folder à Select main.xml.

· Here’s an XML layout file (main.xml) that is identical in behavior to the programmatically constructed file:

<?xml version="1.0" encoding="utf-8"?>

<TextView xmlns:android="http://schemas.android.com/apk/res/android" 

              android:id="@+id/textview01" 

              android:layout_width="wrap_content" 

              android:layout_height="wrap_content"

              android:textSize="30px"

              android:textStyle="bold"

              android:typeface="serif" 

              android:text="@string/hello"/>

The general structure of an Android XML layout file is a tree of XML elements, wherein each node is the name of a View class (this example, however, is just one View element). You can use the name of any class that extends View as an element in your XML layouts, including custom View classes you define in your own code. This structure makes it easy to quickly build up UIs, using a more simple structure and syntax than you would use in a programmatic layout. This model is inspired by the web development model, wherein you can separate the presentation of your application (its UI) from the application logic used to fetch and fill in data.

In the above example there is only one View Element (TextView) which has eight attributes.

· Inside the res/values/ folder open strings.xml, modify the strings.xml as shown below:

<?xml  version="1.0" encoding="utf-8"?>

<resources>

     <string name="hello">Welcome! This is my first Android Application</string>

     <string name="app_name">FirstAndroidApp</string>

</resources>

· Now open and modify your HelloAndroid class and use the XML layout. Edit the file as shown below:

package com.example.firstApp;
  

import android.app.Activity; 
import android.os.Bundle; 

public class HelloAndroid extends Activity { 
     /** Called when the activity is first created. */ 
     @Override 
     public void onCreate(Bundle savedInstanceState) { 
         super.onCreate(savedInstanceState); 
         setContentView(R.layout.main); 
    } 
}