Simplify using 2D graphics in WPF and Silverlight

Ab2d Overview diagram

Push your applications to the next level - forget bitmaps - use vector elements. And use your favorite vector drawing application to achieve the best results.

The following diagram shows how it is possible to import 2D vector drawing from almost any drawing application into WPF or Silverlight world - by converting it to xaml with ViewerSvg or Paste2Xaml. WPF applications can use Ab2d.ReaderSvg or Ab2d.ReaderWmf libraries to import the data at runtime.

ViewerSvg
ViewerSvg screenshot

ViewerSvg is a svg to xaml converter application. It is using the Ab2d.ReaderSvg library that imports objects from svg or svgz and can export them into XAML for WPF or Silverlight.

For example the following XAML reads myClipart.svg (see Ab2d.ReaderSvg for more):
<ab2d:SvgViewbox Source="samples/myClipart.svg"/>


Svg ResourceDictionaryWriter sample application

The prefered way of storing cliparts in WPF is to use ResourceDictionaries. To simplify creating ResourceDictionaries from svg files there is a ResourceDictionaryWriter sample application. It is available with full source code, so it can be fully customized.

More about usage of ResourceDictionares can be found on the Microsoft's MSDN.

The following screenshot shows SVG ResourceDictionaryWriter application with three svg files added to the ResourceDictionary (xaml of ResourceDictionary can be seen on the right):
Svg ResourceDictionaryWriter screenshot


ReaderSvg Sample application:

ReaderSvg Sample application (click to see larger image)   ReaderSvg Sample application (click to see larger image)
I think a good sample can best describe features of the library. So be sure to get a demo application that demonstrates how simple is to create great animated effects, scalable vector elements according to the window size, add triggers to some elements and more. The sample is available with full source code.

More about ReaderSvg usage can be found in its section.



Paste2Xaml
Main Paste2Xaml window

Paste2Xaml is a WPF application that can read Windows metafiles (wmf), Enhanced Metafiles (emf) or get matafile objects from clipboard and can convert them into xaml. It can also export embedded images that can be used in exported xaml.

It is using the Ab2d.ReaderWmf library that imports metafiles at runtime and also defines controls that can be used in xaml.

More screenshots and sample images about Paste2Xaml can be found in its section. For runtime usage notes see ReaderWmf section.

For example the following XAML reads myClipart.emf (see Ab2d.ReaderWmf for more):
<ab2d:WmfViewbox Source="samples/myClipart.emf"/>

With Ab2d.ReaderWmf library it is also possible to build ResourceDictionares from metafiles. This means all metafiles are converted into xaml which makes them much more efficient and easier to use.

To make building ResourceDictionares there is a ResourceDictionaryWriter sample application that is available with full source code so it can be fully customized. The following screenshot shows ResourceDictionaryWriter application with three metafiles added to the ResourceDictionary (xaml of ResourceDictionary can be seen on the right):

ResourceDictionaryWriter screenshot


ZoomPanel
ZoomPanel sample screenshot

ZoomPanel is a WPF custom control that provide powerful and animated zooming and panning capabilities to any WPF application.



For usage of Paste2Xaml and ViewerSvg see also the following tutorials:

Silverlight Excel   Silverlight Excel 
How to convert an excel graph with Paste2Xaml to a Silverlight application. To show the power of Silverlight we add a starup animation and a dynamicaly showing graph data on moving the mouse over graph's bars. The tutorial can be also used for WPF applications.
     
Silverlight EU Countries   Silverlight EU Countries
How to convert a map of EU countries in svg file to a Silverlight application with ViewerSvg. The tutorial will also show how to read the data from xml file and how to use data binding. The application will show the basic data about the country that is selected with the mouse. There is also a slider that shows when the countries were joining the EU.

 

Also check out the Links section for links to free online svg libraries and svg editors.

 

Note: Subscribe to RSS feed or submit your email on downloads section to be informed about new content on the site.

Please promote the site by linking to it or by increasing its rating on dotnetkicks - click on image:
kick it on DotNetKicks.com
Copyright © 2006-2009 Andrej Benedik s.p. All Rights Reserved.