1

I have an image with the dimensions of 5534 × 3803, and size of 2.4mb. The UIView references notes that:

"In iOS 3.0 and later, views are no longer restricted to this maximum size but are still limited by the amount of memory they consume."

When the image loads, it lags for half a second, then slides in. The image sits in the UIImageView at 1024x704, but can be scaled up to 4x that size for the purpose of my app.

Are you able to preload the image in the AppDelegate? Or is there another way of working around having such a large image?

Thanks

EDIT: The scaling is done via UIPinchGestureRecognizer, and scales up and done (scale x4 - x1) based on the image's center point. There is no panning of the image when zoomed in.

Tobe_Sta
  • 448
  • 6
  • 20
  • 1
    Maybe this will help you https://developer.apple.com/library/ios/#samplecode/PhotoLocations/Introduction/Intro.html – Blazer Feb 27 '12 at 03:57
  • I don't know if this will answer your question, but this [gist post](https://gist.github.com/1144242) might help – esqew Feb 27 '12 at 03:57
  • 1
    I think 2.4mb is compressed size. When uncompressed, it takes 5534 * 3803 * 4 bytes - more than 80mb. I'd recommend to watch WWDC 2010 Session 104 Designing Apps with Scroll Views at https://developer.apple.com/videos/wwdc/2010/?id=104 – hoshi Feb 27 '12 at 05:55

1 Answers1

2

Personally, I would try to write a tile-based system (think Google Maps) that slices your big image into a grid of small images to avoid loading in that gigantic image all at once into RAM. I don't really know what your user interactions are for this image, or whether the images are changing or baked into your project, but I'd assume you can let users scroll around since that image is bigger than any iOS screen. With a tile-based system, you only load the images that are on-screen. CATiledLayer is an Apple class for doing just such a thing. That's probably what you want to look into.

See this StackOverflow question for some different approaches. The accepted answer uses code from Apple's sample PhotoScroller project, which may work for your needs and uses CATiledLayer.

This ScrollViewSuite Apple code might also get on your way (check out the Tiling code).

Community
  • 1
  • 1
poetmountain
  • 657
  • 10
  • 18
  • Is this method still viable even if I don't pan? I simply have a large image that starts zoomed out as to see the whole image within the bounds of the screen, but can be zoomed in to it's actual size (roughly 4x zoom). – Tobe_Sta Feb 27 '12 at 08:56
  • If you don't want users to be able to scroll through the full-size version, then you could just save the four different sizes of the image to disk, with the "full-size" version being saved cropped to the area you want the user to view that fits the iPad/iPhone screen area. This is less flexible, but it will get around the memory issue. – poetmountain Feb 27 '12 at 09:09
  • I would recommend looking at the PhotoScroller project I linked though -- I believe it is similar to what Apple does with their Photos app. Their photo loading is fast no matter how big the source image is. – poetmountain Feb 27 '12 at 09:30
  • PhotoScroller seems like it'd do the job. Wouldn't all those tiling images create a rather large app? – Tobe_Sta Feb 28 '12 at 00:17
  • No. If you look at the `displayTiledImageNamed` method in ImageScrollView.m, you see it gives the size parameters to the CATiledLayer class in the TilingView.m file, which then does some tile magic. And you'll see that TilingView doesn't actually save each tile to disk. Instead, the `tileForScale` method is given a col/row and grabs that section of the image and returns it dynamically. – poetmountain Feb 28 '12 at 02:01
  • Thanks for the help. I've got it working, expect that the first two zoom level images just aren't showing up. The grid is sectioned off to fit the images, but visually nothing is there. – Tobe_Sta Feb 28 '12 at 05:47