Friday, June 26, 2009

Creating TIF files with multiple images

So, in overhauling Scrivener's toolbar graphics and other graphic elements for 2.0, I noticed that a lot of OS X apps handle toolbar images a little more elegantly than Scrivener 1.x. Scrivener's toolbar looks fine when the icon size is set to normal, but if you set the it to use the small image size, the images get rescaled and don't look so hot. A lot of apps - look at Pages for instance - look great at both sizes, because they provide custom images for each rather than just allowing the toolbar to scale the larger images down when the small size option is selected. with Scrivener 1.x, though, I only created images for the larger size.

I was waiting on overhauling images such as these to see if Snow Leopard introduced resolution independence - when that comes just about every image in every OS X app is going to need recreating at a much larger scale by professional artists. But seeing as that doesn't seem to be on the agenda for 10.6 (which makes me sigh with relief as a developer even if the end-user part of me would like to see it), I have started in on overhauling the icon set.

The way OS X toolbars handle selecting the small or large image for a particular toolbar icon is to look in the one image file for both images; that is, it expects both images to be bundled into the same .tif or .icns file (the larger one at 32x32 pixels and the smaller one at 24x24). OS X comes with a tool that will create .icns files easily enough, but being obtuse I decided I wanted to keep the toolbar icons as .tif files (which is how most Apple apps do it). The trouble is, Photoshop doesn't support .tif files containing multiple images. So I Googled around to find a tool which would, but either my search terms were rubbish or the only tools that really do this sort of thing are paid-for, fully-featured apps, and I realised I could write my own tool to do this much more quickly than I could find one from searching through Google results - after all, all it needs to do is take two image files already created in Photoshop, one for the small size and one for the larger size, and bundle them both into the one .tif file.

So, here is my ten-minute app that does exactly this:

It's pretty self-explanatory - you just drag a 32x32 image into the 32x32 image well and a 24x24 image into the 24x24 well, and then hit Save to create a .tif file that combines the two, suitable for use in toolbars.

EDIT: I've updated it so that you can open existing multi-page .tif files and export the small or large icons out as separate files.

Who knows, maybe it will come in useful for somebody else putting their toolbar images together. Probably not; given that a lot of developers do this already, presumably there is already an abundance of tools out there that do this that I just missed, but it was a diverting ten-minute break from the intense coding I'm doing on Scrivener 2.0 at the moment. Which rocks, by the way.


Blogger Pieter Omvlee said...

I had the exact same problem just last week. It seems I was a little more succesful with googling; I found an app named CocoViewX. Apart from doing a lot of stuff that I don't need, it does create multi-layer tifs.
Your app is way more elegant though.

3:25 pm  
Blogger kayembi said...

Thanks. To be honest I didn't spend much time googling at all, as I knew it would be a quick app to make myself and sometimes I just enjoy throwing a quick and simple utility together. It's a pity Icon Composer doesn't save to multi-layered tif files as well as .icns, as that's the first thing I tried. I'll take a look at CocoViewX, though.
All the best,

3:43 pm  

Post a Comment

Links to this post:

Create a Link

<< Home