Android: fast image slider with *correctly rotated* images - android

There are a lot of examples how to use ViewPager as an image slider, but I haven't seen any that handle the problem of correctly rotated images:
Now actually I have a solution for this, but the problem is that the image sliding is painfully slow when the image size is over about 3000*1500 pixel because of the extra rotation step:
The ImageView itself doesn't care about the correct orientation when setting an image via
setImageURI or setImageBitmap.
This means you first have to find out the correct orientation yourself and then eventually do a
matrix.postRotate(rotation)
and create a new bitmap using
Bitmap.createBitmap(srcBitmap, 0, 0, srcBitmap.getWidth(),
srcBitmap.getHeight(), matrix, true);
This additional bitmap creation really slows it down.
If the was a method to load an image "rotated on the fly" ? Sth. like BitmapFactory.decodeStream(stream,matrix) ?
I have also tried to increase the ViewPager.setOffscreenPageLimit value to 3, but with
the result of "java.lang.OutofMemoryError: bitmap size exceeds VM budget" errors.
Somehow it must be possible because with the default "Gallery" app the sliding is really fast even with very large images...But I guess this not a trivial task ?

Finally I found the solution: to get a responsive, fast & fluid image sliding behaviour two things need to be done:
Do the bitmap loading in the background using AsyncTask
https://developer.android.com/training/displaying-bitmaps/process-bitmap.html
Load a downsampled version of the bitmap using BitmapFactory.Options.inSampleSize (calculated using the ratio between ViewPager's and the Bitmap's dimensions)
https://developer.android.com/training/displaying-bitmaps/load-bitmap.html

Related

Resizing and rotating an image file efficiently (with/without renderscript)

Whenever we need to rotate and resize a huge image file on Android (no bitmap allocated yet), the usual steps would be to first load the image into a resized bitmap, then do the rotation on another newly created bitmap.
If I do the rotation first I'll probably end with the dreaded OutOfMemoryError. This is quite logical and I'm OK with that.
Problem is, both approaches include having two bitmaps at once in memory at some point, and I'm on a tight memory budget here, even after implementing bitmap scaling as the official docs say (https://developer.android.com/topic/performance/graphics/load-bitmap). A typical implementation looks like this:
Bitmap bitmapResized = resizeBitmap(fSource, nTargetWidth, nTargetHeight);
Bitmap bitmapRotated = rotateBitmap(bitmapResized, nOrientation);
[recycle both bitmaps here]
Is there any way to do both steps at once in a memory lightweight fashion?
I have read about renderscript but I wasn't able to find code that does not take an already allocated bitmap.

Load Very Large Bitmap

I'm taking whole screenshot of a WebView and display the bitmap on an ImageView. The bitmap can be 7 screen height. (E.g. 1440x14000 px)
I'm frequently face with
OutOfMemoryError.
I've seen this
This says that load a scaled down version into memory but I don't want to lose image quality. There are the same approaches on the web.
Is there any way to handle OutOfMemoryError without loading scaled down version?
The bitmap can be 7 screen height. (E.g. 1440x14000 px)
Note that this means that the user cannot see the whole image at once at full resolution.
I'm frequently face with OutOfMemoryError
On most devices, you will have a very difficult time loading an image that large, as you cannot get a single contiguous memory block that big.
This says that load a scaled down version into memory but I don't want to lose image quality
To some extent, you do not have much of a choice. If you want the user to see the full extent of the picture at once, the image has to be scaled to fit the screen.
Is there any way to handle OutOfMemoryError without loading scaled down version?
There are ImageView replacements that offer pan and zoom. Some of those, such as this one, handle loading in pieces of the image at a time, with whatever scaling is necessary for the current zoom level, to make it more likely that you will be able to show the user the entire image.
It is not a solution, of course, but I'm also not familiar with your exact needs, so maybe this may help you a little - you can try to play with bitmap options during decoding. Try to use Bitmap.Config.inPreferredConfig as RGB_565 - this will reduce size of your bitmap twice comparing to default ARGB_8888. But, of course, if you use complex images in your web page this may reduce their quality.

OpenGLRenderer trying to scale down bitmap - when reaching end of ViewPager

