Click here to Skip to main content
15,896,440 members
Articles / Desktop Programming / WPF

Convert XAML Vector Graphic to PNG

Rate me:
Please Sign up or sign in to vote.
4.87/5 (11 votes)
23 Oct 2012CPOL12 min read 74.5K   6.8K   43  
An introduction to the usage of vector graphics as a source of bitmap graphics.
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"><Canvas.Background>  <DrawingBrush><DrawingBrush.Drawing><DrawingGroup>
  <DrawingGroup x:Name="DrawingLayer">
    <DrawingGroup.ClipGeometry>
      <RectangleGeometry Rect="0,0,160,160" />
    </DrawingGroup.ClipGeometry>
    <DrawingGroup x:Name="g515" Transform="1,0,0,1,77.224,60.5678">
      <GeometryDrawing x:Name="path474">
        <GeometryDrawing.Brush>
          <SolidColorBrush Color="#FFBCEFF1" Opacity="0.992157" Transform="0.213907,0,0,0.213907,61.1646,40.8892" />
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="14.6092" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
            <Pen.Brush>
              <SolidColorBrush Color="#FF1C5574" Opacity="0.992157" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.213907,0,0,0.213907,61.1646,40.8892" Figures="M23.9471,20.1241L265.767,20.1241 365.767,120.124 365.767,535.103 23.9471,535.103 23.9471,20.1241z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path475">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="255.848,119.147" EndPoint="375.686,34.1009" MappingMode="Absolute" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <TransformGroup>
                  <TransformGroup>
                    <ScaleTransform ScaleX="1.3286898892303889" ScaleY="1.3286898892303889" />
                    <TranslateTransform X="-103.78942196159659" Y="-138.18531450068784" />
                  </TransformGroup>
                  <RotateTransform Angle="45" CenterX="0.5" CenterY="0.5" />
                </TransformGroup>
                <MatrixTransform>0.213907,0,0,0.213907,61.1646,40.8892</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FFFFFFFF" Offset="0" />
            <GradientStop Color="#FF000000" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.213907,0,0,0.213907,61.1646,40.8892" Figures="M276.767,133.124L365.767,120.124 265.767,20.1241" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path476">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="2.69643,1.14655" EndPoint="3.85147,0.623116" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,-2.65767,-0.201241</MatrixTransform>
                <MatrixTransform>0.213907,0,0,0.213907,61.1646,40.8892</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#E5D7FFFF" Offset="0" />
            <GradientStop Color="#F32EA6B9" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="14.6092" StartLineCap="Round" EndLineCap="Round" LineJoin="Round">
            <Pen.Brush>
              <SolidColorBrush Color="#FF1C5574" Opacity="0.992157" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.213907,0,0,0.213907,61.1646,40.8892" Figures="M265.767,120.124L365.767,120.124 265.767,20.1241 265.767,120.124" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
    </DrawingGroup>
    <GeometryDrawing x:Name="path9">
      <GeometryDrawing.Brush>
        <RadialGradientBrush Center="3.03981,1.05578" RadiusX="0.773346" RadiusY="0.773346" GradientOrigin="3.03981,1.05578" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
          <RadialGradientBrush.Transform>
            <TransformGroup>
              <MatrixTransform>0.945877,0,0,1.05722,0.264368,0.249996</MatrixTransform>
              <MatrixTransform>0.278752,0,0,0.284891,29.8322,1.63322</MatrixTransform>
            </TransformGroup>
          </RadialGradientBrush.Transform>
          <GradientStop Color="#FFCDFFFF" Offset="0" />
          <GradientStop Color="#E70C5D7D" Offset="1" />
        </RadialGradientBrush>
      </GeometryDrawing.Brush>
      <GeometryDrawing.Pen>
        <Pen Thickness="4.03585" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
          <Pen.Brush>
            <SolidColorBrush Color="#FF0C5D7D" Opacity="0.99" />
          </Pen.Brush>
        </Pen>
      </GeometryDrawing.Pen>
      <GeometryDrawing.Geometry>
        <PathGeometry FillRule="Nonzero" Transform="0.278752,0,0,0.284891,29.8322,1.63322" Figures="M35.399,39.1321L277.219,39.1321 377.219,137.984 377.219,548.198 35.399,548.198 35.399,39.1321z" />
      </GeometryDrawing.Geometry>
    </GeometryDrawing>
    <GeometryDrawing x:Name="path10">
      <GeometryDrawing.Brush>
        <SolidColorBrush Color="#FFFFFFFF" Opacity="0.699301" Transform="0.278752,0,0,0.278752,29.8322,3.74844" />
      </GeometryDrawing.Brush>
      <GeometryDrawing.Pen>
        <Pen Thickness="8.96855" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
          <Pen.Brush>
            <SolidColorBrush Color="#FF1C5574" Opacity="0.819608" />
          </Pen.Brush>
        </Pen>
      </GeometryDrawing.Pen>
      <GeometryDrawing.Geometry>
        <PathGeometry FillRule="Nonzero" Transform="0.278752,0,0,0.278752,29.8322,3.74844" Figures="M23.9471,20.1241L265.767,20.1241 365.767,120.124 365.767,535.103 23.9471,535.103 23.9471,20.1241z" />
      </GeometryDrawing.Geometry>
    </GeometryDrawing>
    <GeometryDrawing x:Name="path15">
      <GeometryDrawing.Brush>
        <LinearGradientBrush StartPoint="255.848,119.147" EndPoint="375.686,34.1009" MappingMode="Absolute" Opacity="1">
          <LinearGradientBrush.Transform>
            <TransformGroup>
              <TransformGroup>
                <TransformGroup>
                  <ScaleTransform ScaleX="1.3286898892303889" ScaleY="1.3286898892303889" />
                  <TranslateTransform X="-103.78942196159659" Y="-138.18531450068784" />
                </TransformGroup>
                <RotateTransform Angle="45" CenterX="0.5" CenterY="0.5" />
              </TransformGroup>
              <MatrixTransform>0.278752,0,0,0.278752,29.8322,3.74844</MatrixTransform>
            </TransformGroup>
          </LinearGradientBrush.Transform>
          <GradientStop Color="#FFFFFFFF" Offset="0" />
          <GradientStop Color="#FF000000" Offset="1" />
        </LinearGradientBrush>
      </GeometryDrawing.Brush>
      <GeometryDrawing.Geometry>
        <PathGeometry FillRule="Nonzero" Transform="0.278752,0,0,0.278752,29.8322,3.74844" Figures="M276.767,133.124L365.767,120.124 265.767,20.1241" />
      </GeometryDrawing.Geometry>
    </GeometryDrawing>
    <GeometryDrawing x:Name="path20">
      <GeometryDrawing.Brush>
        <LinearGradientBrush StartPoint="2.69643,1.14655" EndPoint="3.85147,0.623116" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
          <LinearGradientBrush.Transform>
            <TransformGroup>
              <MatrixTransform>1,0,0,1,-2.65767,-0.201241</MatrixTransform>
              <MatrixTransform>0.278752,0,0,0.278752,29.8322,3.74844</MatrixTransform>
            </TransformGroup>
          </LinearGradientBrush.Transform>
          <GradientStop Color="#E5D7FFFF" Offset="0" />
          <GradientStop Color="#F32EA6B9" Offset="1" />
        </LinearGradientBrush>
      </GeometryDrawing.Brush>
      <GeometryDrawing.Pen>
        <Pen Thickness="6.72641" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
          <Pen.Brush>
            <SolidColorBrush Color="#FF1C5574" Opacity="0.992157" />
          </Pen.Brush>
        </Pen>
      </GeometryDrawing.Pen>
      <GeometryDrawing.Geometry>
        <PathGeometry FillRule="Nonzero" Transform="0.278752,0,0,0.278752,29.8322,3.74844" Figures="M265.767,120.124L365.767,120.124 265.767,20.1241 265.767,120.124" />
      </GeometryDrawing.Geometry>
    </GeometryDrawing>
    <DrawingGroup x:Name="g158">
      <GeometryDrawing x:Name="path2325">
        <GeometryDrawing.Brush>
          <SolidColorBrush Color="#FFFF0000" Opacity="0.99" Transform="1.44714,0,0,1.44714,-27.8899,-29.8484" />
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="2.15943" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
            <Pen.Brush>
              <SolidColorBrush Color="#FFCD0000" Opacity="0.99" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="1.44714,0,0,1.44714,-27.8899,-29.8484" Figures="M62.5183,72.4199C64.9222,72.4226 75.8903,85.4223 81.4302,92.777 87.3364,99.935 92.2589,107.073 97.7235,114.183L96.9485,114.698C91.4522,107.598 85.8722,101.076 80.212,94.1064 76.3189,89.3468 71.4075,84.0883 68.3636,79.4635 68.2438,79.3268 62.4424,72.4396 62.5164,72.4212 63.7044,72.1269 63.9548,72.4204 65.1788,72.4199L62.5183,72.4199z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path2326">
        <GeometryDrawing.Brush>
          <SolidColorBrush Color="#FFFE0000" Opacity="0.99" Transform="0.967787,0,0,1.07199,15.6818,-1.44861" />
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="3.06807" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
            <Pen.Brush>
              <SolidColorBrush Color="#FFCD0000" Opacity="0.99" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.967787,0,0,1.07199,15.6818,-1.44861" Figures="M110.771,77.1596C105.068,76.3729 96.7979,83.0569 92.4992,85.7984 74.7461,97.867 59.7437,113.534 44.7531,128.785L42.7377,127.714C56.9803,108.743 73.2479,95.6538 90.6654,82.9243 96.2134,79.0781 103.786,74.7189 110.771,73.7553L110.771,77.1596z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
    </DrawingGroup>
  </DrawingGroup>
      </DrawingGroup></DrawingBrush.Drawing></DrawingBrush></Canvas.Background></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
Germany 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

Comments and Discussions