Introduction

This article shows how to support Landscape and Portrait modes of a device in our applications.
Generally, when we run our application it is displayed in a portrait mode but after changing the layout into portrait mode it will change the display of an application. So this application will have the same display when you run it either in portrait mode or in landscape mode.
It is a very simple concept to support landscape mode or portrait mode in applications. For this, you will need to create a folder named "layout-land". In the layout-land folder, you will paste the same XML file present in your layout folder (activity_main.xml). So when we change the layout to landscape mode it will automatically take the XML file from the layout-land folder.
Step 1
Create an XML file inside the layout folder and write the following:
  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. tools:context=".MainActivity"
  6. android:orientation="horizontal">
  7. <LinearLayout
  8. android:layout_height="wrap_content"
  9. android:layout_width="wrap_content"
  10. android:orientation="vertical">
  11. <Button
  12. android:id="@+id/button1"
  13. android:layout_height="wrap_content"
  14. android:layout_width="wrap_content"
  15. android:text="@string/about"
  16. android:background="#ffffff">
  17. </Button>
  18. <Button
  19. android:id="@+id/button2"
  20. android:layout_height="wrap_content"
  21. android:layout_width="72dp"
  22. android:text="@string/help"
  23. android:background="#ffffff">
  24. </Button>
  25. </LinearLayout>
  26. <ImageView
  27. android:layout_height="352dp"
  28. android:layout_width="wrap_content"
  29. android:src="@drawable/socialnetwork"
  30. android:paddingLeft="20dp">
  31. </ImageView>
  32. </LinearLayout>
Step 2
Create the same XML file inside the layout-land folder and write the following:
  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. tools:context=".MainActivity"
  6. android:orientation="horizontal">
  7. <LinearLayout
  8. android:layout_height="wrap_content"
  9. android:layout_width="wrap_content"
  10. android:orientation="vertical">
  11. <Button
  12. android:layout_height="wrap_content"
  13. android:layout_width="wrap_content"
  14. android:text="@string/about"
  15. android:background="#ffffff">
  16. </Button>
  17. <Button
  18. android:layout_height="wrap_content"
  19. android:layout_width="72dp"
  20. android:text="@string/help"
  21. android:background="#ffffff">
  22. </Button>
  23. </LinearLayout>
  24. <ImageView
  25. android:layout_height="352dp"
  26. android:layout_width="wrap_content"
  27. android:src="@drawable/socialnetwork"
  28. android:paddingLeft="20dp">
  29. </ImageView>
  30. </LinearLayout>
Step 3
Create another XML file for another activity.
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:orientation="vertical"
  4. android:layout_width="match_parent"
  5. android:layout_height="match_parent">
  6. <TextView
  7. android:layout_height="wrap_content"
  8. android:layout_width="wrap_content"
  9. android:id="@+id/textview"
  10. android:textSize="50dp">
  11. </TextView>
  12. </LinearLayout>
Step 4
Create a Java file and write the following:
  1. package com.supportdifferentscreensizes;
  3. import android.content.Intent;
  4. import android.os.Bundle;
  5. import android.app.Activity;
  6. import android.view.Menu;
  7. import android.view.View;
  8. import android.widget.Button;
  10. public class MainActivity extends Activity
  11. {
  12. Button button1, button2;
  13. @Override
  14. public void onCreate(Bundle savedInstanceState)
  15. {
  16. super.onCreate(savedInstanceState);
  17. setContentView(R.layout.activity_main);
  18. button1 = (Button) findViewById(R.id.button1);
  19. button2 = (Button) findViewById(R.id.button2);
  20. button1.setText(R.string.about);
  21. button2.setText(R.string.help);
  23. button2.setOnClickListener(new View.OnClickListener()
  24. {
  25. @Override
  26. public void onClick(View view)
  27. {
  29. Intent i = new Intent(MainActivity.this, Second.class);
  30. Bundle b = new Bundle();
  31. String s = getResources().getString(R.string.help);
  32. b.putString("1", s);
  33. i.putExtras(b);
  34. startActivity(i);
  35. }
  36. });
  37. }
  38. @Override
  39. public boolean onCreateOptionsMenu(Menu menu)
  40. {
  41. // Inflate the menu; this adds items to the action bar if it is present.
  42. getMenuInflater().inflate(R.menu.main, menu);
  43. return true;
  44. }
  46. }
Step 4
Create another Java class file and write the following:
  1. package com.supportdifferentscreensizes;
  3. import android.app.Activity;
  4. import android.content.Intent;
  5. import android.os.Bundle;
  6. import android.widget.TextView;
  8. /**
  9. * Created by vivek on 8/26/13.
  10. */
  11. public class Second extends Activity
  12. {
  13. public void onCreate(Bundle savedInstanceState)
  14. {
  15. super.onCreate(savedInstanceState);
  16. setContentView(R.layout.second);
  18. TextView textview = (TextView) findViewById(R.id.textview);
  19. Intent i = getIntent();
  20. Bundle b = i.getExtras();
  21. String text = b.getString("1");
  22. textview.setText(text);
  24. }
  25. }
Step 5
Create a string.xml file inside the value-es (res\value-es) folder to support Spanish language as in the following:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <resources>
  3. <string name="app_name">SupportDifferentScreenSizes</string>
  4. <string name="action_settings">Settings</string>
  5. <string name="about">acerca de</string>
  6. <string name="help">ayudar</string>
  7. </resources>
Step 6
In the string.xml file inside the value (res\value) folder add support for language as in the following:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <resources>
  3. <string name="app_name">SupportDifferentScreenSizes</string>
  4. <string name="action_settings">Settings</string>
  5. <string name="about">About</string>
  6. <string name="help">Help</string>
  7. </resources>
Step 7
Change an Android Manifest.xml file as in the following:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <manifest xmlns:android="http://schemas.android.com/apk/res/android"
  3. package="com.supportdifferentscreensizes"
  4. android:versionCode="1"
  5. android:versionName="1.0" >
  6. <uses-sdk
  7. android:minSdkVersion="7"
  8. android:targetSdkVersion="16" />
  9. <application
  10. android:allowBackup="true"
  11. android:icon="@drawable/ic_launcher"
  12. android:label="@string/app_name"
  13. android:theme="@style/AppTheme" >
  14. <activity
  15. android:name="com.supportdifferentscreensizes.MainActivity"
  16. android:label="@string/app_name" >
  17. <intent-filter>
  18. <action android:name="android.intent.action.MAIN" />
  19. <category android:name="android.intent.category.LAUNCHER" />
  20. </intent-filter>
  21. </activity>
  22. <activity
  23. android:name=".Second">
  24. </activity>
  25. </application>
  26. </manifest>
Step 8
In portrait mode:
Clipboard02.jpg
In landscape mode:
Clipboard04.jpg