Convert XAML Vector Graphic to PNG

Dirk Bahle

Rate me:

4.87/5 (11 votes)

23 Oct 2012CPOL12 min read

74.5K

6.8K

An introduction to the usage of vector graphics as a source of bitmap graphics.

OpenIconLibrary.zip
TangoProject.zip
XAMLtoPNG.zip
- XAMLtoPNG.sln
- XAMLtoPNG
  - Params.cs
  - Program.cs
  - Properties
    - AssemblyInfo.cs
  - XAMLtoPNG.csproj
  - XAMLtoPNG.csproj.user
  - XamlToPngConverter.cs
XAMLToPNG_Sample.zip
- 00_Go up
  - 980b4f92-db2c-46f8-83ca-042b70ced31a.png
  - go-up.Canvas.backup
  - go-up.Canvas.xaml
- 00_letter.Canvas.xaml
- 01_mail forward
  - bc241dff-27e2-42a4-b252-35a170dc68d6.png
  - ForwardArrow.Canvas.xaml
  - mail-forward.Canvas.xaml
  - UpwardArrow.Canvas.xaml
- 01_protect.Canvas.xaml
- 02_letter-protect.Canvas.xaml
- 02_tango network wireless encrypted
  - 9d7bd680-e0c7-4038-ab20-cb7bf590f0ef.png
  - network-wireless-encrypted.Canvas.xaml
