Was this page helpful?
Your feedback about this content is important. Let us know what you think.
Additional feedback?
1500 characters remaining
Export (0) Print
Expand All

Import an Adobe Illustrator file

Expression Studio 4.0

You can import PDF-compatible Adobe Illustrator files (.ai) directly into an open document in your Microsoft Expression Blend project.

When you import an Illustrator file into Expression Blend, Illustrator layers, groups, and objects are converted to Expression Blend containers and objects with associated properties. Understanding how Illustrator objects are imported into Expression Blend will help you integrate Illustrator files into your Expression Blend projects more quickly and efficiently.

When you save your file in Illustrator, make sure that the Create PDF Compatible File check box is selected in the Illustrator Options dialog box. Otherwise, you will not be able to import your Illustrator files into Expression Blend.

Create PDF Compatible File check box

To import an Illustrator file

  1. Open the document into which you want to import the .ai file.

  2. On the File menu, click Import Adobe Illustrator File.

  3. In the Import Adobe Illustrator File dialog box, locate the Illustrator file that you want to import, and click Open.

  4. Click OK.

A new Canvas object with the same name as your imported file is added to your document. In the Objects and Timeline panel, under the Canvas object (named AvatarSymbols in this example), are all of the Illustrator objects imported as Expression Blend objects. If images are imported as a part of your .ai file, a new folder (named AvatarSymbols_Images in this example) is created in the root folder in the Projects panel to contain all the converted image files.

NoteNote

If there are no images associated with your project, a folder will not be created in the Projects panel.

Adobe Illustrator import in Expression Blend

You can also create a custom folder in the Project folder for any images that are associated with your .ai file.

To create a custom images folder

  1. In the Projects panel, right-click the .csproj file, and then click Add New Folder.

  2. Type a name for the new folder in the folder name box.

  3. With the folder selected in the Projects panel, import the Illustrator file by following the steps in the preceding procedure entitled "To import an Illustrator file."

Layers, groups, and objects

Expression Blend imports Illustrator layers and groups as nested XAML Canvas objects containing paths and images. Nested Canvas objects are used as layout containers to make them easier to work with in Expression Blend. The following information will help you understand how to work with Illustrator files after they are imported.

Layer names

Layer names are preserved for the top-level groups (Avatars in the preceding image). After you import your Illustrator file into Expression Blend, you can change the name by right-clicking the object in the Objects and Timeline panel and then clicking Rename, or by double-clicking the object name and then typing directly in the object name field.

File structure and groups

Illustrator groups do not exist in PDF-compatible files, so are not imported into Expression Blend. However, the objects contained within an Illustrator group are imported as individual objects with the same positioning as in the Illustrator group.

Object types

Images are imported as PNG files and are added to an images folder in the Project panel, and added as Image objects in the Objects and Timeline panel. Text and vector objects are imported as editable paths and appear in the Objects and Timeline panel.

Visibility and lock

Visibility settings for Illustrator layers imported into Expression Blend are preserved. However, only visible objects within layers are imported. You can change which objects are imported into Expression Blend by changing the visibility settings of the objects within each layer in Illustrator.

Lock settings are ignored.

Editable content

If the imported content is editable, you can modify the appearance of the content in Expression Blend by modifying the object properties. The following table describes Illustrator elements that are editable in Expression Blend. Use the Description column to locate the properties for the object in order to modify them in Expression Blend.

Illustrator element

Expression Blend element (XAML)

Description

Group

Canvas

Illustrator groups are ignored. However, the content of the group is imported as individual objects in the Objects and Timeline panel.

Text (type objects)

Canvas

An Illustrator type object is imported as a Canvas object named TextBlock with the original Illustrator text imported as Path objects. Text styles are imported as separate Path objects.

For example, a 5-letter word with a Strikethrough style applied is imported as a Canvas object containing 6 paths, one path for each letter of the word, and an additional path for the Strikethrough style.

Stroke

Path

An Illustrator stroke is imported as a path with the Stroke properties mapped to the Stroke brush in the Properties panel in Expression Blend.

Solid color fill

Path

An Illustrator solid color fill is imported as a Path with the original Fill property mapped to Expression Blend Color properties applied to a Solid color brush.

Solid color brush properties are located in the Brush category of the Properties panel.

Linear gradient fill

Path

An Illustrator linear gradient fill is imported as a Path with the original Fill property mapped to Expression Blend Linear gradient brush properties applied to a Gradient brush.

Linear gradient brush properties are located in the Brush category of the Properties panel.

Radial gradient fill

Path

An Illustrator radial gradient fill is imported as a Path with the original Fill property mapped to Expression Blend Radial gradient brush properties applied to a Gradient brush.

Radial gradient brush properties are located in the Brush category of the Properties panel.

Image layer

Image

An image object in Illustrator is imported as an Image object in Expression Blend. In addition, a PNG file is added to the project. The PNG file is the source for the Image object.

Custom fill

OpacityMask applied to an ImageBrush

Illustrator supports multiple fills for an individual object. If a second fill is applied to an object in Illustrator, and that fill contains an alpha channel, the fill is imported as an OpacityMask applied to an ImageBrush. For best results, use only one fill acting as an opacity mask in your Illustrator file.

OpacityMask properties are located in the Brushes category in the Properties panel. In addition, a PNG file is added to the project. The PNG file is the source for the ImageBrush.

NoteNote
You can verify whether or not a second fill has been applied to an object by viewing the object properties in the Appearance panel in Illustrator.

Clipping mask

Clip property

An Illustrator clipping mask is imported as a Clip property.

Clip properties are located in the Miscellaneous category in the Properties panel.

NoteNote
The Clip property has limited support in Windows Phone projects.

Illustrator feature support in Expression Blend

The following Illustrator features are supported in Expression Blend. Where noted, features can be edited in Expression Blend.

NoteNote

Although Expression Blend supports the following Illustrator features, for best results, create your Illustrator file using only vector art.

Text

Text layers imported from Illustrator are converted to a canvas, and each character is a separate path object that is a child of the canvas. The appearance of the text is maintained, but is no longer editable as text after it is imported.

If a single text layer in Illustrator contains hard returns, the text associated with each paragraph break will be imported as a separate canvas object when imported into Expression Blend.

important noteImportant

You may experience unexpected results when you import text from Illustrator. These results can include unexpected character rotation, kerning, point sizes, and alignment.

Text styles

The following Illustrator text effects create individual paths when imported into Expression Blend.

  • Subscript

  • Superscript

  • StrikeThrough

  • Underline

  • SmallCaps

  • AllCaps

Effects

Effects are supported, but not editable, in Expression Blend. Effects are rasterized and imported as Image objects. A PNG file is used as the source for the image object, and is located in the folder that is created in the Project panel.

Gradients

Expression Blend supports the importing and editing of linear and radial gradients. Color stops are imported as gradient brushes to the Fill property of the resulting object in Expression Blend, and opacity stops are imported as gradient brushes to the OpacityMask property.

Strokes

Custom strokes are imported as individual paths.

When you save an Illustrator file in PDF-compatible format, strokes and fills are saved as separate paths. When you import a PDF-compatible file into Expression Blend, a stroke and a fill on the same object may also be imported as separate objects. However, if the stroke and the fill are identical, the stroke and the fill may be merged into a single object when imported into Expression Blend.

See also

Send feedback about this topic to Microsoft. © 2011 Microsoft Corporation. All rights reserved.
Show:
© 2015 Microsoft