Pages

Monday, 11 August 2014

Relative Layout



Relative Layout is a view group that displays child views in relative positions. In this every elements arranges itself relative to other elements (such as to the left-of or below another view) or in positions relative to the parent Relative Layout area (such as aligned to the bottom, left of center).

Simple Program show the Relative Layout

Step 1: Create a new Project
              File->New->Android Application Project.

Step 2: In Package Explorer Right Click on res/layout folder under your project
              Go to New->Android XML file->relative_layout.xml (you can use any
                  name you wish).

Step 3: Open the newly created xml file(relative_layout.xml) and write the below
              code.

 relative_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginTop="74dp"
        android:ems="10"

        android:hint="Email Address"
        android:inputType="textWebEmailAddress" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/editText1"
        android:layout_marginTop="5dp"
        android:ems="10"

        android:hint="Password"
        android:inputType="textPassword" >
    </EditText>

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/editText2"
        android:layout_marginLeft="56dp"
        android:layout_marginTop="18dp"
        android:text="Submit" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/button1"
        android:layout_alignBottom="@+id/button1"
        android:layout_marginLeft="16dp"
        android:layout_toRightOf="@+id/button1"
        android:text="Cancel" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/button1"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="46dp"
        android:text="Register" />

</RelativeLayout>


 Step 4: To set this new xml view as the intial view of your app.
            Go to MainActivity.java you will see setContentView(R.layout.activity_main) inside onCreate(). Change R.layout.activity_main to R.layout.relative_layout.


MainActivity.java

package com.example.hello_world;

import android.app.Activity;

import android.os.Bundle;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.
relative_layout);
    }
}


Step 5: Now to run the code Right Click on project->Run As-> 1.Android Application. You should see the newly created linear layout in emulator.

No comments:

Post a Comment