- 03_letter-protect.Canvas.xaml
- Convert.bat

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Canvas Canvas.Left="1.02563042303132" Canvas.Top="-7.01808452606201">
    <Canvas>
      <Canvas>
        <Rectangle Stroke="{x:Null}" Width="1339.6335" Height="478.35718" Opacity="0.40206185" Canvas.Left="-1559.2523" Canvas.Top="-150.69685">
          <Rectangle.Fill>
            <LinearGradientBrush StartPoint="507.316899099553,4.42934847058041E-05" EndPoint="507.316899099553,478.357303090243" MappingMode="Absolute" SpreadMethod="Pad">
              <LinearGradientBrush.GradientStops>
                <GradientStop Color="#00000000" Offset="0" />
                <GradientStop Color="#FF000000" Offset="0.5" />
                <GradientStop Color="#00000000" Offset="1" />
              </LinearGradientBrush.GradientStops>
            </LinearGradientBrush>
          </Rectangle.Fill>
        </Rectangle>
        <Path Data="F1M-219.61876,-150.68038C-219.61876,-150.68038 -219.61876,327.65041 -219.61876,327.65041 -76.744594,328.55086 125.78146,220.48075 125.78138,88.454235 125.78138,-43.572302 -33.655436,-150.68036 -219.61876,-150.68038z" Stroke="{x:Null}" StrokeThickness="1" Opacity="0.40206185">
          <Path.Fill>
            <RadialGradientBrush Center="605.71429,486.64789" RadiusX="117.14286" RadiusY="117.14286" GradientOrigin="605.71429,486.64789" MappingMode="Absolute">
              <RadialGradientBrush.GradientStops>
                <GradientStop Color="#FF000000" Offset="0" />
                <GradientStop Color="#00000000" Offset="1" />
              </RadialGradientBrush.GradientStops>
              <RadialGradientBrush.Transform>
                <MatrixTransform Matrix="2.77438902854919,0,0,1.9697060585022,-1891.63305664063,-872.885375976563" />
              </RadialGradientBrush.Transform>
            </RadialGradientBrush>
          </Path.Fill>
        </Path>
        <Path Data="F1M-1559.2523,-150.68038C-1559.2523,-150.68038 -1559.2523,327.65041 -1559.2523,327.65041 -1702.1265,328.55086 -1904.6525,220.48075 -1904.6525,88.454235 -1904.6525,-43.572302 -1745.2157,-150.68036 -1559.2523,-150.68038z" Stroke="{x:Null}" StrokeThickness="1" Opacity="0.40206185">
          <Path.Fill>
            <RadialGradientBrush Center="605.71429,486.64789" RadiusX="117.14286" RadiusY="117.14286" GradientOrigin="605.71429,486.64789" MappingMode="Absolute">
              <RadialGradientBrush.GradientStops>
                <GradientStop Color="#FF000000" Offset="0" />
                <GradientStop Color="#00000000" Offset="1" />
              </RadialGradientBrush.GradientStops>
              <RadialGradientBrush.Transform>
                <MatrixTransform Matrix="-2.77438902854919,0,0,1.9697060585022,112.762298583984,-872.885375976563" />
              </RadialGradientBrush.Transform>
            </RadialGradientBrush>
          </Path.Fill>
        </Path>
        <Canvas.RenderTransform>
          <MatrixTransform Matrix="0.0245273988693953,0,0,0.0208675786852837,45.6905403137207,36.1535987854004" />
        </Canvas.RenderTransform>
      </Canvas>
      <Path Data="M11.28569,8.018085C10.66069,8.018085 10.254441,8.308265 10.004442,8.861838 10.004441,8.861838 3.5356915,25.965402 3.5356915,25.965402 3.5356915,25.965402 3.2856915,26.636961 3.2856915,27.746652 3.2856915,27.746652 3.2856915,37.39662 3.2856915,37.39662 3.2856915,38.479233 3.943477,39.021622 4.9419415,39.02162L43.50444,39.02162C44.489293,39.02162,45.09819,38.30344,45.09819,37.17787L45.09819,27.527902C45.09819,27.527902,45.204153,26.757479,45.00444,26.215402L38.28569,9.018089C38.101165,8.506182,37.648785,8.029991,37.16069,8.018085L11.28569,8.018085z" Fill="{x:Null}" Stroke="#FF535353" StrokeThickness="2" StrokeStartLineCap="Round" StrokeEndLineCap="Round" StrokeDashCap="Round" StrokeLineJoin="Round" StrokeMiterLimit="4" />
      <Path Data="M3.2735915,27.052276L4.0381936,26.360061 41.647883,26.422561 45.11029,26.739859 45.11029,37.178391C45.11029,38.30396,44.503272,39.021722,43.518419,39.021722L4.9354314,39.021722C3.9369667,39.021722,3.2735915,38.479671,3.2735915,37.397058L3.2735915,27.052276z" Stroke="{x:Null}" StrokeThickness="1">
        <Path.Fill>
          <LinearGradientBrush StartPoint="7.6046205,28.5366389974067" EndPoint="36.183067,40.9993979974067" MappingMode="Absolute" SpreadMethod="Pad">
            <LinearGradientBrush.GradientStops>
              <GradientStop Color="#FFBBBBBB" Offset="0" />
              <GradientStop Color="#FF9F9F9F" Offset="1" />
            </LinearGradientBrush.GradientStops>
          </LinearGradientBrush>
        </Path.Fill>
      </Path>
      <Path Data="M3.5490842,25.969868C2.8347985,27.434154 3.5484686,28.362725 4.5847985,28.362725 4.5847985,28.362725 43.584797,28.362725 43.584797,28.362725 44.703844,28.338915 45.430035,27.35082 45.013368,26.219867L38.299082,9.009162C38.114558,8.497255,37.64432,8.021063,37.156225,8.009158L11.299083,8.009158C10.674083,8.009158 10.263369,8.312731 10.01337,8.866304 10.01337,8.866304 3.5490842,25.969868 3.5490842,25.969868z" Stroke="{x:Null}" StrokeThickness="1">
        <Path.Fill>
          <RadialGradientBrush Center="15.571491,2.958519" RadiusX="20.935817" RadiusY="20.935817" GradientOrigin="15.571491,2.958519" MappingMode="Absolute">
            <RadialGradientBrush.GradientStops>
              <GradientStop Color="#FFE4E4E4" Offset="0" />
              <GradientStop Color="#FFD3D3D3" Offset="1" />
            </RadialGradientBrush.GradientStops>
            <RadialGradientBrush.Transform>
              <MatrixTransform Matrix="1.28624200820923,0.781697988510132,-0.710781991481781,1.16955196857452,-2.35434794425964,-4.82139778137207" />
            </RadialGradientBrush.Transform>
          </RadialGradientBrush>
        </Path.Fill>
      </Path>
      <Path Data="M43.562434,27.674347C43.562434,27.674347 5.4437179,27.674346 5.443718,27.674347 4.1544861,27.674347 3.5317878,27.437788 3.3154731,26.894679 3.4072345,27.839011 4.1854847,28.455597 5.443718,28.455597 5.4437179,28.455596 43.562434,28.455597 43.562434,28.455597 44.638441,28.422526 45.301832,27.596846 45.047181,26.300495 44.913133,27.142077 44.470547,27.646437 43.562434,27.674347z" Fill="#FFFFFFFF" Stroke="{x:Null}" StrokeThickness="1" />
      <Path Data="F1M38.34467,9.2120874C38.34467,9.2120874 44.5,24.75 44.5,24.75 43.881282,24.352252 43.618718,24.036612 43,24.125L5.25,24.125C4.5428932,24.125,3.8383883,24.875,3.8383883,24.875L10.125,8.875C10.258882,8.3753463,10.748699,8.0732233,11.411612,8.0732233L36.830806,7.984835C38.156631,8.1616117,38.123699,8.593369,38.34467,9.2120874z" Stroke="{x:Null}" StrokeThickness="1">
        <Path.Fill>
          <LinearGradientBrush StartPoint="34.420757,22.70549" EndPoint="16.12734,10.596288" MappingMode="Absolute" SpreadMethod="Pad">
            <LinearGradientBrush.GradientStops>
              <GradientStop Color="#FF7A7A7A" Offset="0" />
              <GradientStop Color="#FFA5A5A5" Offset="1" />
            </LinearGradientBrush.GradientStops>
          </LinearGradientBrush>
        </Path.Fill>
      </Path>
      <Path Data="M44.707773,25.362009C44.373548,25.128501 44.0728,25.167489 43.51824,25.139579 43.51824,25.139579 4.7366112,24.874414 4.7366112,24.874414 4.162087,24.918608 3.4957121,25.684093 3.4957121,25.684093 3.4957121,25.684093 4.0667741,24.284062 4.0667741,24.284062 4.0667741,24.284062 4.4064556,23.120892 5.6646889,23.120892 5.6646888,23.120893 42.855327,23.120892 42.855327,23.120892 43.577781,23.153963 44.02256,23.550547 44.207491,24.01646L44.707773,25.362009z" Fill="#FF686868" Stroke="{x:Null}" StrokeThickness="1" />
      <Path Data="M11.642515,8.47118C11.040823,8.47118 10.649724,8.750539 10.409049,9.283467 10.409048,9.283467 3.9940341,25.874196 3.9940341,25.874196 3.9940341,25.874196 3.7533573,26.520711 3.7533573,27.589019 3.7533573,27.589019 3.7533573,36.879115 3.7533573,36.879115 3.7533573,38.233855 4.1974134,38.506014 5.3478414,38.506014L43.034746,38.506014C44.357872,38.506014,44.569062,38.189617,44.569062,36.668522L44.569062,27.378426C44.569062,27.378426,44.671072,26.636735,44.478807,26.114873L37.885616,9.308891C37.707973,8.816075,37.334964,8.482641,36.865071,8.47118L11.642515,8.47118z" Fill="{x:Null}" StrokeThickness="1.00000023841858" StrokeStartLineCap="Round" StrokeEndLineCap="Round" StrokeDashCap="Round" StrokeLineJoin="Round" StrokeMiterLimit="4">
        <Path.Stroke>
          <LinearGradientBrush StartPoint="12.378357,4.48859899740672" EndPoint="44.0961,47.6760989974067" MappingMode="Absolute" SpreadMethod="Pad">
            <LinearGradientBrush.GradientStops>
              <GradientStop Color="#FFFFFFFF" Offset="0" />
              <GradientStop Color="#00FFFFFF" Offset="1" />
            </LinearGradientBrush.GradientStops>
          </LinearGradientBrush>
        </Path.Stroke>
      </Path>
      <Canvas>
        <Rectangle RadiusX="0.1" RadiusY="0.1" Stroke="{x:Null}" Width="37.930714" Height="3.8650389" Canvas.Left="5.3414402" Canvas.Top="32.363384">
          <Rectangle.Fill>
            <LinearGradientBrush StartPoint="20.4437888,0" EndPoint="20.4437888,3.306832" MappingMode="Absolute" SpreadMethod="Pad">
              <LinearGradientBrush.GradientStops>
                <GradientStop Color="#79000000" Offset="0" />
                <GradientStop Color="#00000000" Offset="1" />
              </LinearGradientBrush.GradientStops>
            </LinearGradientBrush>
          </Rectangle.Fill>
        </Rectangle>
        <Canvas.RenderTransform>
          <MatrixTransform Matrix="0.828197002410889,0,0,0.61023998260498,4.17600011825562,11.1614303588867" />
        </Canvas.RenderTransform>
      </Canvas>
      <Path Data="M8.625,33.25C8.625,33.25 9.0696486,34.066942 9.8651437,34.022748 9.8651437,34.022748 40.715385,34 40.715385,34 40.671191,31.56932 40.027885,30.88143 40.027885,30.88143L40.0625,33.3125 8.625,33.25z" Fill="#B6FFFFFF" Stroke="{x:Null}" StrokeThickness="1" Opacity="0.71428573" />
      <Path Data="M42,33.984375A0.984375,0.984375,0,1,1,40.03125,33.984375A0.984375,0.984375,0,1,1,42,33.984375z" Stroke="{x:Null}" StrokeThickness="1">
        <Path.Fill>
          <RadialGradientBrush Center="40.796875,33.734375" RadiusX="0.984375" RadiusY="0.984375" GradientOrigin="40.796875,33.734375" MappingMode="Absolute">
            <RadialGradientBrush.GradientStops>
              <GradientStop Color="#FFFFFFFF" Offset="0" />
              <GradientStop Color="#FF6F6F6F" Offset="1" />
            </RadialGradientBrush.GradientStops>
            <RadialGradientBrush.Transform>
              <MatrixTransform Matrix="1.25396800041199,-7.21821233562675E-15,7.21821233562675E-15,1.25396800041199,-10.3611097335815,-8.56746006011963" />
            </RadialGradientBrush.Transform>
          </RadialGradientBrush>
        </Path.Fill>
        <Path.RenderTransform>
          <MatrixTransform Matrix="1.38095200061798,0,0,1.38095200061798,-15.625,-10.9464302062988" />
        </Path.RenderTransform>
      </Path>
    </Canvas>
  </Canvas>
</Canvas>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Written By

Dirk Bahle

Germany

The Windows Presentation Foundation (WPF) and C# are among my favorites and so I developed Edi

and a few other projects on GitHub. I am normally an algorithms and structure type but WPF has such interesting UI sides that I cannot help myself but get into it.

https://de.linkedin.com/in/dirkbahle

Convert XAML Vector Graphic to PNG

License

Comments and Discussions