Develop Reference

Why android lose image quality when displaying a png file?

I want to display a png image on android. This is the image file:
The right end is a bit darker than left.
But the quality of image lost on android application(using ImageView):
Please note part in the red frame. The color is not changing smoothly.
But if I use the browser of my android phone, it plays good(so it's not reason of the phone screen):
This is my android code, which is pretty simple:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/hhh"/>
</LinearLayout>
where hhh is my first image posted here, which is under res/drawable.
I test it on my android phone(android 2.3.6) and android simulator(with android 2.2/2.3/4.0), all do not display good. But it plays good on my android pad(android 4.0.3).
What's the problem, and how to fix it?

Images in res/drawable are compressed. This is supposed to be lossless, but I've heard of similar issues in the past.
Move it into res/raw, and give it a go.

Try adding the following to your Activity and see if it helps.
#Override
public void onAttachedToWindow() {
super.onAttachedToWindow();
Window window = getWindow();
//eliminates color banding
window.setFormat(PixelFormat.RGBA_8888);
}

This problem is a well-know it is a gradient banding issues, I have this problen and solve by add noise, such as http://planetphotoshop.com/say-goodbye-to-gradient-banding.html

Image does not show completely white despite it's correctly white

For a splashscreen I use an image which contains a white background (pure white - checked in Photoshop). For some reason it shows a slight green bg vs. the activity's default white bg - as marked in the screenshot. Only in some devices, like the
I add this as single view in a frame layout to the activity:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitCenter"
android:src="#drawable/splashscreen" />
</FrameLayout>
Any idea? I read about RGB888 vs. RGB565 issues, but couldn't find a proper solution.
Note: I sure could make change the white in the image to transparent, but would prefer to understand the problem and find a proper solution.

This is really annoying. I wonder, why so few people encountered this problem as it should appear on all 32-bit displays.
You mentioned right about RGB888 format. The cause of the problem is that regardless of the original bitmap format in the APK files all bitmaps are compressed (in my case into indexed 256-color! wtf?).
I couldn't find the way to prevent it, so if anyone knows the proper solution, please tell.
However, I found two solutions for the white color problem.
1) Per-bitmap: Say, we have a drawable bitmap resource called #drawable/mypng, which causes the problem. We need to add an additional XML drawable drawable/mypng_nofilter.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/mypng"
android:filter="false"
/>
and use #drawable/mypng_nofilter instead.
2) For entire activity: In activity onCreate method we need to add
getWindow().setFormat(PixelFormat.RGB_565);
Now the window has 16-bit color depth and all bitmaps appear "properly" white.
Again, I would prefer to have 32-bit color depth, but I don't know how to control compile-time image compression.

I have solved this issue by changing the Bitmap.CompressFormat type to PNG instead of JPEG:
Resources res = getResources();
Drawable drawable = res.getDrawable(R.drawable.nouv);
Bitmap bitmap = (Bitmap)((BitmapDrawable) drawable).getBitmap();
ByteArrayOutputStream stream = new ByteArrayOutputStream();
bitmap.compress(Bitmap.CompressFormat.PNG, 100, stream);

I encountered the same problem with network loaded images. I solved the issue by disabling bitmap filter. Since I do not have the issue on ICS and newer devices, I turned off the bitmap filter only for pre-ICS devices. Following is the code I used (setting network loaded bitmap to the ImageView.)
BitmapDrawable bitmapDrawable = new BitmapDrawable(imageView.getContext().getResources(), bitmap);
bitmapDrawable.setFilterBitmap(false);
imageView.setImageDrawable(bitmapDrawable);

After using all the solutions in the Stackoverflow.
From changing android:src to app:srcCompact and many other solutions.
The thing which helped me was my image was inside drawable-anydpi and I moved the image from drawable-anydpi to drawable and it worked for me after 2 hours of research.
P.S: It might help someone too that's why I put it over here. :)

As your image only have a picture in its middle, I would advise you to set:
android:scaleType="centerCrop"
It will crop some part of your picture, at left and right, but will use the whole screen...

You can also define a background to your FrameLayout or your ImageView using the color of your picture (which seems to be F8FCF8):
android:background="#F8FCF8"

How to add a PNG image as background in Android with no alteration (banding)?

I'm trying to add a background that includes a gradient (I do want to use an image, not an android xml declared gradient effect).
This image is remarkably ruined by Android, it add some crappy banding whatever I try the result is the same (two capture of approximately the same region the distorted/normal images) :
My image is used as a layout background inside my layout XML :
android:background="#drawable/background_gradient_dithered"
I've tried to used an intermediate drawable to force dither whose xml is :
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/background_gradient" android:dither="true" android:antialias="true" android:filter="true"/>
I've tried to have the following code in my onCreate() :
getWindow().setFormat(PixelFormat.RGBA_8888);
Both tries changed nothing.
Thanks

The correct solution was .... I bet you've guess it : restarting Eclipse. I've learned it, every problem on Android might be a "restart Eclipse problem".
After some test I can add that enabling dethering is not useful when Format is set to PixelFormat.RGBA_8888
Readers should give a look to the answer given by #TenFour04, this approach can avoid to make drawable just to enable dithering.
window.addFlags(WindowManager.LayoutParams.FLAG_DITHER);
EDIT :
I've found out that even with these tricks the problem can persist. You can try to modifiy your PNG to have an alpha layer in it (change a pixel to a transparency of 99% for example), this would force android compiler to not play with it.

Try adding this in onCreate(). Older versions of Android default to no dithering.
Window window = getWindow();
window.setFormat(PixelFormat.RGBA_8888);
window.addFlags(WindowManager.LayoutParams.FLAG_DITHER);

