dcsimg
December 2, 2016
Hot Topics:

How to Expand App Reach by Supporting Multiple Screen Sizes

  • February 3, 2016
  • By Vipul Patel
  • Send Email »
  • More Articles »

Introduction

Imagine you were the user of an application. You have just tried the application on your phone and love it and install it on another device like a tablet. The application works but the experience doesn't seem right. Sometimes, it feels that the app does not seem to provide the same rich experience that you enjoyed on the mobile phone. Ever been in those shoes?

As application developers, we need to account for the application running on various types of devices. As the Android platform matures, and more devices in various forms factors run Android, we need to make sure our application does not suffer the same fate as described above.

Android helps solve this problem by providing certain capabilities that the application needs to leverage:

  • Adjust the application's user interface to the screen it is displayed on
  • Use APIs that allow to control the UI for specific screen sizes and densities
  • As app developers, we need to build a user experience that allows the user to feel that the application was actually built for their devices.

Let's take a look at a few concepts that help us understand how best to leverage the Android platform capabilities.

Screen Sizes

This represents the actual screen size of the device, measured diagonally. There are four generalized sizes: small, normal, large, and xlarge.

Screen Density

This represents the quantity of pixels within a physical area of the screen. Android supports the following densities:

Density Referred to as DPI
Low ldpi 120dpi
Medium mdpi 160dpi
High hdpi 240dpi
Extra-high xhdpi 320dpi
Extra-extra-high xxhdpi 480dpi
Extra-extra-extra-high xxxhdpi 640dpi

Reach
Figure 1: Diagram showing mapping of screen size and screen density
Image credit: Google.com

Orientation

This represents the screen orientation from the user's point of view. It can be either landscape or portrait.

Resolution

This represents the total number of pixels on the screen.

How to Leverage Android Features to Support Multiple Screens

Android can provide "density independence" for applications in two possible ways:

  • Scale up density-independent pixel (dp) units to support current screen density
  • Scale drawable resources to the appropriate size

We do this by specifying all layout dimension values in dp units or with "wrap_content". This instructs the system to scale bitmap drawables appropriately. It is possible that this can result in pixelated bitmaps. To avoid this, we can use an alternate strategy of providing alternate bitmaps resources for different densities,.

The application also can declare in the application manifest which screen sizes are supported. This is done via the <supports-screens> element in the manifest.

There are two other strategies to support multiple screens:

  • Providing different layouts for different screen sizes:When a simple resizing of elements will not suffice to provide a great app experience, we can provide alternate layouts. These layout files need to be provided in the appropriate location with the right configuration qualifiers. For example, layout for small screen sizes should be in the /res/layout-small folder and layout files for large screen sizes should be in /res/layout-large folder.

    If you are using API level 13 or higher, this methodology is deprecated and we can  use the sw<N>dp configuration qualifier. For example, use the /res/layout-sw600dp/ folder instead of the /res/layout-xlarge/ folder.

  • Providing different bitmap drawables for different densities: Similar to the different layout files, we can also provide different drawables for different screen densities. For example, we can provide drawable bitmaps for high density in /res/drawable-hdpi, medium density bitmaps in /res/drawable-mdpi, and so forth.

Here is the algorithm that Android uses to provide the best possible display on the screen:

  • If alternate resources are provided, the system uses that.
  • If no alternate resources are provided, the system uses the default resources and scales them up/down, depending on the screen size and density.

Other Best Practices for Working with Multiple Screens

  • Use wrap_content, fill_parent, or dp units when specifying element dimensions
  • Avoid AbsoluteLayout
  • Avoid hard-coded pixel values in app code
  • Do not disable pre-scaling
  • Test application with multiple screens

Summary

In this article, we learned how to expand app reach by supporting multiple screens. I hope you have found this information useful.

About the Author

Vipul Patel is a technology geek based in Seattle. He can be reached at vipul.patel@hotmail.com. You can visit his LinkedIn profile at https://www.linkedin.com/pub/vipul-patel/6/675/508.


Tags: user interface, Android, screen, resolution, pixels, screen size, screen density




Comment and Contribute

 


(Maximum characters: 1200). You have characters left.

 

 


Enterprise Development Update

Don't miss an article. Subscribe to our newsletter below.

Sitemap | Contact Us

Thanks for your registration, follow us on our social networks to keep up-to-date
Rocket Fuel