Advertisement

Extracting icons from a single image



Extracting icons from a single image


Question

I have purchased a set of icons.

In the package there are five files that contain all the icons, assembled on a regular grid in different file formats.

The file formats are .ai, .eps, .pdf, .png, .psd.

I need the icons to use in an android application I'm writing. I need around twenty of them at different resolutions (32x32, 48x48, 64x64 & 96x96), in .png format.

The only way I know to extract the single icons is to do it by hand, but it would be a tedious and error-prone way.

Is there an automatic method, or a better way of getting the icons out of the files, at the various resolution I need?

What software will I need?

Ps. The icons i need to obtain have the following format:

sample android icon

As you can see, the icon is centered in a 64x64 bitmap. I have colored red the transparent part of the image to make it more visible.

2013/06/22
1
3
6/22/2013 11:12:00 AM

Accepted Answer

Export objects from Inkscape as bitmaps

To export a vector object imported in Inkscape as a bitmap of defined pixel size we need the following steps:

Case source icons include background

  1. Select the object with the select tool.

    enter image description here

  2. Export the object as bitmap ("File - Export Bitmap...").

    enter image description here

  3. Choose ""Export area - Selection" to only export the object.

  4. Define the pixel size (above 64 x 64) for the resulting bitmap.
  5. Choose a path and a filename for export.

  6. Done.

    enter image description here

Note: There is a batch option in Inkscape for exporting multiple selected objects in the "Custom" option but this will not let you define a fixed pixel size for each object.

Case source icon objects only

In case the source icons do not include a square box with margins the above steps will lead to a distorted icon when the object has a with different to height. We then need an additonal step to get desired results.

  1. Select object with the select tool.
  2. Copy the object to clipboard.
  3. Open a new document having the size of the source icons. In Inkscape you will have predefined layouts in the File - New menu (here I took icon_32x32).
  4. Paste the clipboard content to the new document.

enter image description here

  1. Align the icon, e.g. to the center using the "Object - Align and Distribute..." tool.
  2. Export the page as bitmap with "File - Export Bitmap...".
  3. Choose "Page" and the desired bitmap sizes in the opening dialog (see above). We can export all sizes consecutively.

enter image description here 32 enter image description here 64 enter image description here 128

2013/06/22
3
6/22/2013 1:47:00 PM