Image blurry on another device

Question

First of all, I want to apologize in advance since I'm sure that this kind of question has been asked before, but even though I was looking for about 2 weeks at those questions I could not figure out what I'm doing wrong.

This is where I load the image in the activity:

ImageView image = (ImageView) findViewById(R.id.shop_Image) ;
image.setScaleType(ImageView.ScaleType.CENTER_CROP) ;

String mDrawableName = data.vec.elementAt(id).fuenf ;
if ( mDrawableName.equals("leer") )
    mDrawableName = "ic_launcher" ;
int resID = getResources().getIdentifier(mDrawableName , "drawable", etPackageName());
image.setImageResource(resID) ;

And this is the xml-file:

    <LinearLayout
    android:id="@+id/shop_Layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#FDFDFD"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/shop_Image"
        android:contentDescription="@string/shop_image"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:scaleType="centerCrop"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />
    [...]

And these are the results:

On a Galaxy Nexus, Nexus 5 or Samsung S3 it looks like this:

And on a Razr I or HTC Desire X it looks like this:

I'm aware that the above devices, which display the image correct have a display with at least 4,7 inches while the both with the blurry images have 4,3 inches or 4 inches.

And even though I have put those images in the different drawable folders, I still get these unpleasant results.

If further code-examples are needed, please let me know.

PS: Sorry for the missing highlighting, I'm still a newbie :)

Try using dip instead of dp for the measures. dp = density pixels and dip = density independant pixels. Those devices have really different ppi so that might help. — Marcus Gabilheri, Jun 07 '14 at 20:09
As far as I know dp and dip is identical. I still might try it out, thank you :) — VollNoob, Jun 08 '14 at 04:48
@MarcusGabilheri VollNoob is right. dip is just another name for dp. Apart of the name, there's **no difference** between the two units. — Phantômaxx, Jun 08 '14 at 09:47
@DerGolem Do you have an idea what the reason for the blurry image might be? — VollNoob, Jun 08 '14 at 11:01
@VollNoob Desire X specs: `480 x 800 pixels, 4.0 inches (~233 ppi pixel density) - hdpi`, Samsung S3 specs: `720 x 1280 pixels, 4.8 inches (~306 ppi pixel density) - xhdpi` - You should read this: http://developer.android.com/guide/practices/screens_support.html. Quick fix: put the image in `drawable-xhdpi` (don't have the folder? create it) — Phantômaxx, Jun 08 '14 at 11:40
@DerGolem I already did that and have all the images in the two folders (hdpi and xhdpi), so I think I can rule that out as the source of mistake. And I already tried to put the layout-file in the folder layout-large and layout-xlarge. — VollNoob, Jun 08 '14 at 13:19
Are the image saved at the proper dpi resolution? a common erro is to leave them at the standard (insufficient) resolution of **72 dpi** or **96 dpi**. hdpi images resolution should be **240 dpi** and xhdpi images resolution should be **320 dpi**, to display properly. — Phantômaxx, Jun 08 '14 at 13:23
Change the resolution of the biugger image, without changing the size (whici is automatically scaled when you touch the resolution). Then make the smaller image out of this one, changing the resolution (it should scale down to the correct size 480*854 - just cut out the exceeding 54 pixel - 27 from the top and 27 from the bottom) — Phantômaxx, Jun 08 '14 at 13:29
@DerGolem Thanks a million! You had it all right! If you can answer my question, I'll be glad to accept your answer as the correct one :) — VollNoob, Jun 08 '14 at 16:27
@VollNoob Ok, done. Also edited the question by adding the referred images (Just forgot to do that before) — Phantômaxx, Jun 08 '14 at 16:44

score 5 · Accepted Answer · edited Jun 10 '14 at 13:20

A quick search on Google let me know these facts:

Desire X specs: 480 x 800 pixels, 4.0 inches (~233 ppi pixel density) - So, it's an hdpi device Samsung S3 specs: 720 x 1280 pixels, 4.8 inches (~306 ppi pixel density) - So, it's an xhdpi device

Now, you should read this: developer.android.com/guide/practices/screens_support.html.

A very quick fix could be: put the image in the /res/drawable-xhdpi folder (if you don't have the folder, just create it).

Also consider that:

The images should be saved at the proper dpi resolution.
A common error is to leave them at the standard (insufficient) resolution of 72 dpi or 96 dpi.

hdpi images resolution should be 240 dpi and xhdpi images resolution should be 320 dpi, to display properly and scale well.

So, what to do?

Change the resolution of the bigger image, without changing its size (which is automatically scaled when you touch the resolution - so, reset it to 1280*800).
Then make the smaller image out of this one, by changing the resolution (it should scale down to the correct size 480*854 - just cut out the exceeding 54 pixel - 27 from the top and 27 from the bottom).

Once you put the right images into their proper folders, everything should now fit well.

That was my error! I'm still confused though. On the Galaxy Nexus the images were displayed properly even though the dpi were incorrect, but on the Razr I it did not work out like it did on the Galaxy Nexus... weird. But anyways! Thanks :) — VollNoob, Jun 08 '14 at 16:46
The Razr I falls in the same hdpi category of the Desire X, but it's a bit bigger - `540 x 960 pixels, 4.3 inches (~256 ppi pixel density)`. You could scale it from the bigger image but enlarged to 540*960 and then put it in a folder called drawable-hdpi-w540dp-h960dp (or maybe drawable-hdpi-w360dp-h640dp - I'm not clear minded on these "resolution specific" folders - if it's in px or in dp, respectively) — Phantômaxx, Jun 08 '14 at 16:56

Image blurry on another device

1 Answers1