Dynamically Generating a PathGeometry

Wednesday, 16 April 2008 23:35 by snyhol

This post focuses on Silverlight 2 Beta 1.

I was following along with the Asteroids tutorial from Bill Reiss' Silverlight Games 101 blog.  I got to the post where he explained how to dynamically generate the asteroid shapes.  Bill was illustrating how to dynamically load, build, and inject XAML into an application.  This example used string building to create a Path object that defined the edges of the asteroid.  It worked, but I wanted to figure out how to refactor this control to use an object oriented approach. 

In the Silverlight.net forums, Yasser Makram provided exactly what I needed: a simple example for creating a Path object from code

I was able to define a "blank" Path object in the XAML that could be programmatically filled in. 

<Path x:Name="path" Data="" Stroke="#FFFFFFFF" Fill="Black" StrokeThickness="2" Width="40" Height="40">

Next, I was able to use the PathGeometry objects from code to build that asteroid!  Yes, I did.  (Notice that this is not a complete code sample - it even includes commented out lines from Bill's tutorial.)

//string pathXaml = "";
double[] lengths = { 1, 1, 1, .97, .97, .94, .94, .91, .91, .88, .85, .82, .82, .79, .76, .73, .61, .51 };
shuffle(lengths);

PathGeometry pathGeometry = new PathGeometry();
PathFigure pathFigure = new PathFigure();
pathFigure.Segments =
new PathSegmentCollection();

for (int i = 0; i < 18; i++) {
 
float degrees = i * 20;
 
Vector v = new Vector(degrees, radius * lengths[i], true);
 
if (degrees == 0) {
   
//pathXaml += string.Format("M{0},{1} L", (int)v.X + radius, (int)v.Y + radius);
    pathFigure.StartPoint = new Point(v.X + radius, v.Y + radius);
  }
 
else {
   
//pathXaml += string.Format("{0},{1} ", (int)v.X + radius, (int)v.Y + radius);
    LineSegment lineSegment = new LineSegment();
    lineSegment.Point =
new Point(v.X + radius, v.Y + radius);
    pathFigure.Segments.Add(lineSegment);
  }
}
//pathXaml += "z";
pathFigure.IsClosed = true;

pathGeometry.Figures =
new PathFigureCollection();
pathGeometry.Figures.Add(pathFigure);

path.Height = radius * 2;
path.Width = radius * 2;
path.Data = pathGeometry;

On a similar topic, Jeff Weber at farseer games explained that the PathGeometry is only available from the code behind if the Path is not created with the mini language.  He explained a workaround to force Expression Blend to generate the full PathGeometry in your XAML. 

So there you have it.  In Silverlight 2, you can create an entire Path object programmatically in the code.  In fact, I probably could have done that... built the entire thing from code and avoid the XAML altogether... but it was fun to explore the interaction between the XAML and the codebehind.

Be the first to rate this post

  • Currently 0/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Tags:   ,
Categories:   Software Dev
Actions:   E-mail | Permalink | Trackback | Comments (0) | Comment RSSRSS comment feed

Related posts

Add comment


(Will show your Gravatar icon)  

  Country flag

[b][/b] - [i][/i] - [u][/u]- [quote][/quote]



Live preview

September 5. 2008 13:49