Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Photoshop design from px to dp

Tags:

android

I've got a final app design made i Photoshop where everything is measured in PX. Now I realize that Android apps are using DP for font-sizes and other things.

Is there any way I can convert PX to DP ?

like image 273
Dammark Avatar asked Dec 16 '10 12:12

Dammark


People also ask

How do you convert pixels to dp?

Pixel values can be converted to DP by dividing the pixel value by the screen pixel density.

Is PX and dp same?

The conversion of dp units to screen pixels is simple: px = dp * (dpi / 160). For example, on a 240 dpi screen, 1 dp equals 1.5 physical pixels. You should always use dp units when defining your application's UI, to ensure proper display of your UI on screens with different densities.

What is dp in Photoshop?

Density-independent Pixels - an abstract unit that is based on the physical density of the screen. These units are relative to a 160 dpi screen, so one dp is one pixel on a 160 dpi screen.


1 Answers

On a more practical note, you have a few choices in increasing work and fidelty:

  1. Have your resources scaled for 160 dots per inch, put them in your res/drawable directory, and let the OS scale them to look right on the device.

  2. Make two copies of your resources: one at 160 dots per inch in your res/drawable and one at 240 dots per inch in your res/drawable-hdpi directory. Let the OS scale for the exact device starting from a pretty close number.

  3. Decide that you don't want any scaling and have raw pixels, so put your assets in the res/drawable-nodpi directory. This means that at 320x480 (pixel) graphic might be 2 inches by 3 inches on one phone but only 1 1/3 inches by 2 inches on another screen.

  4. Specify the exact scaling strategy for your work, using the draw9patch tool. This can be very useful for keeping the corners of boxes from getting the "jaggies" from scaling and for making full screen graphics cope with different aspect ratios.

  5. Make separate graphics for every device you care about and fall back on scalable graphics for the rest. You will need to outrun zealots waving style guides trying to convince you not to do it this way.

Oh, and as a gotcha, specify sp for your fonts, instead of dp or pt. A 10 point font would be a 22 sp font [ =10 * (160/72) or = number of points times 2.222]. sp units scale with user preferences for small, medium, or large fonts.

like image 87
Charles Merriam Avatar answered Oct 24 '22 19:10

Charles Merriam