App has a ViewPager with several Fragment in it.
When user scrolls to the end of pages, there's this Android gradient effect that indicates there's no more pages (instead of iOS's bounce effect).
When this effect occurs, apps become unresponsive and frames are dropped, while in the log there these lines -
Trying to scale down bitmap for texture (2560x4544 -> 2307x4096)
Scaled bitmap has been successfully created
There's no bitmap in the app of this size and it's running on a QHD (1440 x 2560 pixels) LG G3 display, so I guess some bitmap is scaled up to fit this xxxhdpi resolution, then for some reason scaled down a bit.
Question is - why is it trying to scale down a bitmap when this effect occurs? Can this be avoided?
Is it the gradient effect rendering that is being scaled down?
It stopped when I turned off the over scroll effect (iOS's bounce equivalent). Maybe this effect is an image that's resized before shown, though I don't understand why they don't cache it, if it's true.
viewPager.setOverScrollMode(View.OVER_SCROLL_NEVER);
The problem is with loading some image in your page:
Solutions:
1. if you must load the image use a library named Picasso http://square.github.io/picasso/ to load it
2. if the image is a shape try to make the shape yourself in android.
At all costs avoid loading big images in the xml. even in the newest phones this has a big impact on performance.

Android pre-honeycomb bitmap management

For my application I need to load a bitmap which sometimes can be really large. I'm getting OutOfMemory errors even on devices like galaxy S2. I searched around and found that I need to recycle the bitmap.
Previously I was loading the bitmap with BitmapFactory, creating a new scaled bitmap, and creating a bitmapdrawable all in one line. By doing this am I loading two bitmaps into memory? Should I create the initial bitmap and then recycle it after creating the scaled bitmap?
If the activity will be launched frequently should I load the bitmap once to a static field or should I recycle and recreate every time?
Thanks
Split the process into multiple steps. If you are measuring the bitmap against the available screen space and then loading a scaled bitmap, you can do the first step without loading the bitmap into memory using BitmapFactory.Options.inJustDecodeBounds. This will give you a Bitmap object without the pixel data but with the width and height properties. Then use that to decode your scaled bitmap using BitmapFactory.Options.inSampleSize.
Google these terms and you'll find tons of sample code doing just this. And yes, don't forget to recycle when you're done with a Bitmap.
https://www.google.com/#q=BitmapFactory+Options+inJustDecodeBounds+inSampleSize

OutOfMemory error while joining large images

I am joining two images using the code below but it throws an OutOfMemory error my images are around 1MB each.
private Bitmap overlayMark(String first, String second)
{
Bitmap bmp1, bmp2;
bmp1 = BitmapFactory.decodeFile(first);
bmp2 = BitmapFactory.decodeFile(second);
if (bmp1 == null || bmp2 == null)
return bmp1;
int height = bmp1.getHeight();
if (height < bmp2.getHeight())
height = bmp2.getHeight();
Bitmap bmOverlay = Bitmap.createBitmap(bmp1.getWidth() + bmp2.getWidth(), height,
Bitmap.Config.ARGB_8888);// Out of memory
Canvas canvas = new Canvas(bmOverlay);
canvas.drawBitmap(bmp1, 0, 0, null);
canvas.drawBitmap(bmp2, bmp1.getWidth(), 0, null);
bmp1.recycle();
bmp2.recycle();
return bmOverlay;
}
Update: I tried below two answers but it still not allwoing me to create bitmap of such big size the problem is that the resultant bitmap is too large in size around 2400x3200 so its going out of memory.
How can I join large images without running out of memory?
Without loading the image into memory, you CAN get the size of the image, using inJustDecodeBounds. The Bitmap returns null, but all the parameters are set. You can scale down the image accordingly.
If your JPEG images are 1 MiB each, conversion to a BMP will take a lot of memory indeed. You can easily calculate its BMP equivalent by the dimensions of the image. Conversion of such a large image is expected to crash indeed. Android limits its apps to 16 MiB VM only.
Also use RGB_565 instead of ARGB_8888.
So your only solution is:
(a) To use BitmapFactory.Options.inSampleSize to scale down the image
or
(b) Use Android NDK where the 16 MiB limit isn't there.
I use this simple rule of the thumb:
the heavy lifting (both memory/CPU) is done on the server.
So write some servlet that takes the image, resizes it to a specified dimension (probably reduces the pixel depth too) and returns the result.
Piece of cake and it works on any mobile device you need.
Good luck!
I think a solution sort of like Sumon suggests might work.
Figure out the size of the final
image based on what will fit on the
screen.
Get the size of the first image using
the inJustDecodeBounds technique.
Figure out the size of the first
image in the final image. Calculate
re-sizing parameters.
Resize image, loading into memory.
Write resized image back to disk.
Recycle the bitmap. (This will help
when resizing the 2nd image)
Repeat for the second image, only you
can skip the writing to disk part.
Load first image.
If you only need to display, then just do that. If not then you can combine into a single bitmap at this point and write to disk. If this is the case, it may be difficult because you wil have essentially 2x the screen size in memory. In that case I would recommend resizing smaller. If you can't go smaller, then you will have to go the NDK route, thought I'm not sure how much that will help. Here's an amusing intro to the NDK and JNI. Finally, I would highly recommend developing this using a phone running Android 2.3+ since its use of heap-allocated bitmaps will make debugging much easier. More about those here.
It's not necessary that the space taken by in-memory representation of bitmaps correspond closely with file size. So even if you have 3mb memory available to jvm, you might still get OutOfMemoryException.
Your code is creating three in-memory images simultaneously. If you can find the size of both images without reading the complete files, you can modify the code in a way to have only one of the source images in memory at a time. If even that doesn't prove to be sufficient you might need some sort of streaming method of reading the images.
you may get some idea from here.
Are you trying to display this super large image or are you just trying to save it?
If your trying to display it. Cut the images into tiles. Then only display the tiles that are being viewed. If the user zooms out you need to reduce the size of the bitmap before showing the whole thing.
If your trying to save it, try saving it in sections to the same file by cutting the image up.
Loading 2 1m files in memory then creating a 2m file leaves you with 4M in memory for your images alone. Dynamically loading and unloading the memory solves this issue similar to tiles on Google maps or dynamic zooming in other map oriented solutions.
If you need to return that huge 2400x3200 bitmap as your result, there is no way to actually realize this goal. The reason is that 2400*3200*4 bytes ~ 30 Mb! How can you hope to implement this method, when even you can't even fit the return value into your limited heap space (ie 16Mb)?
And even if you used 16-bit color, it would still fail because you would end up using about 15MB, which would not leave you enough space for the language run time.

Categories

Resources