I worked it out, just change the size of the .png files. I put them in the mdpi and resized it with Irfanview <-open source image editor to 1024x7xx <- dont remember, this comes too handy
and I set it for 300 dpi. So they download it on a tablet and stuff, hope this helps :)

Why are ?Images Compressed when Displayed on Android Phones/Emulator?

Essentially I want an HD background on a layout, but instead of being a pristine image, it shows up extremely compressed.
Example:
Source Image:
Android Emulator version:
I thought maybe that it was just the emulator, but it looks that bad on the phone itself. I know these are high quality Samsung Galaxy S phones (these are the ones that came with Avatar preinstalled after all).
Does anyone know how to load images without compression? Source files are uncompressed pngs.
here's the code for what it's worth:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:weightSum="1" android:background="#drawable/background" android:id="#+id/blank">
</LinearLayout>

Figured it out: The problem is the image is automatically converted into RGB565 colorspace from AGB888. To prevent this, make sure the image has an alpha channel and is in a "raw" directory instead of the "drawable" directory.

The aapt may compress images when it builds the apk, but that compression is supposed to be lossless. The problem is probably somewhere else. Here are two possibilities.
If your image resource is being loaded from res/drawable on a device (or emulator) that is not mdpi, then it will be scaled as described here. One solution is to put the resource in the res/drawable-nodpi folder. Another is to provide several, density-specific images.
Another problem will arise if your background image does not match the size of the view. The view will automatically scale the image to fit the view size. You can prevent this by defining the background as an XML Bitmap with a gravity set to something that does not scale (such as center).

Tiled drawable sometimes stretches

I have a ListView whose items have a tiled background. To accomplish this, I use the following drawable xml:
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/tile"
android:tileMode="repeat" />
Usually, this works. Sometimes, however, the src drawable isn't tiled, but stretched to fill the entire list item. (I've got several different tiles like this, and I use them mixed in one ListView. If there is stretching instead of tiling, it's never been in all of them at once, for what that's worth.)
I also tried to add android:dither="true" to that xml, since I read somewhere that without it there might be bugs. That didn't change anything.
Has anyone had the same problem? How did you fix it?

I also got bitten by this problem. Very hard to diagnose, even harder to find similar reports and usable solutions.
"Tapas" on the freenode #android-dev irc channel came with the following utility method:
public static void fixBackgroundRepeat(View view) {
Drawable bg = view.getBackground();
if (bg != null) {
if (bg instanceof BitmapDrawable) {
BitmapDrawable bmp = (BitmapDrawable) bg;
bmp.mutate(); // make sure that we aren't sharing state anymore
bmp.setTileModeXY(TileMode.REPEAT, TileMode.REPEAT);
}
}
}
Apply it to all Views that have a tiled background set (e.g. findViewById them).
Also, I have the impression this bug started acting up after setting "anyDensity=true" in AndroidManifest.xml

I've just had the exact same issue except with CLAMP TileMode. I have a bitmap that I want to then just stretch away at the bottom and have it set up as an XML defined BitmapDrawable and in the Graphical Preview window all looks fine, no matter what size I make the ViewImage it draws my bitmap at the top and then repeats the last pixels to fill to the end.
Launching the app on various SDK builds on the emulator and on my own phone all then produced a straight 'fill' type distortion which is completely useless.
The solution turned out to simply be to re-apply the TileMode every time I changed the size of the ImageView within my code:
((BitmapDrawable)ascender.getDrawable()).setTileModeY(TileMode.CLAMP);
Now it's all drawing fine. So yes, this looks like a bug to me.

As I didn't see the link here, this was confirmed to be a bug in Android. It was fixed in ICS. See XML drawable Bitmap tileMode bug? for more details.

There is a lot of noise about this topic online, with various (and numerous) suggested solutions.
If you're still at a loss, my suggestion is to keep all tiled bitmap
resources to square, base-2 dimensions.
ie: 16px by 16px for an xhdpi tile asset.
I hoped that the Android platform would "over-tile" to fill a space if the bitmap did not tessellate perfectly - and then trim the waste. However trialling a 10px*10px tiled bitmap across mdpi, hdpi and xhdpi (and v2.3 to v4.0)'inconsistently' showed this stretching.
The base-2 dimension allows for whole and even division as you progress through the various resolutions and as each device tries to paint the tiles each time the view is created.
In Android development, we contest with the ranging hardware and the vendors dipping their fingers into the platform - sometimes this sort of trivial black magic just works.
This appears to have resolved the issue for me at least. Worth a shot.

This sounds like a bug, although I've never seen it myself. If you have a simple APK that reproduces the issue, please send it to me (romainguy /at/ android.com) or file a bug here.

This blog entry discusses the issue
combined with this solution from Tapas listed by Ivo van der Wijk, it works for me.
The key was to remove the tiled setting from the XML, then set it to tiled at runtime. It does not work for me if they are both set to tiled.
Edit: actually, I lied. Even with this it seems to sometimes fail to tile.
Would be very nice to have a reliable work-around.
Edit 2: setting it to something else (eg. CLAMPED) then setting it back so far seems to be working.

I moved my image from drawable-xhdpi to drawable folder and everything was fine.

I was also having the same issue. What I was missing was that we need to add scaletype to fitXY in the imageview for the xml bitmap to work properly.
tile_bitmap.xml
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/tile"
android:tileMode="repeat" />
layout.xml
<ImageView
android:layout_width="match_parent"
android:src="#drawable/tile_bitmap"
android:layout_height="match_parent"
android:scaleType="fitXY"/>