We Keep Coding

Android Studio - pixel sizes for different dpi

I've read the posts but I still do not understand how to convert my image to dpi.
I have a 2689x1900px image. I have created the drawable-hdpi, mdpi, xhdpi, xxhdpi and xxxhdpi folders.
I know that I need to insert the images there (same name) but I don't know to what pixel size do I need to convert. I'm using photoshop.
Can someone please explain the process of scaling and use my example (2689x1900) ?

Let's assume that 2689x1900 is your 100% image, the biggest one. The biggest density is xxxhdpi. So, xxxhdpi is a 100% density.
Next, we need to calculate the smaller sizes:
xxhdpi is 75% of xxxhdpi, so it is 0.75 * (2689x1900);
xhdpi is 50% of xxxhdpi, so it is 0.5 * (2689x1900);
hdpi is 37.5% of xxxhdpi, so it is 0.375 * (2689x1900);
mdpi is 25% of xxxhdpi, so it is 0.25 * (2689x1900)
You can find more on that topic in Supporting Multiple Screens.
Note though that your image size slightly differs from the mostly used xxxhdpi screen resolution, 2560x1920, and you may want to adjust the size before scaling so that the images will fit perfectly into different screen resolutions.

first of all, reducing the size of the image in photoshop can cause pixellations. i suggest you to use inkscape or any other vector graphics editor.
then for full screen image
mdpi - 1 (360x640)
hdpi - 1.5 (540×960)
xhdpi - 2 (720×1280)
xxhdpi - 3 (1080x1920)
xxxhdpi - 4 (1440×2560)
these are the ideal sizes of the image.
the integers represent the scaling factor. if you want to maintain the aspect ratio of the image, then select the nearest image folder and scale.it using this factor.
more details here https://developer.android.com/training/multiscreen/screendensities.html#TaskProvideAltBmp

Dimension values taken from wrong folder

I have made several values folder and dimen.xml files for configuring my app for different screen sizes. The preview in Android Studio shows them perfectly however, when I run the app on the phone, those dimensions don't take effect. And the layout shown in the Android Studio layout and the layout shown on the phone are different.
So for example on my nexus 5 the app should read dimensions from values-w640dp/dimen.xml however, it reads them from values/dimen.xml for some odd reason.
What can I do to resolve it?
Here are the screenshots.
Android Studio Preview Snapshot (Nexus 5)
Nexus 5 Phone Screenshot:

So dp are calculated using the following formula:
pixels / dp = dpi / 160dpi or pixels / dp = density
Looking at device metrics, the Nexus 5 has a density of 3 so:
dp = pixels / density
dp = 1920px / 3 = 640dp
dp = 1080px / 3 = 360dp
Using values-sw600dp would not fix it because that is not the actual smallest width of the screen since it can also be 360. So you should use values-sw300dp. Be warned though that this covers a very wide variety of devices. values-sw600dp usually targets tablets.
I have also run into issues where the true resolution of the device does not match what the emulator created, with the Nexus 5 too, so make sure you check the AVD screen and ensure that the resolution matches the real resolution of the device. Example, the Nexus 5 should be 1920x1080 and it is. If you ever encounter this issue, recreate the emulator or try a different one entirely.

drawable sizes for different screen sizes in android

i have a problem in android development that bored me. my problem is screen size and dealing with that. specially i have some problems with images. for example i want to create a background image for my activity that i created in photoshop and my background image contains a "HELLO" word on it. but when i put it on drawable-xhdpi folder, it seems blurry and its not sharp!! my phone is a nexus 4 and according to Google documentation i create background image in 640 x 480 size.
when i create background image in 960 x 720 size it seems better but not perfect. in this case my image file size is very high!
but what is the standard way for this? please help me to solve this problem for ever. i read google documentation but its not solve my problem!
http://developer.android.com/guide/practices/screens_support.html

