Android RelativeLayout

When you want to place widgets in different area on the screen, RelativeLayout is useful to you. For example, with the RelativeLayout, you can place buttons at the top, left, center, and right areas of the screen. There are a lot of layout attributes that can be used to tell Android to place a widget at any position that you want. For example, android:layout_alignParentTop="true", android:layout_alignParentBottom="true", android:layout_alignParentLeft="true", android:layout_alignParentRight="true" tell Android to place a widget at the top, at the bottom, on the left, and on the right of the screen respectively.

Now to have an example application that uses the RelativeLayout to align buttons in different areas of the Screen, create a new Android project. Then edit the activity_main.xml file to add seven buttons as shown below. The button1 and button2 are place at the top of the screen. The button3, button4, and button5 are placed on the left, center, and right of the screen. The button6 and button7 are placed at the bottom of the screen.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:paddingBottom="@dimen/activity_vertical_margin"
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   tools:context=".MainActivity" >

   <Button
     android:id="@+id/bt_topbutton1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button1"
     android:layout_alignParentTop="true"
      />
   <Button
     android:id="@+id/bt_topbutton2"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button2"
     android:layout_alignParentTop="true"
     android:layout_toRightOf="@+id/bt_topbutton1"
      />

   <Button
     android:id="@+id/bt_leftbutton"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button3"
     android:layout_alignParentLeft="true"
     android:layout_centerVertical="true"
      />
   <Button
     android:id="@+id/bt_centerbutton"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button4"
     android:layout_centerHorizontal="true"
     android:layout_centerVertical="true"
    
      />
   <Button
     android:id="@+id/bt_rightbutton"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button5"
     android:layout_alignParentRight="true"
     android:layout_centerVertical="true"
    
      />
  
   <Button
     android:id="@+id/bt_bottombutton1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button6"
     android:layout_alignParentBottom="true"
      />
   <Button
     android:id="@+id/bt_bottombutton2"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="button7"
     android:layout_alignParentBottom="true"
     android:layout_toRightOf="@+id/bt_bottombutton1"
      />
</RelativeLayout>


After running the example application, you will get the output as shown in the picture below.

Android-ReativeLayout

Posted by: Dara | post date: 08-13-2014 | Subject: Android Apps Development

write programming tip



This website intents to provide free and high quality tutorials, examples, exercises and solutions, questions and answers of programming and scripting languages:
C, C++, C#, Java, VB.NET, Python, VBA,PHP & Mysql, SQL, JSP, ASP.NET,HTML, CSS, JQuery, JavaScript and other applications such as MS Excel, MS Access, and MS Word. However, we don't guarantee all things of the web are accurate. If you find any error, please report it then we will take actions to correct it as soon as possible.