revUp - Updates and news for the LiveCode community
Issue 155 | August 23rd 2013 Contact the Editor | How to Contribute

Take A Stand Against Efficiency
Make iOS app images viewable again with this utility script

By Scott Rossi

Have you ever cleaned up your desk or a room, only to find you can't remember where your stuff is? Nobody really wants a messy room, but it's ironic that even in a cluttered mess, you'll often know where to find things. Or as comedian Bill Cosby once observed: "Everything is right where you put it." So maybe, in some cases, a little inefficiency is a good thing.

I recently had a need to preview all the images stored in a client's iOS app to determine what needed to be updated for an alternate version. Knowing a little about iOS files, I realized I could grab a copy of the ipa file, change its extension to ".zip", unzip the package in the Finder, and then use "Show Contents" to view all the files contained in the package. I easily found all the images I was after (almost 200) and copied these out to a new folder on the desktop.

But low and behold, when I tried to examine the images in Preview, more than half of them were unreadable! The images couldn't be opened by any of my trusty graphics apps, but most importantly, could not be viewed in LiveCode. Then I remembered that the process of creating an ipa file results in PNG images that are specially optimized for iOS and often can't be viewed through normal means. In other words, the PNGs are "too efficient".

I spent a couple of hours on the net looking for ways to fix the PNG images so I could preview them in LiveCode but had no success. I found blog posts with instructions that didn't work, tools that were either outdated or simply failed to operate, and tech notes that were over my head. There are dozens sites out there that talk about optimizing PNGs for applications, but only a few sites that mention "un-optimizing" them.

Eventually I came across a site that mentioned the xCode tool responsible for PNG optimization: pngcrush. When preparing an app for iOS distribution, this utility squashes PNGs, removing all but the most essential bits to keep them as efficient as possible. But in doing so, it often renders the PNGs unviewable in standard desktop applications.

When iOS developers discovered that they couldn't open their PNGs after including them in their apps, Apple added a command line option for pngcrush to remove the optimizations applied during the xCode build process, making the PNGs viewable once again. The basic details are here:

I don't do a lot of file processing in terminal, but I know that LiveCode can execute shell commands. So I started testing some scripts eventually found a recipe that would un-optimize PNGs from LiveCode. The following button script asks for a folder full of PNGs (extracted from an app), and a destination folder to save the un-optimized results. Note that if you've modified your xCode installation, you may need to hunt down the location of the pngcrush utility - it should be buried somewhere on your drive.

on mouseUp
   put  "/Applications/ \
/Developer/Platforms/iPhoneOS.platform/Developer/usr/bin/pngcrush" \
into crushPath
   if there is not a file crushPath then
      answer error \
            "Unable to locate pngcrush tool. Check location of xCode."
      exit mouseUp
   end if
   put crushPath && \
         "-revert-iphone-optimizations -q source.png destination.png" \
into theCommand
   put directory into D -- store the current directory
   answer folder "Locate folder containing PNG files:"
   if the result is "Cancel" then exit mouseUp
   put it into theSourceFolder
   set directory to theSourceFolder
   put the files into theList
   set directory to D -- restore the directory
   answer folder "Choose output folder:"
   if the result is "Cancel" then exit mouseUp
   put it into theDestinationFolder
   put 0 into theCount
   repeat for each line theFile in theList
      put theCommand into newCommand
      if char -4 to -1 of theFile is not ".png" then next \
            repeat -- ignore non-PNG files
      put q(theSourceFolder & "/" & theFile) into theSourceFile
      put q(theDestinationFolder & "/" & theFile) into \
      replace "source.png" with theSourceFile in newCommand
      replace "destination.png" with theDestinationFile in \
      get shell(newCommand)
      wait 20 millisecs with messages
      add 1 to theCount
      put theCount -- show processed file count in message box
   end repeat
   answer "PNGs have been fixed!"
end mouseUp

function q pString
   return quote & pString & quote
end q

Now you have a way to quickly process app PNGs for display in LiveCode. So it's quite likely your desktop will become cluttered with dozens of folders of un-optimized PNGs. But at least you'll know where to find your stuff. Because everything is right where you put it. Isn't it?

Scott Rossi

About the Author

Scott Rossi provides user experience design services and specializes in custom interface design. Over the past 20+ years, Scott has worked with a wide range of companies including Apple, Hewlett Packard, Intuit, Logitech, and Sony. His full client list is buried somewhere on his desk.

Main Menu

What's New

Summer School Rocks