Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android UI Design: Supporting Multiple Screens

Tags:

I have read this tutorial SUPPORTING MULTIPLE SCREENS several times and many stackoverflow questions regarding Design Android UIs to fit well with all android screen sizes.

But still struggling with providing the best and the same user experience for all screen sizes equally.

When I am designing the Interfaces always keeping the following diagram in mind.enter image description here

For the moment in my app it uses following folder structure under the res folder.

enter image description here

Also I have used dp and sp units in the xml layout files when defining the sizes.

Small screen sizes

When it comes to small screen sizes it perfectly refer to the UIs defined under layout-small and display without any issue.

Normal screen sizes

When I design layouts for normal screen sizes(layout folder), I used 3.5 inches android device and 3.7 inches emulator to test how UI looks like in normal screen size.

So my layouts look excellent in this size but Samsung Gallaxy S3 (4.8 inches) and S4 (5.0 inches) having slightly bigger screens and they still refer to the normal screen sized layouts. Therefore in Those bigger screens have a considerable space left from the bottom not using and UI doesn't look nice.

Also In the manifest file, I have defined the following,

<uses-sdk
    android:minSdkVersion="4"
    android:targetSdkVersion="17" />

<supports-screens 
    android:largeScreens="true" 
    android:normalScreens="true" 
    android:smallScreens="true" 
    android:anyDensity="true" />

I have no issue with the image density(drawable-hdpi/drawable-xhdpi/drawable-mdpi/drawable-ldpi)

(1). Wonder what I am missing or doing wrong to result like this specially in Bigger screens (4.8 inches) to refer normal layouts.

(2). Also If someone can explain best practices and the standard way of defining folder structure under the Res folder to fit well with all the screen sizes in android, would be grateful as this is so confusing. Thanks.

like image 451
JibW Avatar asked Jun 27 '13 13:06

JibW


People also ask

How can Android support multiple screens?

Multi-window mode enables multiple apps to share the same screen simultaneously. The system can display two apps side by side or one above the other (split-screen mode), one app in a small window overlaying other apps (picture-in-picture mode), or individual apps in separate movable, resizable windows (free-form mode).

How can you design an application with multiple screens in Android?

STEP-1: Create new project and your project screen looks like given below. STEP-2: You will have xml and activity java file, path of both file given below. STEP-3: Open your xml file and add the Button because after clicking this button we will move to second activity as shown below. Add TextView for Message.

Does Android support second screen?

Not only can you use your Android device as a second monitor, but you can do the same with your Android TV. In this case, your Android TV and computer will have to be on the same Wi-Fi. You might also need an HDMI cable or you could use your Android TV as a second monitor wirelessly with Chromecast.


2 Answers

Instead of using the dp size unit you can use the sdp size unit that is relative to the screen size.

Using the sdp size unit you will have the same user experience on all screen sizes with only one layout xml.

Use it carefully! for example, in most cases you still need to design a different layout for tablets.

For text view sizes please refer to the ssp size unit (based on the sp size unit)

like image 130
Elhanan Mishraky Avatar answered Sep 18 '22 17:09

Elhanan Mishraky


You can use the following resource folders to create layouts for devices with larger screens :

7 inch tablets
res\layout-sw600dp

10 inch tablets
res\layout-sw720dp

like image 22
Plato Avatar answered Sep 20 '22 17:09

Plato