Understanding Android Screen Densities and Terminology
This article provides an overview of Android screen densities and the various acronyms that occur when dealing with a device’s screen. Android’s popularity as a mobile device Operating System has resulted in a proliferation of hardware on the market. This has provided great choice for the consumer and forced continuous innovation from the manufacturers. In a few short years there has been rapid innovation in all areas: CPU capabilities, memory size, form factors, keypads, cameras, sensors, batteries, power consumption and screen technologies. The screens have been getting bigger, thinner, sharper, tougher and more responsive to touch. This has forced the Android SDK to move rapidly with the hardware technology (and the hardware to feed upon Android ideas). Explained here is how the variety of screen sizes are handled by the OS, finishing with a summary table of the acronyms covered.
What makes up an Android Screen
For those of you new to technology here’s how a device screen works. The screen is made of thousands of small dots called pixels arranged in a grid. The pixels running from left to right are known as the X pixels or X-axis. The pixels running from top to bottom are known as Y pixels or Y-axis. The resolution of the display is the number of pixels in X-axis multipled by the number of pixels in the Y-axis. A 320 by 480 display will have 320 pixels in the X-axis and 480 pixels in the Y-axis, this will also be stated simply as 320×480 (and in this case x is the multiplication, or times, sign and not the X-axis!).
To show an image on the display the color of the pixels are set by a program running on the device. Look at the article How Computer Screens and Printers Show Images for more details on how dots make up an image. Because the Android coordinate system runs left to right and top to bottom then plotting a line from 0,0 to 100,100 results in a line that slopes down from the top left of the screen, compared to one that slopes up from bottom left on a normal maths chart.
To get a idea of the variety of screens seen on Android devices look at the article Example List of Android Device Screen Resolutions and Sizes (which also shows that the various screen resolutions are given names).
What is Screen Density and How it is Calculated
Generally the more pixels that are squeezed into a screen the sharper any images shown on the screen will look. The higher the screen density (pixel density) the more pixels are in a given area of the display. Early phones had low density screens and individual pixels could be made out if you looked closely at the screen. Modern phones have high density screens with pixels not visible to the naked eye. A 320 by 480 pixel screen has a total of 153,600 pixels. The size of the pixels determines the size of the screen. All these pixels could fit into a 3.2″ screen (e.g. a HTC Wildfire S) or a 2.6″ screen (e.g. HTC ChaCha), if so then the smaller screen is denser because it has more pixels in a smaller space.
What is Screen Size
The size of a screen, for a smartphone, tablet, laptop, computer or television, is usually given as a single figure in inches (one inch is 2.54 centimetres). This figure is a measurement of the corner to corner diagonal of the visible area of the screen, usually rounded to one decimal place. Simply measure the diagonal to get the screen size. Although if you know the height and width of a screen you can calculate the screen size using the Pythagorean theorem, which gives the screen size as the square root of the height squared plus the width squared.
The screen density is quoted as Pixels Per Inch, PPI, and is the number of pixels that fit into an inch. The higher the number then the sharper images look on the display, therefore consumers consider a high PPI figure an advantage when buying a device. Sometimes the figure is quoted as Dots Per Inch, DPI, though the use of DPI is confusing as it comes from printing terminology, and it can refer to a the sensitivity of the sensors in digital scanners and digital cameras. For Android screens when it comes to PPI vs. DPI use PPI and leave DPI to refer to printers, where it is really a different measurement (because the dots needed to produce high quality images on paper are of greater density).
The PPI figure for a screen can be calculated given the resolution (number of x and y pixels) and size (diagonal measurement of the visible area) of a screen. Use the Pythagorean theorem to calculate the number of pixels in the diagonal then divide the result buy the screen size. i.e. PPI=(square root of x^2 + y^2)/screen size.
Example PPI Calculations
For example for a HTC Wildfire S with 3.2″ at 320×480. Square the x (320*320) to give 102,400. Square the height (480*480) to give 230,400. Add the two squares together giving 332,800. Talk the square root to give 576, to the nearest integer. Then divide by the screen size (576/3.2) to give the screen density as 180 PPI. For the HTC ChaCha which has the same resolution screen but a a smaller screen size, 2.6″, the figure is 221 PPI (i.e. 576/2.6). The HTC Wildfire S was an upgrade to the HTC Wildfire. The original HTC Wildfire had 3.2″ screen at a resolution of 240×320, therefore for the density is square root(240^2+320^2)/3.2 = 125 PPI.
A Wide Range of Screen Densities
As the technology behind displays has increased the PPI figures for new devices has increased. It was common for computers to use 72 or 96 PPI for displays, mobile devices run from around 100 PPI to over 300 PPI on the latest hi-resolution displays. Once over 300 PPI the human eye cannot see the individual pixels, hence Apple calling their high resolution screens “Retina Dsiplays” (iPhones have 326 PPI). Screens carry on getting denser, with the Galaxy S4 and HTC One having around 450 PPI, even though most software will never need to use that high a density.
Dealing with A Variety of Screen Densities
Android can handle the wide range of screen densities. It does so by classing a display as either low density, medium density, high density or extra high density (the DisplayMetrics class can be used in code to read the device density and screen size in pxels). The medium density setting is the reference point, at this point Android takes 160 PPI as the base line. If a device has a screen density around this figure (it does not need to be exactly 160 PPI, a 180 PPI screen could be medium density) a resource, such as a image file, is displayed at the original size, with no scaling. For lower and higher densities the image file may be scaled up or down so that it is displayed correctly on the screen.
When Android was first released the resources used in an Application (App) would be stored in a folder called drawable. To supported different screen densities four more folders were introduced: drawable-ldpi, drawable-mdpi, drawable-hdpi and drawable-xhdpi. These folders allow pre-scaled resources to be included in a App. This supports better quality interfaces because scaling a resource can introduce pixelation (images becoming ragged) or loss of detail. The scaling factors are 0.75 for low density, 1.5 for high density and 2 for extra high density. These factors mean that a low density screen is 120 PPI (0.75 * 160 PPI), high density screen is 240 PPI (1.5 * 160 PPI) and extra high density is 320 PPI (2 * 160 PPI). The original drawable folder is still supported for backwards compatibility and it should just mimic the contents of the drawable-mdpi. The abbreviations are:
- LDPI – Low Dots Per Inch
- MDPI – Medium Dots Per Inch
- HDPI – High Dots Per Inch
- XHDPI – Extra High Dots Per Inch
If you have an image for display in an App itf can be dropped into the MDPI folder (res/drawable-mdpi) on its own and it will be used on all screen densities, ideally produce the low (75%), high (150%) and extra high (200%) versions but taking the image and resizing it in a graphics application. Resize by a factor of 0.75 for low density, 1.5 for high density and 2 for extra high density.
Android Image Sizes in Code
When working with resources in code the sizes can be set in pixels using the abbreviation px. This would not be good for the App as it would not be independent of the device’s screen density. Instead refer to image sizes in terms of density pixels, dp. One dp is the same as one physical pixel on a device with a medium density display. For a low density display one dp is 0.75 of a physical pixel, for a high density display 1 dp is 1.5 the size of the pixel, and likewise 1 dp is twice the size of a pixel on a extra high density display. This is illustrated with the recommendations for the launcher icons for Apps:
- LPDI – 36 x 36 pixels (0.75 * MDPI size)
- MDPI – 48 x 48 pixels
- HDPI – 72 x 72 pixels (1.5 * MDPI size)
- XHDPI – 96 x 96 pixels (2 * MDPI size)
See the images on the page Android Graphic Resources for examples of the different size icons. With the advent of very large high density displays (and with one eye on the future use of Android on very large and very high density televisions) there is now support for a drawable-xxhdpi folder to support an Extra Extra High Density Dots Per Inch icon at 144 * 144 pixels, 3 * MDPI size (480 PPI)
(As well as px for pixels other absolute sizes include in for inches and mm for millimetres.)
Density Differences Code Example
Android Virtual Devices (AVDs) that come with the Android SDK support different screen densities so that Apps can be testing on the various resolutions they will encounter in the marketplace. In this example a fixed size image will be displayed next to an image that is drawn from one of the resource folders depending upon the density of the device screen. Start by creating a new Android project in Eclipse (for new programmers see Your First Android Hello World Java Program to see how). Here the project is called Density Test.
The image used for the different density drawable folders is the Home Icon found on the Android Graphic Resources page. Download the home_icon.zip file, which can be used to import the graphics into a project, see the Archive File Import section on the page Move Android Code Between PCs Running Eclipse.
The image for the fixed sized graphic is simply a 50 x 50 pixel box. Create one in a drawing program or use the context menu (usually right-click) on the image to the left, save it as pixels50x50.bmp (you can also use PNG files) into the Android project. In the res folder create a drawable-nodpi folder to hold it. (The res/drawable-nodpi folder signifies that images in that folder should be used independent of the devices screen density).
In the Android project two ImageViews are place next to each other in a an Activity’s layout. One for the 50 x 50 image, one for the Home Icon, as in this layout:
Here is a composite of the example running on the Low, Medium, High and Extra High density screens, notice how the icon from the various density folders gets bigger to compensate for increase in screen resolution, but the fixed sized bitmap appears to shrink, it in fact stays the same size but requires less screen space because more pixels fit into a given area:
Turning Off Android Screen Compatibility Mode
When support was introduced for larger high resolution displays Android needed a way to display old Apps, designed for small low resolution screens, correctly on the bigger display devices. To do this they introduced a Screen Compatibility Mode. This automatically assumed an old App, compiled against an old version of the SDK, is not designed for larger screens (unless told otherwise). The App is given a virtual 320×480 screen which is scaled up to the size of the larger screen. To support larger screens and prevent this lower resolution scaled screen (Screen Compatibility Mode) the larger screen support must be declared. This is done in the Apps manifest by inserting <supports-screens android:xlargeScreens=”true” /> in the manifest file (AndroidManifest.xml, as a child of the manifest root). Alternatively compile the old App against a newer API. If trying this example code and it does not appear to work (the unscaled bitmap is still being scaled), the App may be compiling against an older API. Either target a newer API or add the above supports-screens element. Remember to test an App’s layouts with the bigger screens.
Android Fonts Use Scaled Pixels
Whilst the density pixel, dp, setting is suitable for images and other screen elements there is another problem when using fonts. This is because device users can set a font size, to help them increase or decrease the default displayed text size appropriate to their needs. (They may have good or bad eyesight.)
The link between the users chosen text size and the text in your App is not dp (density pixel), or one of the other supported font measurements (pt for point, in for inches), but scaled pixels, sp. By setting the size of text in UI elements in terms of sp then Apps take into account the user’s text preferences. See the article Changing the Font for Android TextViews and EditTexts for more on changing App fonts.
There is a wide variety of screen types used in by Android devices. The Android OS has build in support to handle the wide range of screens. By writing Apps using the latest APIs and using the dp and sp measurements it is possible to support the variety of screen sizes and resolutions. The low density screens are no longer that important for future App development, as shown on the Android Developers Dashboards, however supporting layouts for mobile phones and tablet devices at medium density and higher ensures a wide market coverage.
|AVD||Android Virtual Device||A computer programme on a App developer’s machine that mimics a real Android device. AVDs allow developers to test on a wide range of devices without needing to physically own those devices.|
|DIP||Device Independant Pixel||Also knowns as “density independent pixel”. A virtual pixel that appears approximately the same size on a variety of screen densites.|
|DP||Density Pixel||See DIP above.|
|DPI||Dots Per Inch||For an image built of dots (pixels) how many of those dots fit into an inch (2.54 centimetres), the higher the DPI the denser the image and the better the perceived quality, for a given image resolution the higher the DPI the smaller the image. DPI is common in terminology for printers, use PPI, Pixels Per Inch, for screens.|
|GUI||Graphical User Interface||The screen of an Android device is composed of a variety of graphically drawn components control by the App and drawn by the OS.|
|in||Inch||A unit of measurement for Android screen UI items, 1 inch = 25.4mm.|
|mm||Millimeters||A unit of measurement for Android screen UI items, 25.4mm = 1 inch.|
|OS||Operating System||The software built into an Android device to control how it works and allow Apps to work with the sensors and screens.|
|PPI||Pixels Per Inch||For Android devices the same as DPI.|
|pt||point||An Android supported mesaurement size for text.|
|px||pixels||An Android supported mesaurement size for screen UI items.|
|SDK||Software Development Kit||Programming tools and code libraries to help develops write software for a platform. A SDK is available for Android.|
|sp||Scaled Pixels||An Android supported mesaurement size for text.|
|UI||User Interface||See GUI.|