Posted by Elliot on May 9th, 2011

Set Clipboard (XAML) options

The initial task you need to perform before you copy XAML in Design is to make sure that the Clipboard (XAML) options are set so that your XAML code is copied correctly and will subsequently show up properly in Blend.

You reach the Clipboard (XAML) options from the Edit menu. Point to Options and click Clipboard (XAML).

The Clipboard (XAML) options.

First, select a clipboard format. You should be clear what type of Blend project that you want to paste to when you select a format:

• XAML Silverlight 4/ WPF Canvas Select this option if you want to paste objects that can be animated or manipulated interactively in a Silverlight 4 project or Windows Presentation Foundation (WPF) project in Expression Blend.
• XAML WPF Resource Dictionary Select this option if you want to paste your objects as a collection of resources that you want to use as a resource dictionary in a WPF project in Expression Blend. Resource dictionaries are a collection of custom files or styles that comprise the different design elements of your application. You can add a resource dictionary to any WPF project in Expression Blend, and then apply the brush resources in the resource dictionary to the brush properties of any object in the project.
• XAML Silverlight 3 Canvas Select this option if you want to paste objects that can be animated or manipulated interactively in Silverlight 3 project or Windows Presentation Foundation (WPF) project in Expression Blend.
• Group by This option only appears if you choose the XAML WPF Resource Dictionary format. You can choose from three options: Document, Layers, and Objects. Each option dictates how the objects in the resource dictionary will be grouped once you paste the copied object into Blend.

Here are the other options that you can adjust:

• Always name objects Select this option to give a default name to unnamed objects. The name appears in the XAML code.
• Place grouped objects in a XAML layout container Select to wrap each grouped object in your Expression Design document in a separate canvas layout panel.

The Text options determine how text in your objects will be handled. These options do not appear if you choose the XAML WPF Resource Dictionary format.

• Editable TextBlock Select this option to keep the text as individual, editable characters, even if the appearance of the text may change. Note that, as the message reads, you may lose some formatting in the conversion to XAML. Also, some fonts are not supported. For a complete list of the supported and unsupported text attributes, see the XAML text support topic in Help.
• Paths Select this option to convert each character to outlines. You will not be able to edit the text.
  

  Text options.

The Live effects options determine how Design handles the effects that you’ve applied to your objects.

• Rasterize all Select this option to rasterize your live effects. If you clear this check box, some objects might be exported as solid lines or fills.
• Convert to XAML effects Exports only those live effects currently supported by XAML code. As you can see in the below graphic, only Drop Shadow and Gaussian Blur will convert to XAML.
  

  Live effects options.

Copy XAML in Design

Now that you have set the XAML options, you are ready to copy your objects. Once you select the object, you have two choices of how to copy it, depending upon whether you want to paste code into a visual editor, or a text editor.

• If you will be pasting the objects into a visual XAML editor, such as in Design view in Blend, click Copy or Copy XAML on the Edit menu.
• If you will be pasting XAML code as text into a text editor, such as in XAML view in Expression Blend, click Copy XAML on the Edit menu to copy the ASCII version of the XAML code.
  

  Copying XAML from Design.

Paste XAML in Blend

Now you are ready to paste the object. If you are in a WPF project that is open in Expression Blend, then, depending upon the destination that you want for the object, you can do any of the following:

Choosing a new project in Blend.

• In Design, if you had set your Clipboard (XAML) settings to copy in one of the Silverlight/WPF Canvas formats, and you would like to paste the object into a Blend artboard, then, on the Edit menu, click Paste.
• In Design, if you had set your Clipboard (XAML) settings to copy in Silverlight/WPF Canvas formats and you would like to paste XAML c ode into the XAML editor, then you can place the cursor where you want to paste the code and perform the paste. Note that you need to be very sure that you paste the copied code into the proper location in the existing XAML to avoid a XAML error.
• In Design, if you had set your Clipboard (XAML) settings to copy in XAML WPF Resource Dictionary format, you have two choices:
  • If you had chosen to only copy the object (using the Copy command) then you can just select a node in the Resources panel, and then, on the Edit menu, click Paste.
  • If you had chosen to copy the XAML code (using the Copy XAML command) then you should open the XAML editor in Blend and then, on the Edit menu, click Paste.
    

    XAML pasted into Blend.

That’s all there is to it. Right after you paste your artwork Blend adds it to your project and saves it as a .png file into your project folder on your hard drive.

You can also paste slices as XAML objects into Blend, but that’s a nugget for another time. Thanks for reading.

Tags: Brush resources, graphics, images, Silverlight, WPF, XAML

This entry was posted on Monday, May 9th, 2011 at 3:57 pm and is filed under Expression Blend, Expression Design. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.