November 25, 2004

First steps in XAML and SVG

As you read this, keep  in mind that I'm on my third Sierra Nevada Pale Ale. SN Pale Ale is, IMHO, one of the tastiest beers your money can buy.

I took my first steps in trying to understand how SVG and XAML can coexist. I'm not really interested in SVG, per say, but I have a nice tool for generating SVG and it's called Adobe Illustrator. Having this tool makes it very pressing for me to get SVG and XAML to play together. I could write a XAML exporter plugin for Illustrator and I might just do that. I downloaded the Illustrator CS SDK and it seems like an awesome SDK... to be continued.

Chris Anderson's XamlPad looks like a clone of the XamlPad application that's part of the Xamlon tool. They have an article on how to use their converter to convert SVG to XAML, but I want to do all of this myself so I'll kind of ignore that.

Now, the Xamlon tool is somewhat puzzling to me. Why the hell would they create a tool that WILL BE obsolete when Avalon on XP or Longhorn ships? Perhaps they see a 2-3 year market for which they think they can capitalize on? Perhaps they are building internal expertise and plan om developing a real XAML on Avalon product? Perhaps they want to be bought out by Microsoft? In any case the tool is impressive and in a vacuum seems like a no-brainer if you're currently developing apps in Visual Studio .NET 2003 and want to use XAML markup for your apps.

Ok, enough of that.

I created a simple polygon in Adobe Illustrator CS, that looks like so:

Star

I exported this as an SVG. There are a lot of options presented and I kind of chose the options that I thought would yield the cleanest SVG file. It just so happens that the options I chose were the same (or very similar) to the ones suggested on the Xamlon article (above). I won't go into that. In any case, this file was generated and attached.

If you look at the file, there is a lot of crap in there. Included in this crap is a whole thumbnail i mage which makes up for most of the file's size. Within all of this crap is the essence of the illustration, which is the following:

   <polygon fill="#8BD3E5" stroke="#0A50A1" points="125.623,186.813 75.582,145.052 12.81,162.6 37.063,102.102 0.977,47.826
    66.008,52.197 106.477,1.104 122.414,64.304 183.512,87.004 128.332,121.691 "/>

I typed this into CA's XamlPad and got some errors that were a cinch to fix. Xaml seems case sensitive and the Adobe Illustrator SVG plugin emits all-lowercase tags. Fixing these casing errors up, yielded something quite exciting:

Star_xamlpad

That's enough thinking for now.

Now playing: Spinecar - Release

Posted by Nick Codignotto at November 25, 2004 12:20 AM | TrackBack
Posted to Longhorn
Comments

Valid XHTML 1.0!   Valid CSS!