Android Drawables for Multiple Screens

Android runs on an assortment of devices that offer different screen sizes and densities. For applications, Android system provides a consistent development environment across devices and handles most of the work to adjust each application’s user interface to the screen on which it is displayed.

Range of supported Screens:

Android provides support for multiple screen sizes and densities, reflecting the many different screen configurations that a device may have. One can use features of the Android system to optimise the application’s user interface for each screen configuration and ensure that the application not only renders properly, but provides the best user experience possible on each screen.

A set of six generalised densities:

  • ldpi (low) ~120dpi
  • mdpi (medium) ~160dpi
  • hdpi (high) ~240dpi
  • xhdpi (extra-high) ~320dpi
  • xxhdpi (extra-extra-high) ~480dpi
  • xxxhdpi (extra-extra-extra-high) ~640dpi


  Low Density(120), ldpi Medium Density(160), mdpi High Density(240), hdpi Extra-High Density(320), xhdpi
Small Screen QVGA (240×320)   480×640  
Normal Screen WQVGA400 (240×400)

WQVGA432 (240×432)

HVGA (320×480) WVGA800 (480×800)

WVGA854 (480×854)


Large Screen WVGA800 (480×800)

WVGA854 (480×854)

WVGA800 (480×800)

WVGA854 (480×854)


Extra-Large Screen 1024×600 WXGA (1280×800)










Formula for pixel

dp→ Density Independent Pixel

dpi→ Dots per Inch

px→ Pixels

ppi→ Pixel per Inch

Step 1: Create a New Project with Android Studio.

Name the application to {anything of your choice} & then click Next. I have currently named it multiresasset.

Step 2:  Configure your App

Select the API Version (I took it as 15) as per your Target Audience. Under Phone and Tablet select the API and the click Next.

        Select Empty Activity and then click Next.

Keep the Activity name as MainActivity (or any name of your choice) and click Finish.

MainActivity is the Default name



Step 3: Code Setup

In the Android Explorer Dropdown select res–>layout and then activity_main.xml

Under activity_main.xml change the layout to Relative Layout and then write the following code:

If you want to run the same image in Landscape mode, right click on layout under the res folder. Select New and then click on Layout resource file.

After making a new Layout Resource file, keep the following values for the New Resource File.

After clicking on Orientation click on the >> arrows so that you can choose the Screen Orientation type.

It will look something like the above image.

Step 4: Add Repository

In the Menu Bar click on File, and then click on Settings

Once the Settings tab is open, click on Plugins and then click on Browse Repositories.

Search for the repository called Android Drawable Importer and install the same. After installation Restart Android Studio.

Under the Android Explorer Dropdown.

          1) Right click on Res Folder–> New–> Multusource-Drawable

          2) Select the Image(for the formats you need i.e LDPI, MDPI, HDPI, XHDPI, XXHDPI, XXXHDPI and TVDPI) keep the Resource name as the name you want in the Drawables folder and click OK.

Double click on the java folder–> Package Name and then on MainActivity.

Under MainActivity write the following after setContentView(R.layout.activity_main);

ImageView myimage = (ImageView)findViewById(;
 PhotoViewAttacher photoView = new PhotoViewAttacher(myimage); //for the Zoom Feature

Step 5:  Project Settings

Under the Gradle Scripts, click on build.gradle(Project:multiresasset) import the following maven:

maven {url ""}

The above line should be written after the following:

allprojects {
 repositories {
 //paste the maven line here

Click on build.gradle(Module:app) and add the following library under the dependencies

//Add Library
 compile 'com.github.chrisbanes:PhotoView:1.2.6'

Step 6:  Sync Gradle

To test the code you can take the same image and test it on different devices.

Also, to check you can delete the previous LDPI, MDPI, HDPI, XHDPI formats. Then load a picture which is less clear and compare it with the XXHDPI and XXXHDPI image.(This step has particularly been done to show the difference that the image is picked by the application with respect to the Screen Resolution)

The picture will adjust according to the Resolution of the Screen(ppi density).

I have tested the code on the following devices:

  • Xiaomi Redmi Note 4 (∽401 ppi)
  • Xiaomi Mi A1 (∽403 ppi)
  • Asus Zenpad 8 (∽189 ppi)
  • Samsung J1 (∽245 ppi)


(Landscape Mode)



(Distorted image on Tablet in accordance to the Screen resolution)

Leave a Reply

Your email address will not be published. Required fields are marked *