I'm working on writing a rather basic app. It uses minimal touch input, and mostly just plays fancy animations. There isn't much animation, but the way it's currently done seems super inefficient and uses far too much memory.
The view is split into two parts, the bottom 1/5th is just one image that doesn't ever change. The rest of it is where the animation plays. It's currently done by loading the 32 images into an array and then playing through them (8fps). It does this a total of 4 times going through each animation. The pictures aren't huge, but they're still rather large. I was also wondering the best file format to store them as, both in terms of overall size and the overhead required.
This is a super simple approach, and it works, but it just doesn't seem to be cutting it memwise, it uses too much.
My suggestion was to split the animation up into some layers, because there's a few things I think could be done differently:
- Make the background one static image, so it doesn't have to be part of the animations
- Take out a few of the "doodads", such as moving graphs and a progress bar, and make those their own partially transparent layers, on top of or below the animations. This would also open up the door as far as creative freedom goes in the future for me.
- Cut out the text at the top and use the iPhone to programmatically display the text instead. Is it better to use the iPhone to draw the text or to load an image with text in it? Being primarily a Web Dev, I find it silly to load any images with text in them.
- Play what's left after these things are cut out as the animations, which would be considerably smaller.
So overall, we're looking at 1 static background, 3-5 small animations, and one large one. Can I use layers to make these elements all separate, and rely more on the iPhone to draw the final image? That was where I thought I could have this run a little better, it seems silly to merge everything into one big picture that you flip through like a flip book, when you can instead load a few smaller elements that are used app-wide, and do things quite a bit more efficiently.
Or, am I totally overcomplicating this and is there a better way to go about it?
Edit: I've been browsing around and it appears that using layers would be more efficient. I also have another question, though. Is it better to have each frame of the animation as it's own file, and loaded into the array for animation, or to have one giant sprite sheet image with all the frames, and have the iPhone grab each frame from within the sprite sheet using coordinates programmatically?
Edit 2: We've since worked everything out, check it out on the App store.