Tag Archives: image processing

iPhone dev image processing quirks

I had a lot of problems getting image processing to work properly on the iPhone. This isn’t so much because the image processing I was doing was very tricky; it was more because of some apparent quirks in how the iPhone works its image orientation.

Basically it seems that if you take a photo in portrait ie ‘up’ the iPhone thinks you’ve taken the photo in landscape ie ‘right’. Weird. But that’s how it seems to work.

In fact, no matter which way round you hold your iPhone, it always thinks the photo was taken 90 degrees clockwise from what it actually was.

In my app, I’m taking the raw image as a UIImage and converting it to a CGImage to do various things at the pixel level, and converting it back to a UIImage. As part of this I’m now therefore having to rotate the CGImage round, using code like this:

// iphone held up
if (uiimage.imageOrientation == UIImageOrientationRight) {
context1=CGBitmapContextCreate(m_imageData, m_width, m_height, 8, m_width*sizeof(uint32_t), colorSpace1, kCGBitmapByteOrder32Little|kCGImageAlphaNoneSkipLast);
CGContextSetInterpolationQuality(context1, kCGInterpolationHigh);
CGContextSetShouldAntialias(context1, YES);
CGContextTranslateCTM(context1, m_width/2, m_height/2);
CGContextRotateCTM(context1, -M_PI_2);
CGContextTranslateCTM(context1, -m_height/2, -m_width/2);
CGContextDrawImage(context1, CGRectMake(0, 0, m_height, m_width), [uiimage CGImage]);
}

This first detects which way round the iPhone thinks the photo is so we can do the right kind of rotation. It then uses CGContextTranslateCTM and CGContextRotateCTM to rotate and shift the image around in the image context space, before drawing the image into that space. Note that CGContextTranslateCTM is needed because CGContextRotateCTM rotates an image about its top left corner, not its centre. We therefore need to shift the image around if we’re ever going to see it.

The even weirder thing is that all this image rotation is unnecessary if you allow users to crop the image just after they’ve taken a photo, using the iPhone’s image picker. Obviously Apple built this kind of functionality into the image picker. The only problem with that route (which I used in my earlier Phlomo app) is that you end up with a rather small, poor quality image, and an extra unnecessary user step.

Flomo iphone app

icon.pngA few weeks ago I decided to start playing around with iPhone app development. It would, I thought, be a relatively straightforward thing. Even small children could do it.

But what to choose as a test project? Perhaps something stupid that made some kind of farty noise each time you shook your iPhone? Nah… build something useful Matthew. Something I and others like me would want to use.

Uploading images to Flickr seemed like a cool idea. There are some really nice apps out there that do this already. Hmmm…

Another thing was simple image manipulation. You know, make your crappy iPhone photos look like you took them with a Lomo ie turn them into something bad yet cool. Already done. Hmmm….

I know – combine the two! Brilliant idea! Let’s call it Flomo (flickr + lomo). Lame name – yes. Arsed to think up a better name – no. I even designed a funky logo (above).

Turning the idea into reality has proven to be somewhat more tricky than I’d thought. Trying to run before learning how to walk is a cliché that springs to mind. But it’s been a useful lesson in iPhone development.

Specifically it’s taught me:

1. How to access flickr’s API. Authentication with their API is like sticking hot pins in your arm at the best of times, never mind in an unfamiliar language (Objective-C).

2. Objective-C doesn’t have a simple way of doing MD5 hashes. It’s a pretty much build your own kind of thing. Ugh.

3. How to process images. Thanks to some online help and general banging-head-on-wall type thinking, I’ve finally realized that image processing isn’t all that hard. Neither is it easy. Finding stuff on forums like (I paraphrase) “listen you newbie scum, this kind of thing is so trivially easy I’m not even going to explain how to do it” didn’t help. But I got there. I’ll publish relevant bits of my code in the next post.

4. Multithreading is really useful. Do you want a nice spinny wheel thing while the image is uploading, so your user doesn’t think the app has broken? Well you *have* to use multithreading. Obvious if you know that it’s obvious. Like so much in iPhone world.

5. XML parsing? Not easy and not fun. Just parsing a simple web service response is bad enough. Making any sense at all of complex XML seems like far too much hard work. PHP SimpleXML – I love you!

There are all kinds of other bits and pieces which I’ve had “fun” with. I’ve probably implemented them really badly. But I don’t care. I have an iPhone app which works. Just a little more work and it’ll be ready to submit to Apple and wait months before it ever appears on the store for free.

Oh, and those news reports about small children coding for the iPhone? Two words: parental guidance.