This is the first tutorial showing how to make a simple form in android.Lets look at here,what are the basic steps to create a form.While this application is silly one and you can do much bigger than this.So lets start with it.
STEP BY STEP
1.MODIFYING THE LAYOUT
Normally the android main.xml file will looks like in the bellow.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
/>
</LinearLayout>
The Graphical Layout of the above code will be the same in the result of Hello World Program.
Change the layout by drag and drop EditText and TextView.The step by step operation is explained through the bellow figures.
The Graphical Layout is shown bellow.
The main.xml is taken from
HelloWorld--->res-->layout-->main.xml
- Then from the Form Widget,drag and drop a Text View of large into the layout.
- The Text View is of Large,Medium and small.
3.Repeat the step 1 & 2.
4.Then the Layout will be like in the figure bellow.
Here the graphical layout will show TextView and Button with default values such as Large and Button.
So we need to change according to our needs.So taking main.xml bu clicking the main.xml tab near to Graphical Layout.We will get the bellow 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:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="@+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="@+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<requestFocus />
</EditText>
<Button
android:id="@+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
So we need to customise according to our need.
- Changing the first Text View text by android:text="Name"
- Changing the second Text View text by android:text="Address".
- After that we change the button text by "Save"
After all the following steps the main.xml code will like in given bellow.
<?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/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name:"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="@+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="@+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<requestFocus />
</EditText>
<Button
android:id="@+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Save" />
</LinearLayout>
5.RUNNING THE APPLICATION
For running the above application,save the all settings.Then by right click in the android project folder in the project explorer.
Run as-->Android Application
If any new AVD Manager prompt appear.Then create a new AVD manager.
Refer creating AVD Manager
The result is shown bellow.
In this tutorial we have only the display of Graphical layout in our emulator in Eclipse.So in the coming tutorials we will continue to upgrade the knowledge.
" Please mention your comments and feedback "
2 comments:
Wow the designing is so simple
BOOKMARKED YOUR BLOG
Post a Comment