Android How to - Resize and Reposition

• Back to Activity  ↑

An easier way to customize the UI based on screen orientation is to create a separate res/layout folder containing the XML files for the UI of each orientation.

To support landscape mode, you can create a new folder in the res folder and name it as layout-land (representing landscape).

The main.xml file contained within the layout folder defines the UI for the activity in portrait mode, whereas the main.xml file in the layout-land folder defines the UI in landscape mode.

Example

The following code shows the content of main.xml under the layout folder:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   xmlns:android="http://schemas.android.com/apk/res/android">
   <Button
       android:id="@+id/button1"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Top Left"
       android:layout_alignParentLeft="true"
       android:layout_alignParentTop="true" />
   <Button
       android:id="@+id/button2"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Top Right"
       android:layout_alignParentTop="true"
       android:layout_alignParentRight="true" />
   <Button
       android:id="@+id/button3"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Bottom Left"
       android:layout_alignParentLeft="true"
       android:layout_alignParentBottom="true" />
   <Button
       android:id="@+id/button4"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Bottom Right"
       android:layout_alignParentRight="true"
       android:layout_alignParentBottom="true" />
   <Button
       android:id="@+id/button5"
       android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:text="Middle"
          android:layout_centerVertical="true"
          android:layout_centerHorizontal="true" />
</RelativeLayout>

The following shows the content of main.xml under the layout-land folder:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Top Left"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" />
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Top Right"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true" />
    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Bottom Left"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true" />
    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Bottom Right"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true" />
    <Button
        android:id="@+id/button5"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Middle"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true" />
    <Button
        android:id="@+id/button6"
        android:layout_width="180px"
      android:layout_height="wrap_content"
      android:text="Top Middle"
      android:layout_centerVertical="true"
      android:layout_centerHorizontal="true"
      android:layout_alignParentTop="true" />
  <Button
      android:id="@+id/button7"
      android:layout_width="180px"
      android:layout_height="wrap_content"
      android:text="Bottom Middle"
      android:layout_centerVertical="true"
      android:layout_centerHorizontal="true"
      android:layout_alignParentBottom="true" />
</RelativeLayout>

When the orientation of the device changes, Android automatically loads the appropriate XML file for your activity depending on the current screen orientation.

• Back to Activity  ↑