Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Scaling images to different drawable folders taken from my phone to be used as header image

Tags:

android

Android Studio 1.3

Hello,

I have taken some pictures from my Nexus 5 phone. I would like to use one for as a header that is loaded into a imageview.

However, I am not sure about the scaling and which drawable-xhdi, drawable-xxhdi etc, it should go in.

The picture I have currently is:

Width: 3200 pixels
Height: 2368 pixels
Size: 2.4 MB
file type: jpg

I have gimp photo edit tool that I can compress into a png file to reduce the size. But I am not sure how can I make the picture look good on other screen densities. Which drawable folder would I have to put each one in?

Many thanks for any suggestions,

like image 822
ant2009 Avatar asked Aug 22 '15 04:08

ant2009


People also ask

How do I import a picture into drawable?

To import image resources into your project, do the following: Drag and drop your images directly onto the Resource Manager window in Android Studio. Alternatively, you can click the plus icon (+), choose Import Drawables, as shown in figure 3, and then select the files and folders that you want to import.

What is the preferred image format for the drawable?

Supported file types are PNG (preferred), JPG (acceptable), and GIF (discouraged).

Which function is used is to load a drawable image resource?

Drawable drawable = ResourcesCompat. getDrawable (res, R. drawable. myimage, null);

What is ImageView in android?

ImageView class is used to display any kind of image resource in the android application either it can be android. graphics. Bitmap or android. graphics. drawable.


1 Answers

1st of all, you should know there is a limit on image size :

OpenGl maximum size is 2048x2048 or else it throws an error: Bitmap too large to be uploaded into texture.

2nd you must consider, what are devices you are targetting for. There are different qualifiers in android:

Screen size: Actual physical size, measured as the screen's diagonal. For simplicity, Android groups all actual screen sizes into four generalized sizes: small, normal, large, and extra-large.

Screen density The quantity of pixels within a physical area of the screen; usually referred to as dpi (dots per inch). For example, a "low" density screen has fewer pixels within a given physical area, compared to a "normal" or "high" density screen. For simplicity, Android groups all actual screen densities into six generalized densities: low, medium, high, extra-high, extra-extra-high, and extra-extra-extra-high.

  • small and normal size - Handsets
  • large size - 7' tablets (e.g. sw600 - smallest width 600dp)
  • xlarge size - 10' tablets (e.g. sw720 - smallest width 720dp)

3rd look at Android Dashboard.

Dashboard 03.09.2015

Quick look reveals, that are few ldpi and almost none xxxhdpi devices. What does it mean? You don't need to provide resource for those folder. But do as you like.

Note: You do not need to provide xxxhdpi assets for all your app's images.

4th Look at your application and find out the maximum size:

So if your image is going to be a header, I assume it will match_parent -> Let's say, you are designing your app to work on screen resolutions 1920*1080 (h*w) and lower. Now you see first important step. If your image matches_parent and parent is maximum 1080px wide, you don't need 3200 px wide image!

5th Resize the image using some tool like 9-Patch-Resizer or Android Asset Studio and add it to your drawable folders

6th Test it on devices and check if the image quality is good enough. On tablets, you might consider to use drawable-large and drawable-xlarge folder.

  • 320dp: a typical phone screen (240x320 ldpi, 320x480 mdpi, 480x800 hdpi, etc).
  • 480dp: a tweener tablet like the Streak (480x800 mdpi).
  • 600dp: a 7” tablet (600x1024 mdpi).
  • 720dp: a 10” tablet (720x1280 mdpi, 800x1280 mdpi, etc).
like image 100
Vojtěch Pešek Avatar answered Sep 17 '22 17:09

Vojtěch Pešek