So I create sets of assets for an Android UI - 320 x 400 & 480 x 800 both of these at 160 and 240 dpi...
After Drawing some of the assets as 9 patch a weird thing happened. The 9 patch graphics all 'came out' as 72 dpi but with different dimensions!
So my conclusion is that android asset creation works similiar to iPhone. Creatings assets to dimensions and ignore DPI (using 72 as a base - as this is what the 9 patch programme converted them too!) RIGHT?
Anyone else experimented with this?
Just think for a minute about what DPI is. Dots per Inch. For displays, it's actually Pixels per Inch, or PPI.
A 320 pixel wide image at 160 pixels per inch is 320 pixels wide. How many pixels wide is a 320 pixel image at 240 pixels? The PPI density only matters on the actual output device. Your display has a fixed number of pixels at a fixed physical size. The number of pixels that fit into 1 inch is its PPI density. The reason this is modifiable for graphics is for when the density can differ. Most commonly, this is for printing (which is where the dots come in). Most printers can print at a variety of resolutions. The typical is something like 300 dpi for images, 1200 dpi or higher for vector graphics and line art. When you set the dpi before printing an image, it tells the printer how many dots per inch it should lay out. The higher the dpi, the sharper the image -- assuming the input image is actually large enough to accomodate this resolution.
Related
This question already has answers here:
Why Nexus 6 density is 560 dpi?
(3 answers)
Closed 7 years ago.
Though I read lot of resources, I am still confused with ppi and dpi. I read value of ppi and dpi of Nexus 6 is 493 and 560 respectively. How it is calculated?
And also what will be the preferred image (full screen) size for Nexus 6 splash screen?
In very simple words:
DPI: Dots per inch, That’s how many droplets of liquid squeeze into an inch of your printed paper.
PPI: Pixels per inch, That’s how many points of light live on an inch of screen.
But it technical terms:
DPI or Dots Per Inch is a measure of spatial dot density initially used in print. It's the number of ink drops your printer can put in an
inch . A smaller DPI yields a less-detailed image.
This concept is applied to computer screens under the name PPI for
Pixels Per Inch. Same principle: It counts the number of pixels your
screen can display per inch. The name DPI is also used in screens.
Windows computers have a default PPI of 96. Mac uses 72, although this value hasn't been accurate since the 80's.
Regular, non-retina desktops (mac included) will have a PPI of 72 minimum up to around 120 maximum. Designing with a PPI between 72 and 120 ensures your work is going to be roughly the same size ratio everywhere.
Here’s an applied example:
A Mac Cinema Display 27” has a PPI of 109, which means that it displays 109 pixels per inch of screen. The width with bevel is 25.7 inches (65cm). The width of the actual screen is approximately 23.5 inches so 23.5*109~2560, which makes the native screen resolution 2560x1440px.
*I know that 23.5*109 does not equal exactly 2560. It’s actually 23.486238532 inches. It would be more precise with pixels per centimeters, but you get the idea.
For more detail over DPI vs PPI you can visit a very good blog naming guide to DPI by Sebastien Gabriel.
And as per my understanding your looking for some conversion between PPI to DPI then please have a look over this and this.
Dear Android Developers,
as far as I know, Android has 4 different types of screen resolution :
LDPI << ignore this, because I won't build my app in this resolution
MDPI : 320 x 480
HDPI : 480 x 720
XHDPI : 640 x 960
now, Google Nexus 4 has screen resolution : 768 x 1280, which I assume this categorised as XHDPI model. *please correct me if I'm wrong.
now take a look at my picture...
so, if I put XHDPI size (red area) on top of Nexus 4 screen (grey area) you'll see what I see.
now, if I have 4 white boxes horizontally and 6 white boxes vertically on red area (PSD design). what it looks like on Nexus 4 screen resolution?
can we programatically add more boxes (blue boxes) to fill the empty space? or Android will automatically stretch that red area until covers all grey area? which means all of white boxes will be stretched too...
that's all I need to know... thanks.
You should watch Roman Nurik's Design Bytes: Density-Independent Pixels video.
First, stop thinking in pixels. Think of devices using density-independent pixels. The buckets that Android uses (ldpi, mdpi, etc.) are not measured in pixels; they are measured in dots-per-inch (DPI).
Those buckets are actually:
LDPI: 120 DPI
MDPI: 160 DPI
HDPI: 240 DPI
XHDPI: 320 DPI
The Nexus 4 has a DPI of precisely 320.
Screen size and Screen DPI are different things. Check https://developer.android.com/guide/practices/screens_support.html
How do I know how much DPIs a device has (and thus if it's ldpi / mdpi / hdpi / xhdpi, - and screen size, which is also measured in dp - xlarge / large / normal / small - according to http://developer.android.com/guide/practices/screens_support.html)?
I know the device's resolution and diagonal size, for example:
Display TFT LCD, 3.5 in (89 mm) diagonal.
320×480 px HVGA with Gorilla Glass
16M colors
(Taken from http://en.wikipedia.org/wiki/Samsung_Galaxy_Ace)
Don't need it programmatically, just to calculate myself.
Use DPI calculator to calculate dpis, and Figure 1 in the dev docs to determine whether its ldpi, mdpi, etc.
I think DPI reffers to printers... IN your case DPI = PPI. Please correct me if i'm wrong [edit: I'm wrong :P]
'So a 1200 dpi printer uses 1200 dots of ink in every inch to make up the colours. If you were printing a 300 PPI image, then every pixel would be made up of 16 smaller ink dots (1200 DPI x 1200 DPI / 300 PPI x 300 PPI). A lower DPI would have fewer ink dots making up each pixel, which would make the colour look worse. A higher DPI would have more ink dots for each pixel and should give more accurate colour (especially under close examination).'
If I have an image 240 by 240 pixels designed in Adobe Illustrator (for example) at 240 dots per inch for high density screens, what would be the best way to save a version of this image for medium density screens? Should I keep the image at 240 by 240 pixels and reduce the dots per inch to 160? Or keep the image at 240 dots per inch and shrink it to 160 by 160 pixels? Or some other variation?!
AFAIK DPI is ignored, it's only relevant for printing where it tells the printer how many pixels to print per inch, there is always exactly one screen pixel per bitmap pixel*, so as the other comment suggests, you just need to scale the image using the ratios 3:4:6:8.
*Essentially, anyway.
Starting android emulators with the same resolution of 480x800 at different DPIs (120, 160, 240), I would think that the screen with the highest DPI would have the smallest interface elements (images, buttons, etc) and the one with the lowest DPI would have the largest. But exactly the opposite is true. I've included a screen shot to demonstrate what I mean.
My emulator settings are:
HDPI:
Skin resolution: 480x800
Abstracted LCD Density: 240
MDPI:
Skin resolution: 480x800
Abstracted LCD Density: 160
LDPI:
Skin resolution: 480x800
Abstracted LCD Density: 120
I started each of the emulators with the following settings:
Scale display to real size
Screen size: 5 inches
Monitor dpi: 105
Scale: 0.56
Am I doing something wrong, or is this the expected result? If it is, why does it behave in this way? If I do the equivalent in Photoshop (view for print option), I get the exact opposite and correct results.
The problem turns out to be simple math. If we take the formula for calculating DPI as
dpi = sqrt(height^2 + width^2)/(screen size in inches)
it becomes apparent that you cannot choose all three components when running an emulator -- only two, and android will calculate the missing component.
From my original question above, I was specifying a constant resolution (480x800) and a constant screen size (5 inches). But 480x800 always produces a DPI of roughly 186 dpi. So forcing the DPI to be different in each of these cases confused the Android emulator, and I think it discarded my specified original resolution and calculated its own.
This is expected. Android increases the default font size in anticipation of this higher DPI. The goal is so that at a certain physical screen size (say 3") the font has the same physical size, no matter its resolution. Higher density displays have smaller pixels, so when setting the DPI setting higher Android needs use a bigger font to appear the same size relative the screen.