CODEWITHSUNDEEP
android
menu_on_top
menu_on_top

Reputation: 2613

Graphic dimensions for hdpi/ldpi/mdpi

I have a button graphic with dimensions 300*90.How must be the dimensions for hdpi/mdpi/ldpi?Thanks

Upvotes: 24

Views: 23890

Answers (4)

Andrejs Cainikovs
Andrejs Cainikovs

Reputation: 28454

Google suggests using

3 : 4 : 6 : 8 : 12 : 16 scaling ratios for

ldpi : mdpi : hdpi : xhdpi : xxhdpi : xxxhdpi accordingly. Example:

  • 36x36 for low-density
  • 48x48 for medium-density
  • 72x72 for high-density
  • 96x96 for extra high-density
  • 144x144 for extra-extra-high-density
  • 192x192 for extra-extra-extra-high-density

In your example, if mentioned button sizes are for hdpi, correct dimensions should be:

  • 150x45 ldpi
  • 200x60 mdpi
  • 300x90 hdpi
  • 400x120 xhdpi
  • 600x180 xxhdpi
  • 800x240 xxxhdpi

Upvotes: 62

Patrick
Patrick

Reputation: 35234

For this, you could try out my tool which was made for scaling images (single or batch) of different types (png, jpg, gif, svg, psd, 9-patch..). Uses hiqh quality scaling algorithms and supports certain lossless compression tools like pngcrush. There is a GUI and command line ui.

https://github.com/patrickfav/density-converter

screenshot

Upvotes: 0

AZ_
AZ_

Reputation: 21899

Complete Formula to create all asset folder images

First you have to decide for which DPI you are creating Images for, once you have decided and created images then use the following code accordance with Google Guide Lines

public class DPICalculator {

    private final float LDPI = 120;
    private final float MDPI = 160;
    private final float HDPI = 240;
    private final float XHDPI = 320;

    private final float BASE_DPI = MDPI;

    public static void main(String[] args) {
        DPICalculator cal = new DPICalculator();

        cal.calculateDPI_baseUnitPixel(300, 90, cal.HDPI);
    }

    private float densityWidth;
    private float densityHeight;

    public void calculateDPI_baseUnitPixel(float width, float height, float currentDensity) {

        densityWidth = getDensityPX(width, currentDensity);
        densityHeight = getDensityPX(height, currentDensity);

        this.calculateAllDP();
    }

    private float getDensityPX(float value, float currentDensity) {
        return (value / (currentDensity / BASE_DPI));
    }

    public void calculateDPI_baseUnitDPI(float width, float height, float currentDensity) {

        densityWidth = getDensityDPI(width, currentDensity);
        densityHeight = getDensityDPI(height, currentDensity);

        this.calculateAllDP();
    }

    private float getDensityDPI(float value, float currentDensity) {
        return (value * (currentDensity / BASE_DPI));
    }

    private void calculateAllDP() {
        // get all settings.
        float low_pw = densityWidth * (LDPI / BASE_DPI);
        float low_ph = densityHeight * (LDPI / BASE_DPI);

        float med_pw = densityWidth * (MDPI / BASE_DPI);
        float med_ph = densityHeight * (MDPI / BASE_DPI);

        float high_pw = densityWidth * (HDPI / BASE_DPI);
        float high_ph = densityHeight * (HDPI / BASE_DPI);

        float xhigh_pw = densityWidth * (XHDPI / BASE_DPI);
        float xhigh_ph = densityHeight * (XHDPI / BASE_DPI);

        System.out.println("LDPI " + low_pw + " x " + low_ph);
        System.out.println("MDPI " + med_pw + " x " + med_ph);
        System.out.println("HDPI " + high_pw + " x " + high_ph);
        System.out.println("XHDPI " + xhigh_pw + " x " + xhigh_ph);

    }
}

Result

LDPI 150.0 x 45.0
MDPI 200.0 x 60.0
HDPI 300.0 x 90.0
XHDPI 400.0 x 120.0

Upvotes: 1

devunwired
devunwired

Reputation: 63293

It depends on what size device screen you designed that graphic against. If you want it to display as 300x90 on an 320x480 (HVGA) canvas, then your pixel dimensions are correct for MDPI devices, and you would need the following images:

  • LDPI: 225x68px
  • MDPI: 300x90px
  • HDPI: 450x135px

LDPI is 75% of MDPI scaling, and HDPI is 150% of MDPI scaling. If you designed those graphic dimensions on a 480x800 (WVGA) canvas, for example, then your dimensions are already correct for HDPI, and you need to scale the other two down from there:

  • LDPI: 150x45px
  • MDPI: 200x60px
  • HDPI: 300x90px

Hope that Helps!

Upvotes: 5

Related Questions