Compartir a través de


How to: Create a Composite Shape

This example shows how to create composite shapes using Geometry objects and display them using a Path element. In the following example, a LineGeometry, EllipseGeometry, and a RectangleGeometry are used with a GeometryGroup to create a composite shape. The geometries are then drawn using a Path element.

Example

<!-- Displays the geometry. --> 
<Path Stroke="Black" StrokeThickness="1" Fill="#CCCCFF">
  <Path.Data>
  
    <!-- Creates a composite shape from three geometries. -->
    <GeometryGroup FillRule="EvenOdd">
      <LineGeometry StartPoint="10,10" EndPoint="50,30" />
      <EllipseGeometry Center="40,70" RadiusX="30" RadiusY="30" />              
      <RectangleGeometry Rect="30,55 100 30" />
    </GeometryGroup>
  </Path.Data>
</Path>
// Create a Path to be drawn to the screen.
Path myPath = new Path();
myPath.Stroke = Brushes.Black;
myPath.StrokeThickness = 1;
SolidColorBrush mySolidColorBrush = new SolidColorBrush();
mySolidColorBrush.Color = Color.FromArgb(255, 204, 204, 255);
myPath.Fill = mySolidColorBrush;

// Create the line geometry to add to the Path
LineGeometry myLineGeometry = new LineGeometry();
myLineGeometry.StartPoint = new Point(10, 10);
myLineGeometry.EndPoint = new Point(50, 30);

// Create the ellipse geometry to add to the Path
EllipseGeometry myEllipseGeometry = new EllipseGeometry();
myEllipseGeometry.Center = new Point(40, 70);
myEllipseGeometry.RadiusX = 30;
myEllipseGeometry.RadiusY = 30;

// Create a rectangle geometry to add to the Path
RectangleGeometry myRectGeometry = new RectangleGeometry();
myRectGeometry.Rect = new Rect(30, 55, 100, 30);

// Add all the geometries to a GeometryGroup.
GeometryGroup myGeometryGroup = new GeometryGroup();
myGeometryGroup.Children.Add(myLineGeometry);
myGeometryGroup.Children.Add(myEllipseGeometry);
myGeometryGroup.Children.Add(myRectGeometry);

myPath.Data = myGeometryGroup;

// Add path shape to the UI.
StackPanel mainPanel = new StackPanel();
mainPanel.Children.Add(myPath);
this.Content = mainPanel;

The following illustration shows the shape created in the previous example.


Composite Geometry

A composite geometry created using a GeometryGroup

More complex shapes, such as polygons and shapes with curved segments, may be created using a PathGeometry. For an example showing how to create a shape using a PathGeometry, see How to: Create a Shape by Using a PathGeometry. Although this example renders a shape to the screen using a Path element, Geometry objects may also be used to describe the contents of a GeometryDrawing or a DrawingContext. They may also be used for clipping and hit-testing.

This example is part of larger sample; for the complete sample, see the Geometries Sample.