Click here to Skip to main content
15,895,084 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,507.946,507.946" />
    </DrawingGroup.ClipGeometry>
    <DrawingGroup x:Name="g3163" Transform="1.11927,0,0,1.11927,-33.9633,-24.5267">
      <GeometryDrawing x:Name="path208">
        <GeometryDrawing.Brush>
          <SolidColorBrush Color="#FFFFFFFF" Opacity="0.699301" Transform="0.974037,0,0,1.14826,106.596,-218.009" />
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="9.25243" StartLineCap="Round" EndLineCap="Round" LineJoin="Round">
            <Pen.Brush>
              <SolidColorBrush Color="#FF1C6671" Opacity="0.992157" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.974037,0,0,1.14826,106.596,-218.009" Figures="M-49.21,251.696C-50.4531,239.201,-40.2031,227.28,-26.5727,228.549L168.873,263.916 168.286,299.924 253.046,316.79 253.93,278.879 343.038,291.687C354.248,294.903,361.401,301.559,364.498,316.818L364.227,591.258 -50.8332,491.502 -49.21,251.696z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path209">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="-0.267823,-0.113611" EndPoint="0.250212,1.2801" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="0.699301">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>-1.66776,-1.248,0.0590927,-0.555388,0.492831,1.02592</MatrixTransform>
                <MatrixTransform>0.969882,-0.0124783,0.0145635,1.14143,102.707,-215.419</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#C70C5C7D" Offset="0" />
            <GradientStop Color="#B0CDFFFF" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.969882,-0.0124783,0.0145635,1.14143,102.707,-215.419" Figures="M-27.5759,232.64L161.416,266.223 162.857,303.665 255.075,321.926 257.994,284.305 339.658,295.159C350.192,300.105,358.021,305.051,359.09,316.919L359.479,402.175 -45.8976,311.058 -45.4017,248.362C-45.92,242.481,-36.0719,234.675,-27.5759,232.64z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path230">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="0.0434782,0.101563" EndPoint="0.900621,1.03125" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="0.699301">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,1.75173E-09,-1.08106E-08</MatrixTransform>
                <MatrixTransform>0.926706,0,0,0.797788,117.921,14.0454</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FFF5F5F5" Offset="0" />
            <GradientStop Color="#FF949494" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="0.926706,0,0,0.797788,117.921,14.0454" Figures="M-56.9574,281.878L366.63,415.997 366.463,552.702 -52.8614,415.802 -56.9574,281.878z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <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.827006,0.228079,-0.235141,0.837892,163.319,19.6598</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.827006,0.228079,-0.235141,0.837892,163.319,19.6598" Figures="M-42.4604,274.763L433.35,273.812 434.557,303.708 -42.4604,305.48 -42.4604,274.763z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path313">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="-0.258715,-0.109747" EndPoint="0.241703,1.23657" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="0.866667">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1.72489,1.17189,-0.0575163,0.540671,0.503708,0.486073</MatrixTransform>
                <MatrixTransform>-0.98219,0.000824659,-0.000774374,-0.944101,402.867,454.258</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#C70C5C7D" Offset="0" />
            <GradientStop Color="#B0CDFFFF" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="Nonzero" Transform="-0.98219,0.000824659,-0.000774374,-0.944101,402.867,454.258" Figures="M-54.9317,113.669L347.321,224.163 346.804,333.491 -55.046,228.132 -54.9317,113.669z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
    </DrawingGroup>
    <DrawingGroup x:Name="g3154" Transform="1.08391,0,0,1.08391,9.81637,-35.0152">
      <GeometryDrawing x:Name="rect14">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="0.145454,0.257812" EndPoint="0.599999,0.570312" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,-7.61378E-09,-1.86769E-08</MatrixTransform>
                <MatrixTransform>0.67178,0,0,0.67178,-18.0117,149.135</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FDFBDDB2" Offset="0" />
            <GradientStop Color="#F3EFA81A" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="11.905" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
            <Pen.Brush>
              <SolidColorBrush Color="#FF580400" Opacity="0.992157" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <RectangleGeometry RadiusX="0" RadiusY="0" Rect="126.604,52.0403,51.3235,120.5982" Transform="0.67178,0,0,0.67178,-18.0117,149.135" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path15">
        <GeometryDrawing.Pen>
          <Pen Thickness="11.905" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Round">
            <Pen.Brush>
              <SolidColorBrush Color="#FF154850" Opacity="0.988235" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-26.1294,129.12" Figures="M111.364,481.507C382.161,479.905,383.764,481.507,383.764,481.507L382.161,253.973 247.564,120.978 112.966,257.178C111.363,258.78,112.966,479.905,111.364,481.507z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path48">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="2.57045,0.500001" EndPoint="1.02703,0.507813" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,1.00861E-08,2.06141E-08</MatrixTransform>
                <MatrixTransform>0.722291,0,0,0.722291,-26.1294,129.12</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FD787878" Offset="0" />
            <GradientStop Color="#FDFFFFFF" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-26.1294,129.12" Figures="M117.773,475.097C177.06,475.097 177.06,473.495 177.06,473.495 177.06,473.495 177.06,302.044 177.06,302.044 177.06,302.044 119.375,258.78 119.375,258.78 116.17,260.382 117.773,476.7 117.773,475.097z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path49">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="0.235289,0.265619" EndPoint="0.672269,0.59375" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,1.18803E-07,-1.01189E-08</MatrixTransform>
                <MatrixTransform>0.722291,0,0,0.722291,-26.1294,129.12</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FD787878" Offset="0" />
            <GradientStop Color="#FDFFFFFF" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-26.1294,129.12" Figures="M117.773,258.78L242.756,132.194 271.6,217.118 177.06,302.044 117.773,258.78z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path51">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="0.981639,0.0312495" EndPoint="0.146789,0.601562" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,-5.18186E-08,1.7497E-08</MatrixTransform>
                <MatrixTransform>0.722291,0,0,0.722291,-26.1294,129.12</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FD787878" Offset="0" />
            <GradientStop Color="#FDFFFFFF" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-26.1294,129.12" Figures="M229.938,205.902L252.371,130.592 375.752,255.575 316.464,306.85 229.938,205.902z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path52">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="1.20507,0.523438" EndPoint="0.102482,0.515617" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,8.20491E-05,8.70101E-06</MatrixTransform>
                <MatrixTransform>0.722291,0,0,0.722291,-26.1294,129.12</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FD787878" Offset="0" />
            <GradientStop Color="#FDFFFFFF" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-26.1294,129.12" Figures="M314.862,475.098L313.26,302.044 377.354,253.973 378.957,475.098 314.862,475.098z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path13">
        <GeometryDrawing.Brush>
          <RadialGradientBrush Center="5.85956,5.90413" RadiusX="0.928056" RadiusY="0.928056" GradientOrigin="5.85956,5.90413" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <RadialGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>0.981788,0,0,1.01855,0.891037,0.918408</MatrixTransform>
                <MatrixTransform>0.722291,0,0,0.722291,-21.5,117.546</MatrixTransform>
              </TransformGroup>
            </RadialGradientBrush.Transform>
            <GradientStop Color="#FF006C8B" Offset="0" />
            <GradientStop Color="#FFBDDAFF" Offset="1" />
          </RadialGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="11.9213" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Round">
            <Pen.Brush>
              <SolidColorBrush Color="#FF1C6671" Opacity="0.988235" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-21.5,117.546" Figures="M177.06,486.314L175.458,332.488C175.458,295.634 195.487,269.997 237.949,269.997 282.014,269.997 303.646,300.441 303.646,332.488L303.646,486.314C303.646,486.314,177.06,484.712,177.06,486.314z" />
        </GeometryDrawing.Geometry>
      </GeometryDrawing>
      <GeometryDrawing x:Name="path16">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="0.242009,0.382812" EndPoint="0.497717,0.507812" MappingMode="RelativeToBoundingBox" SpreadMethod="Pad" Opacity="1">
            <LinearGradientBrush.Transform>
              <TransformGroup>
                <MatrixTransform>1,0,0,1,5.50934E-10,1.51001E-09</MatrixTransform>
                <MatrixTransform>0.722291,0,0,0.722291,-26.1294,129.12</MatrixTransform>
              </TransformGroup>
            </LinearGradientBrush.Transform>
            <GradientStop Color="#FDCA536D" Offset="0" />
            <GradientStop Color="#F3A81837" Offset="1" />
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
        <GeometryDrawing.Pen>
          <Pen Thickness="11.905" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter">
            <Pen.Brush>
              <SolidColorBrush Color="#FF580400" Opacity="0.992157" />
            </Pen.Brush>
          </Pen>
        </GeometryDrawing.Pen>
        <GeometryDrawing.Geometry>
          <PathGeometry FillRule="EvenOdd" Transform="0.722291,0,0,0.722291,-26.1294,129.12" Figures="M63.293,303.646C213.914,159.434 213.914,159.434 213.914,159.434 213.914,159.434 282.815,157.832 284.417,157.832 286.02,157.832 423.822,295.634 423.822,295.634 423.822,295.634 455.87,261.985 455.87,261.985 455.87,261.985 249.166,55.2812 249.166,55.2812 249.166,55.2812 32.8482,269.997 32.8482,269.997 32.8482,269.997 63.293,303.646 63.293,303.646z" />
        </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