Android Layout alignment messed up in Landscape

Question

This is my first coding in Android. I have a device with 5" screen and 854*480 resolution . The following code looks perfect on portrait but everything moved left on landscape mode(it looks really bad). I have used dp units as it is recommended but still it is not aligning correctly. What am I doing wrong?

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ScrollView01"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<RelativeLayout
 android:id="@+id/RelativeLayout01"
 android:layout_width="match_parent"
 android:layout_height="753dp"
 android:background="@color/orange" >

 <TextView
     android:id="@+id/textView2"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="120dp"
     android:text="HS6151"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView3"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="165dp"
     android:text="PH6151"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView4"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="210dp"
     android:text="CY6151"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView5"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="255dp"
     android:text="GE6151"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView6"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="300dp"
     android:text="GE6152"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView7"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="345dp"
     android:text="GE6161"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView8"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="390dp"
     android:text="GE6162"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <TextView
     android:id="@+id/textView9"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="435dp"
     android:text="GE6163"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="65dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner2"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="110dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner3"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="155dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner4"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="200dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner5"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="245dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner6"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="290dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner7"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="335dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner8"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="380dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <spinner
     android:id="@+id/spinner9"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="200dp"
     android:layout_marginTop="425dp"
     android:entries="@array/Grade"
     android:prompt="@string/hello_world"
     android:text="Medium Text"
     android:textAppearance="?android:attr/textAppearanceMedium" />

 <Button
     android:id="@+id/button1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_below="@+id/spinner9"
     android:layout_centerHorizontal="true"
     android:layout_marginTop="19dp"
     android:text="calculate" />

 <space
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentTop="true"
     android:layout_centerHorizontal="true"
     android:layout_marginTop="55dp" />

 <TextView
     android:id="@+id/textView11"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_centerHorizontal="true"
     android:layout_marginTop="30dp"
     android:gravity="center"
     android:text="SEMESTER I - GPA CALCULATOR"
     android:textAppearance="?android:attr/textAppearanceMedium"
     android:textSize="20dp" />

 <TextView
     android:id="@+id/editText1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_below="@+id/button1"
     android:layout_centerHorizontal="true"
     android:layout_marginTop="1dp"
     android:editable="false"
     android:ems="10"
     android:gravity="center"
     android:inputType="number"
     android:textSize="20dp" />

 <TextView
     android:id="@+id/textView1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignParentLeft="true"
     android:layout_alignParentTop="true"
     android:layout_marginLeft="90dp"
     android:layout_marginTop="75dp"
     android:text="MA6151"
     android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

</ScrollView>

@ArtooDetoo Thanks for your reply. So you mean I should have separate layout for Portrait and Landscape? and how to format it for different devices? — Naveen S, Mar 09 '14 at 11:42

score 0 · Accepted Answer · answered Mar 09 '14 at 11:41

1. Using a fixed height for your container isn't a good idea: android:layout_height="753dp" because in landscape, your height won't be 854, but 480.
As an alternative, you can use two same-named xml layouts in res/layout-port and res/layout-land, with specific designs.

2. Most of your controls are aligned to the left by design, in portrait mode.
So, they will be left aligned also in landscape, if you don't provide an alternative layout file as described above.

Android Layout alignment messed up in Landscape

1 Answers1