Mobile app version of vmapp.org
Login or Join
Rivera951

: Exporting iconsets to XAML I am currently working on a GUI and iconset in Illustrator which will be exported (using a plug-in) to XAML. While GUI elements can be exported by placing them in

@Rivera951

Posted in: #AdobeIllustrator #Icon

I am currently working on a GUI and iconset in Illustrator which will be exported (using a plug-in) to XAML.

While GUI elements can be exported by placing them in a new file, this becomes a lot of work with iconsets. Which I want to avoid. So I am looking for a streamlined workflow to export multiple groups/artboards/layers (similar to Export for Web & Devices) for XAML (the plug-in does not support "use artboards").

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Rivera951

1 Comments

Sorted by latest first Latest Oldest Best

 

@Rivera951

My own solution:


Spread icons on a grid. Designing the icons on an artboard that
perfectly fits the grid helps streamlining this process (e.g. for
adding new icons later).
Keep all icons on a "icons" layer. This makes them identifyable in
the final file as this will result in an icon canvas in XAML.
Keep squares that determine canvas size on "backgroud" layer.
Without this "helping layer", the canvas would be set to the
dimensions of the icon, which can vary.
Duplicate the squares and create artboards from those shapes. There
are other ways to create multiple artboards, this seems to be the
fastest one.
Rename artboards according to layer.
Export to Illustrator EPS, make sure to selecte "use artboards".
Record an Action of exporting (e.g. a sample file) to XAML.
Make sure to not rename the file when doing this. There seems to
be a difference between renamed and not renamed. So if renaming is
part of the recorded action, all files will have the same name.
Which you want to avoid.
Select "Batch" from the Action dropdown menue to apply the recorded
Action to a folder (with the eps files).


File and canvas names:

Names of renamed artboards are carried over to filenames (unnamed ones carry only the number) when exporting to Illustrator EPS. Resulting in properly named EPS files filename_artboard.eps.

Each layer creates a canvas in XAML. Additionally, layer names as well as group/path names are addes as comment to the coherent canvas, looking like this: <!-- layer/group -->

So the most time-consuming is the renaming of artboards and groups as one is for filenames and the other for canvas comments.

Here is an example result:

<Canvas Width="32.000" Height="32.000">

<Canvas>
<!-- background/square -->
<Path Opacity="0.0" ... />
</Canvas>

<Canvas>
<!-- icon/fantastic -->
<Path ... />
</Canvas>

</Canvas>


Note that the layer order is reversed, but the visibility stays the same (as in Illustrator). This is not a bug.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme