4

I have created one Android application.

When I run my application in Mobile Phone it works very well, but when I run in Tablet the layout of application is changed.

So, how to make responsive Android application which is used in Mobile and also in Tablet?

Sagar Zala
  • 4,854
  • 9
  • 34
  • 62
  • if you are concerned about graphics in your application, take a look on "9Patch" here http://developer.android.com/tools/help/draw9patch.html – AddyProg Feb 08 '14 at 05:00

4 Answers4

10

On Android we can use screen size selector, introduced from Android 3.2, to define which layout to use. More details available at http://android-developers.blogspot.in/2011/07/new-tools-for-managing-screen-sizes.html. Following code snippet has been extracted from the same link :

public class MyActivity extends Activity 
{
    @Override protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate();
        Configuration config = getResources().getConfiguration();
        if (config.smallestScreenWidthDp >= 600) 
        {
            setContentView(R.layout.main_activity_tablet);
        } 
        else 
        {
            setContentView(R.layout.main_activity);
        }
    }
}

Another good reference for size configuration is keeping separator. This is explain in details at : http://www.vanteon.com/downloads/Scaling_Android_Apps_White_Paper.pdf

Harshal Doshi Jain
  • 2,567
  • 1
  • 20
  • 16
5

I am only talkin about Mobile Responsive Design. With layouts, I believe you can only current differentiate by the following:

res/layout/my_layout.xml            // layout for normal screen size
res/layout-small/my_layout.xml      // layout for small screen size
res/layout-large/my_layout.xml      // layout for large screen size
res/layout-large-land/my_layout.xml // layout for large screen size in landscape mode

You can find more info on what you can add to the folder structure to differentiate between different settings Documentation and android-developers.blogspot

In order to accommodate other types of tablets and screen sizes android introduces a new way to specify resources for more discrete screen sizes. The new technique is based on the amount of space your layout needs (such as 600dp of width), rather than trying to make your layout fit the generalized size groups (such as large or xlarge).

Update: There are essentially two ways you can give your audience a good experience utilizing responsive design:

  1. Optimize the layout of your content.

  2. Adapt the content that’s shown.

Update2: Write this code in your activity 

@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);

if (getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) {
    setContentView(R.layout.landscapeView);

} else {
    setContentView(R.layout.portraitView);
}

And also add this line in your Manifest file

android:configChanges="orientation|keyboardHidden|screenSize"

So this will handle both things, it will not restart your activity and will load the layout as per your orientation changes. For more information go to http://www.codeproject.com/Articles/422431/Handling-screen-layout-changes-in-Android

M D
  • 47,665
  • 9
  • 93
  • 114
  • Is there any possibility to make design which compatible to mobile and tablet both using single layout? – Sagar Zala Feb 08 '14 at 04:52
  • @SagarZala No it's not possible. In order to accommodate other types of tablets and screen sizes android introduces a new way to specify resources for more discrete screen sizes. The new technique is based on the amount of space your layout needs (such as 600dp of width), rather than trying to make your layout fit the generalized size groups (such as large or xlarge). – M D Feb 08 '14 at 04:54
  • @M D. Ok sir but how to manage these layout? Do you have any example ? Please give me. – Sagar Zala Feb 08 '14 at 04:58
  • @SagarZala go to this [link](http://android-er.blogspot.in/2013/04/create-layout-folder-for-tablet.html) or read official [docs](http://developer.android.com/guide/practices/screens_support.html#DeclaringTabletLayouts). you get all the idea. – M D Feb 08 '14 at 05:02
  • Only using layout file you can not achieve responsive application. when you start to develop you have to think of using multiple fragment for tablet or large screen. – java seeker Feb 08 '14 at 05:09
  • again there does not have a shortcut way for resposive applicaiton. – java seeker Feb 08 '14 at 05:12
  • @javaseeker. How make it possible. Do you have any simple example? Please give me link. – Sagar Zala Feb 08 '14 at 05:20
  • Thanks. It is working for me. But how to change `setContentView(R.layout.xxxx);` during execution? – Sagar Zala Feb 08 '14 at 06:25
  • @SagarZala Why r u doing this Manually? it'll automatically pick up particular layout – M D Feb 08 '14 at 06:47
  • @MD when i run application in portrait mode and the tablet's orientation is changed to landscape mode then error occurs. – Sagar Zala Feb 08 '14 at 07:00
1

@Sagar Zala

Try to use constraint layout as parent view for your layout which will help to make your application responsive for phone and device.

Constraint Layout

Hemal Patel
  • 114
  • 1
  • 11
0

You have to create layout for different screen sizes as creating a single design layout and hoping that it would work and look good on all screen size is next to impossible

As defined in android docs for supporting multiple screen sizes we need to focus on using 3 things.

  1. using more Constraint Layout as it provide us with using more relative styling as compared to other layout component
  2. Create alternate layout using qualifiers in android studio
  3. use bitmaps or svg component that could stretch without being blurred.

ConstraintLayout It supports things like percentage values,now combine those with guidelines it becomes a powerful tool for designing layout

Alternate Layout In the layout design tab of android studio click orientation change icon then select create other... options from the dropdown list . Now you need to select qualifier from the provided list and create layout relative to different screen sizes without the need of extra code to write for showing those layout. Those layout would appear when a provided qualifier layout design matches.

You could follow the link provided above to see how they used smallest width qualifier with values

320dp: a typical phone screen (240x320 ldpi, 320x480 mdpi, 480x800 hdpi, etc).
480dp: a large phone screen ~5" (480x800 mdpi).
600dp: a 7” tablet (600x1024 mdpi).
720dp: a 10” tablet (720x1280 mdpi, 800x1280 mdpi, etc).

These are the commonly used custom values that covers nearly all device sizes, you could add more refined sizes according to your need and then you could also add different orientation qualifiers too with addition to smallest width qualifiers.

Combination of all those would make your application completely responsive

I know i am answering to an old question but may be my answers helps other in search of similar query with a recent available solution.

Haris Umaid
  • 106
  • 1
  • 8