Inspired by watching a number of World Cup matches, I've created XAML drawing images representing the flags of the eight quarterfinalists in World Cup 2006. The images were created using Expression Graphic Designer and exported as DrawingImage resources. For more information on converting Graphic Designer content to XAML, see the Creating XAML Drawing Images with Graphic Designer posting.

At the bottom of this posting, you can find an attached XAML file (WorldCupSoccerFlags.xaml) that contain the flags defined as DrawingImage resources:

Flags of World Cup Soccer 2006

You may have noticed that there is an extra flag for the United Kingdom. I accidentally created this flag because I didn't realize at first that there is a separate English flag. I decided to include the UK flag with the other eight flags anyway, since I had spent time creating it! :-)

A Closer Look at the XAML Content
The WorldCupSoccerFlags.xaml file defines the flags as DrawingImage objects that are part of the Page.Resources content. The flag content is referenced by Image objects, using the Source property:

<Image
  Margin="20"
 
Height="240"
 
Source="{StaticResource Argentina_Flag}"
/>

Notice that the Image object's Height property determines the displayed size of the flag content. Since the flag content is a vector graphic, it scales nicely no matter the displayed size.

The Image objects containing the flag content are defined within a FlowDocument and FlowDocumentReader. These objects provide flow document features that allow you to resize and repaginate the contained content:

<FlowDocumentReader ViewingMode="Scroll">
  <
FlowDocument ColumnWidth="800.0"
>

  <
Paragraph
>
    Argentina
    <LineBreak
/>
    <
Image Margin="20" Height="240"

     
Source="{StaticResource Argentina_Flag}"/>
  </
Paragraph
>
    ...

  </FlowDocument>
</FlowDocumentReader>

Try resizing the flow document by moving the slider in the flow document reader tool bar:

DocumentReader viewer controls
FlowDocumentReader tool bar

Graphic Designer Info
The Expression Designers blog provides a lot of good info on how to use the Graphic Designer product.

Enjoy,
Lorin

About Us

We are the Windows Presentation Foundation SDK writers and editors.