I have a huge doubt and I can't find an answer. Through books and tutorials I learned that I need to provide different sized images for each resolution. In this way images appear the same across devices with different numbers of pixels on the screen. For example, an image in drawable-hdpi folder must be 1,5x greater than the same one provided in drawable-mdpi and so on. All of this thanks to Density-independent pixel system. That's ok but...how can I choose the correct dimensions of my image source (base image)? Taking as example this layout from Material Design Guidelines:
Suppose the image showed has a fixed height and a width set in match_parent. I want to replicate this kind of layout with my own image. If I download an image from free stock photos website or take an image with my reflex, most probably I’ll get a very big picture, such as 5184x3456 px. I think an image like this is too big as source image. If I use such big image for mdpi drawable, the image for xxxhdpi drawable will be 4 times greater! Not to mention the weight!
I tried to do the following reasoning: a device like Nexus 5 has 1920x1080 resolution screen and it's classified as xxhdpi device. My idea is to resize the image to obtain a width equal to about the length of the longest axis, (y-axis, 1920px, because the device can be rotated). In this way I would have to obtain a lighter base image without a high number of unnecessary pixels.
Could you help me understand what the procedure is?
Thank for the attention
You need to ask yourself "Is the experience that you are created will be enriched enough by including many different versions of the images?"
Each image that you add to the app will increase the app size so it will take longer to download and take up more room on the device at the end.
Depending on the number of images and the size you may be better off to provide an "add-on" or "Theme" app with your high quality image assets.
You may want to also look into Bitmap 9 Patch images. You can read more about Bitmap 9 Patch images here
On this page https://developer.android.com/guide/practices/screens_support.html they say
Android Docs wrote:As you design your UI for different screen sizes, you'll discover that each design requires a minimum amount of space.
So, each generalized screen size above has an associated minimum resolution that's defined by the system.
These minimum sizes are in "dp" units—the same units you should use when defining your layouts—which allows the system to avoid worrying about changes in screen density.
- xlarge screens are at least 960dp x 720dp
- large screens are at least 640dp x 480dp
- normal screens are at least 470dp x 320dp
- small screens are at least 426dp x 320dp
There is actually quite a bit of information on this page https://developer.android.com/guide/practices/screens_support.html and you may want to read it more then once to understand it all.
You may also want to look at the "Converting dp units to pixel units" on that Android documentation page. This can give you an idea as to how big you want to your images to be.
Given the dp you can then conclude what your image size should be and vice versa.