Create custom shape consisting of multiple single lines

Question

i want to create a simple cross, that consists of two lines. The lines should have different colors. I've created a class that inherits form Shape. This class contains the two lines and computes the coordinates of the lines. I've read that i have to implement the DefiningGeometry property if i inherit from Shape. But how can i return both lines in the get section of that property?

Thanks in advance.

Answer 1

It sounds like you could use the CombinedGeometry Class to combine your lines together... the only thing is that you'll need to use LineGeometry classes instead of Lines. You could do something like this (from the linked CombinedGeometry page on MSDN):

<Path Stroke="Black" StrokeThickness="1" Fill="#CCCCFF">
  <Path.Data>

    <!-- Combines two geometries using the XOR combine mode. -->
    <CombinedGeometry GeometryCombineMode="Xor">
      <CombinedGeometry.Geometry1>
        <EllipseGeometry RadiusX="50" RadiusY="50" Center="75,75" />
      </CombinedGeometry.Geometry1>
      <CombinedGeometry.Geometry2>
        <EllipseGeometry RadiusX="50" RadiusY="50" Center="125,75" />
      </CombinedGeometry.Geometry2>
    </CombinedGeometry>
  </Path.Data>
</Path>

Of course, you'd want to replace these EllipseGeometry objects with LineGeometry objects, but that shouldn't be difficult as they have similar properties.

---

UPDATE >>>

Unfortunately, I don't think that you can use a CombinedGeometry object that contains geometries of different colours... the whole shape would have to be painted with one Brush. However, you could fake two colours with cleverly positioned GradientStops. Also, as @Clemens mentioned, perhaps a GeometryGroup would be easier for you to use... try something like this:

<Path StrokeThickness="5" Fill="Blue" HorizontalAlignment="Center" VerticalAlignment="Center">
    <Path.Data>
        <GeometryGroup>
            <LineGeometry StartPoint="50,0" EndPoint="50,100"  />
            <LineGeometry StartPoint="0,50" EndPoint="100,50"  />
        </GeometryGroup>
    </Path.Data>
    <Path.Stroke>
        <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
            <GradientStop Color="LightGreen" Offset="0" />
            <GradientStop Color="LightGreen" Offset="0.475" />
            <GradientStop Color="Red" Offset="0.475" />
            <GradientStop Color="Red" Offset="0.525" />
            <GradientStop Color="LightGreen" Offset="0.525" />
            <GradientStop Color="LightGreen" Offset="0" />
        </LinearGradientBrush>
    </Path.Stroke>
</Path>

This Brush will appear as if it were actually different colours on the two lines:

Then all you'll need to do is to convert this into C# to return it from the DefiningGeometry property. Please use the examples from the linked pages and the GeometryGroup class page on MSDN to help you with this.

Answer 2

You may draw two differently colored lines by means of two GeometryDrawings in a DrawingBrush that fills a Rectangle:

<Rectangle Width="20" Height="20">
    <Rectangle.Fill>
        <DrawingBrush>
            <DrawingBrush.Drawing>
                <DrawingGroup>
                    <GeometryDrawing Geometry="M0,-10 L0,10">
                        <GeometryDrawing.Pen>
                            <Pen Brush="Blue" Thickness="3"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="M-10,0 L10,0">
                        <GeometryDrawing.Pen>
                            <Pen Brush="Red" Thickness="3"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                </DrawingGroup>
            </DrawingBrush.Drawing>
        </DrawingBrush>
    </Rectangle.Fill>
</Rectangle>