Question

I have a problem: (I wouldn’t be here otherwise 😉

I am creating an app that has a feature for displaying “3D” models. This part is really a collection of images taken from many angles and allows the user to “rotate” the “model”.
This idea is working fine, but the problem lie in the loading of the images.

I have found that there are two ways:

1. Load all the images into memory, and then simply switch them for the correct angle.
2. Load the images as we need them – we can load a few ahead of time.

However these have problems:

1. If I was lucky, the images would fit into memory, but they don’t. They are about 1.5-2MB each and there are about 75-100 images per model. This brings the total size to about 115MB at the minimum.
2. If I was lucky, the image would load quicker than the user could “rotate”, but they don’t. The user can easily switch to an angle that is not loaded yet, resulting in a black screen for a few seconds.

I have created a loader that allows me to simply add the images that I need to a stack and the loader will then one-by-one load the images. This works fine if the user scrolls fairly slowly. My loader takes care of releasing memory when it is finished, so no matter how many images I load, the app usually won’t crash as long as I specify the max images to store in memory. My loader can load the images very quickly, but there is still a few milliseconds (~250ms) for it to load the large image into memory.
Of course, the loader is on a different thread, and the loading in no way hinders UI response. That is why if the user swipes back and forth quickly, no image will actually display, as the loading and unloading are all working at the same time to result in no images 🙂

So, my problem: How do I provide a smooth and user-pleasing rotation of the images without loading all the images into memory?

Answer 1

Thanks for the answers. I laughed at myself and then went to bed after reading the answers.
Let me share how I resolved this problem – it uses some pieces of the answers:

I was trying to cache the large images in memory – this is unnecessary, why not store a lower res version and then load the hi res when the user stops scrolling? Then the user can scroll as fast as he likes and there will always be images in memory to quickly paint. When the user stops/slows scrolling, we load the hi res image.

Because he will be scrolling fast, he won’t be able to see the lower res’ lower quality.
And, as there will only be one hi res to load, the ~250ms delay is hardly noticeable.

This really combines the best of both cases. And I can use the Android’s methods for loading a lower res version of the Bitmap.