Skip to content
Cecil Coupe edited this page Nov 6, 2015 · 15 revisions

Icons are used when packaging a Shoes app (replacing the Shoes icon). It's not a trivial process and some folks really really care about these things.

How hard is it to draw a picture? If you are graphically challenged (me) thats one problem. Then you have to create the right number of icon sizes in the correct formats and you have to bundle them. Did I mention you need Linux, OSX and Windows icons and a way on your system to do all three?

In Shoes 3.2 Windows icons have to be 8 bit (not 32 bit). For now, pretend that will be fixed in 3.3

I'm going to change the Shoes icon for 3.3 (Walkabout) below. Icons are bit map images not vector graphics and OSX thinks you need a 512 x 512 (x 32) so I'll start there. So I found an image I like on the interwebs for the backgroup, loaded it into Gimp, resized in to 512 px on the smaller dimensions did an elliptical selection of 512x512, crop, invert selection, add alpha channel and hit the delete key (clear background). Mind you this took many hours of failure. I get this:

Which is freakishly large for an icon but we'll resize later. Now I want to add the word "Shoes" to the icon in a tasteful Shoes-ful color with a font size of pretty big.

That doesn't completely suck, but my tolerance is high. Perhaps imagine an elliptical type base line that bows downward with some feathering and a drop shadow. Which might take a trip into Inkscape (svg editor for Linux) and back. One could also imagine, it's good enough for now.

We have our big 32 bit png. Let's convert it to Windows .ico and OSX .icns and make little pngs for Linux.

I used https://iconverticons.com/online/ to do the conversion for png. This particular icon sucks at small sizes, but they all do down there. The website created an .ico file that has 6 icons including a large 256x265X32

NOTE: the Linux file command says its 256 bit colors. That is incorrect. What's inside the file can be much different than what Linux reports. They have been 32 bit icons at small sizes for several years.

Windows

If you're reading this because you want a custom icon for the secondary or custom installer or you just want an icon for including in your app's directory so you can call `set_window_icon_path() then you've done enough. Stop reading.

If you are building your own Shoes or maintaining Shoes then changing the Shoes icon is, speaking politely, a bitch. You have to change the icons used by the NSIS installer (two+), the stub and you'll want to replace the installer background images and probably some other places.

app.yaml

First you need to change app.yaml or replace the icon there (my choice because I'm not creating a custom Shoes).

stub32.rc

In platform/msw/ is stub32.rc which you have to edit or you can just do the chicken thing and copy your new icon over that location (shoes/appwin32.ico) I chose copy over it because I don't want to fix shoes/appwin32.rc too.

You absolutely must rake stubs

NSIS bmp

The NSIS installer has two .bmp files it uses for the installer opening left side bar (installer-1.bmp) and it's progress bar (installer-2.bmp). You need to edit those. Caution: Gimp defaults to exporting a bmp that the NSIS installer can't use. When you get the little dialog for bmp options you need to set the 'do not add colorspace" option and make sure the bit depth is 24.

Clone this wiki locally