You should usually avoid creating images for certain screen sizes to make them background, because there are thousands of different devices and you would have to create dozens of such images.
The first thing you need to be aware of is screen density.
Generally you create 3 to 5 images when not even looking at screen size: low (120 dpi), medium (160 dpi), high (240 dpi), extra high (320 dpi) and 2*extra high (480 dpi). These go into drawable-Xdpi folders, where X is one of l, m, h, xh, xxh.
Next thing when you want to have bigger images on bigger screens (bigger phones, small and big tablets), you may want to put images to folders like drawable-sw600dp-Xdpi. This is not a case for your phone.
Nexus 4 is a xhdpi 640x384 dp device, but you should not treat it differently than Samsung Galaxy S2 (hdpi 533x320 dp).
Create an image of smaller size for both phones and center it horizontally. E.g. 320x100 px for mdpi, 480x150 px for hdpi and 640x200 px for xhdpi (your phone).

the screen resolution for Nexus is 1280x768 (http://www.google.com/nexus/4/specs/), resize the image to this resolution. In especial consideration some images can't handle the resolution and the image became disproportionately.
for interesting
resolution calculator:
http://members.ping.de/~sven/dpi.html

This is problem of Android Fragmentation and you just cannot deal with it perfectly as there is a several hundreds different devices. As colleague above wrote Nexus 4 has resolution -1280 x 768 so for sure res of image as equal as 960 x 720 is good choice. I'm even surprised that google suggest 640 x 480 for xhdpi, it's definitely too less.
So as I said you are not able to make perfect looking graphics for all existing devices. You should choose the most popular devices from every screen category(xhdpi,mdpi,ldpi ... etc) to cover the most important market share.

With 1600+ android models even after they are categorized in few Screen size and a few DPI's its very difficult to manage layouts.. i suggest that you just concentrate on designing layouts w.r.t to screen size and then create views as Resizeable Views to neglect density effects.
Once you have created your layouts Resize the Views .. You can create a Custom View or resize on its onMeasure();

App widget inconsistent sizing between tablet and phone

I am attempting to design an app which reproduces the shortcut styles of the standard app shortcut home screen icons but as a widget. Note, this is currently just looking at the standard Android homescreen.
I have made the following observations using the "Dump View Hierarchy for UI Automator" tool in the DDMS -> Devices view of Eclipse:
The space given in the 1 x 1 square changes depending on screen density, orientation and whether the phone home screen is in "phone mode" or "tablet mode" (start a 4.x emulator and you can tell by the background amongst other things). Screen density effects the size as expected (0.75, 1, 1.5, 2.0 density factor scaling), but the orientation and 'home screen mode' are quite unpredictable. Specifically:
DIMENSIONS FOR A 1x1 'SQUARE' ON THE HOMESCREEN
Phone mode:
Portrait: 80dp x 100dp = 4:5 aspect ratio
Landscape (if available - not thoroughly tested): 106dp x 74dp = 53:37 aspect ratio
Tablet mode:
Portrait: 96dp x 96dp = 1:1 aspect ratio
Landscape: 96dp x 96dp = 1:1 aspect ratio
As you can see, there is barely any consistency whatsoever, but these are the dimensions given to a 'square' on the home screen. It gets even worse when looking at the space actually given to widgets (yes, it does differ from the square space available and used by the system shortcut widgets):
DIMENSIONS GIVE TO A WIDGET IN A 1x1 'SQUARE'
Phone mode:
Portrait: 80dp x 100dp = 4:5 aspect ratio
Landscape (if available - not thoroughly tested): 90dp x 58dp = 45:29 aspect ratio
Tablet mode:
Portrait: 72dp x 72dp = 1:1 aspect ratio
Landscape: 72dp x 72dp = 1:1 aspect ratio
So I'm stuck with:
Inconsistent aspect ratios between phone and tablet modes
Smaller areas given for an app widget then that of an app shortcut in some cases. Consequently, the relative and perceived size of widgets will look very different on a tablet vs phone?
The smaller areas aren't even vertically centred, they are mostly top aligned with a 2dp top margin which means they don't even look aligned with a neighbouring application shortcut to start with, let alone when trying to produce a similar looking shortcut through a widget
To visualise, the following images show a default system shortcut (with a red box surrounding showing the 'square dimensions - which both system shortcuts and widgets always share). Next to it is my widget with the blue highlight showing the bounds of a MATCH_PARENT setup, hence where the widget can actually draw within its 'square':
Phone - Port:
Tablet - Land:
Tablet - Port:
Most important to take from here, is the blue area of the widgets on a tablet does not even include the space where the system shortcut draws its text?
Does anyone have insights into:
Why the home screen is so inconsistent?
Why app widgets are not given the same drawing space as that of a system shortcut / or should it be and I am doing something wrong?
Should I be doing something else, or is it just accepted that for a 1x1 widget which takes up all its given drawing space, it will look 'smaller' (compared to its surroundings) on a tablet than it would on a phone?

And even better, many launchers allow the user to customize the size of their grid. Per the design guidelines for App Widgets, you cannot rely on an exact size on all devices. Instead, determine a minimum width and height and let the home screen determine how many squares the layout takes up.
They do provide some guidance on what you can expect for the minimum size of a cell (and all your numbers are much larger than that it seems), but again custom launchers may reduce this minimum even lower.
I find it best to focus on what components need to be in your layout (buttons, etc) and then follow the Metrics and Grids design guidelines to determine your minimal size (noting the margins are automatically added on Android 4.0+ devices but not on <4.0 devices). Then make sure your layouts are dynamic enough to fill in the space provided to them (centering text, etc as appropriate). Remember widgets are assumed to be a framed, single entry, rather than floating text as noted on the App Widget Design guidelines.

Hey you can manage the scree sizes in layouts you want to create different layouts for different screen sizes and also for landscape and portrait .
create the following layouts in your resource folder like this :
layout-large
layout-small
layout-xlarge
layout-landscape
And then copy your XML files in to it and check in preview screens for different devices you can have a idea based on that you can modify the size of the widgets in your homescreen.

build dynamic android layouts

am trying to build android app with a dynamic layout to support multiple screens
am thinking about build all my app for a certain device with a fixed dimensions like Motorola Droid , say that the button will be 50 width 50 height
and after i finished all the app , i will reedit the sizes of elements to be a ratio betweetn the right place of them and the dimensions of the new device
also Drawables will be Scalable Drawables and i will use only the Drawables folder and remove others :
- drawable-hdpi
- drawable-ldpi
- drawable-mdpi
so i will have only one Drawables folder and only one layout xml file for every activity
and most of my layouts will be hard coded using java
so the question is : is it a true method for development ?!
may be you will ask , why ?
so my answer is , as i think my method is easer than using :
res/layout/my_layout.xml // layout for normal screen size ("default")
res/layout-small/my_layout.xml // layout for small screen size
res/layout-large/my_layout.xml // layout for large screen size
res/layout-xlarge/my_layout.xml // layout for extra large screen size
res/layout-xlarge-land/my_layout.xml // layout for extra large in landscape orientation
res/drawable-mdpi/my_icon.png // bitmap for medium density
res/drawable-hdpi/my_icon.png // bitmap for high density
res/drawable-xhdpi/my_icon.png // bitmap for extra high density

The simplest (and probably the best) way to create layouts that support all screen sizes is to use a RelativeLayout.

AFAIK you can manage resoution variation of different devices by keeping the images in drawable-hdpi,drawable-mdpi,drawable-ldpi folder.
then screen sizes by providing different layout for different screen size categories by specifying layout-small,layout-large,layout-xlarge.
also you can increase number of devices supported by using nine patch and relative layout check this google official documentation regarding this topic.
hope this help.
thanks.