[]
DEMOS DOCS API BLOG SUPPORT PRICING DOWNLOAD
(Showing Draft Content)

Editing the Points of a Shape

Spread.NET allows you to edit shape points by using API members or user interactions. By doing this, any existing shape can be modified to a custom shape according to requirements.

A shape contains:

  • Node points: The node points are usually represented by black dots on the outline of a shape where a curve ends or where two line segments meet in a freeform shape.

  • Control points: When a node point is selected, it shows control points for specifying the spline curve between the selected point and the adjacent points. These are displayed as white point handles.

  • Segments: The segments are Straight or curved lines connecting two node points.

    Image depictng pointtypes in shapes.

Edit Points

The Edit points in a shape can be of three different types, smooth, straight and corner.

  • Smooth: A smooth point joins two line segments of equal length. Press Shift while dragging either of the control points attached to the node point. Once you stop dragging, the point will be changed to a smooth point.

    Image depictng smooth point in shapes.

  • Straight: A straight point joins two line segments of different lengths. Press Ctrl while dragging either of the handles attached to the point. Once you stop dragging the point will be changed to a straight point.

    Image depictng straight point in shapes.

  • Corner: A corner point joins two line segments with one segment going off in a different direction. Press Alt while dragging either of the handles attached to the point. Once you stop dragging the point will be changed to a corner point. Moving node and control points along with pressing Alt key will display different behaviors.

    Image depictng corner point in shapes.

// Enable EnhancedShapeEngine
fpSpread1.Features.EnhancedShapeEngine = true;

// Add FivePointedStar Shape
fpSpread1.AsWorkbook().ActiveSheet.Shapes.AddShape(GrapeCity.Spreadsheet.Drawing.AutoShapeType.FivePointedStar, 100, 100, 100, 100);
       
// Edit Shape
fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].IsEditing = true;
// Get number of Nodes for FivePointedStar
var c = fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].Nodes.Count.ToString();
MessageBox.Show(c);

// Set the editing type of the node specified by Index
fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].Nodes.SetEditingType(0, GrapeCity.Spreadsheet.Drawing.EditingType.Smooth);

// Set the segment type of the segment that follows the node specified by Index
fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].Nodes.SetSegmentType(0, GrapeCity.Spreadsheet.Drawing.SegmentType.Curve);

// Set the location of the node specified by Index
fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].Nodes.SetPosition(0, 50, 50);

// Build a freeform object
IFreeFormBuilder freeform = fpSpread1.AsWorkbook().ActiveSheet.Shapes.BuildFreeform(EditingType.Corner, 160, 10);
freeform.AddNodes(SegmentType.Curve, EditingType.Corner, 180, 30, 200, 50, 250, 100);
freeform.AddNodes(SegmentType.Curve, EditingType.Auto, 280, 10);
freeform.AddNodes(SegmentType.Curve, EditingType.Auto, 280, 200);
freeform.AddNodes(SegmentType.Line, EditingType.Auto, 160, 10);
freeform.ConvertToShape();
' Enable EnhancedShapeEngine
fpSpread1.Features.EnhancedShapeEngine = True

' Add FivePointedStar Shape
fpSpread1.AsWorkbook().ActiveSheet.Shapes.AddShape(GrapeCity.Spreadsheet.Drawing.AutoShapeType.FivePointedStar, 100, 100, 100, 100)

' Edit Shape
fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).IsEditing = True

' Get number of Nodes for FivePointedStar
Dim c = fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).Nodes.Count.ToString()
MessageBox.Show(c)

' Set the editing type of the node specified by Index
fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).Nodes.SetEditingType(0, GrapeCity.Spreadsheet.Drawing.EditingType.Smooth)

' Set the segment type of the segment that follows the node specified by Index
fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).Nodes.SetSegmentType(0, GrapeCity.Spreadsheet.Drawing.SegmentType.Curve)

' Set the location of the node specified by Index
fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).Nodes.SetPosition(0, 50, 50)

' Build a freeform object
Dim freeform As IFreeFormBuilder = fpSpread1.AsWorkbook().ActiveSheet.Shapes.BuildFreeform(EditingType.Corner, 160, 10)
freeform.AddNodes(SegmentType.Curve, EditingType.Corner, 180, 30, 200, 50, 250, 100)
freeform.AddNodes(SegmentType.Curve, EditingType.Auto, 280, 10)
freeform.AddNodes(SegmentType.Curve, EditingType.Auto, 280, 200)
freeform.AddNodes(SegmentType.Line, EditingType.Auto, 160, 10)
freeform.ConvertToShape()

Users can right click a node or control point to view its context menu, which provides options to add or delete points, and select smooth, straight or corner points. You can also choose the Exit Edit Point option to end editing the shape.

Image depictng point context menu.

Similarly, you can right click a segment (red line/outline) to view the segment context menu. It provides options to add node point, delete segment, select straight or curved segment. Also, after viewing the context menu, you can choose Open Path or Close path option.

Image depictng segment context menu.

You can also customize the context menu of a shape by using BeforeRightClick event. The below example code prevents the display of context menu when a shape is right clicked.

fpSpread1.Features.EnhancedShapeEngine = true;
IShape ss = fpSpread1.AsWorkbook().ActiveSheet.Shapes.AddShape(AutoShapeType.Rectangle, 300, 130, 115, 115);
this.fpSpread1.BeforeRightClick += FpSpread1_BeforeRightClick;

private void FpSpread1_BeforeRightClick(object sender, FarPoint.Win.Spread.BeforeRightClickEventArgs e)
{
    // this will prevent context menu to display on right click of shape using BeforeRightClick event
    e.Cancel = true;
}
Friend Class SurroundingClass
    Private Sub EditShape_CustomizeShapeBeforeRightClick_Load(ByVal sender As Object, ByVal e As EventArgs)
        fpSpread1.Features.EnhancedShapeEngine = True
        Dim ss As IShape = fpSpread1.AsWorkbook().ActiveSheet.Shapes.AddShape(AutoShapeType.Rectangle, 300, 130, 115, 115)
        Me.fpSpread1.BeforeRightClick += AddressOf FpSpread1_BeforeRightClick
    End Sub
    Private Sub FpSpread1_BeforeRightClick(ByVal sender As Object, ByVal e As FarPoint.Win.Spread.BeforeRightClickEventArgs)
        ' this will prevent context menu to display on right click of shape using BeforeRightClick event
        e.Cancel = True
    End Sub
End Class

Add Points

To add a point in shapes, you can either use the context menu by right clicking on the red outline of shape, and choose the Add Point option, or simply hold the CTRL key and click on the red outline of shape.

Image depictng how to add point in shape.

// Add a node
fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].Nodes.Insert(0, GrapeCity.Spreadsheet.Drawing.SegmentType.Curve, GrapeCity.Spreadsheet.Drawing.EditingType.Corner, 50, 100, 50, 130, 100, 100);
' Add a node
fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).Nodes.Insert(0, GrapeCity.Spreadsheet.Drawing.SegmentType.Curve, GrapeCity.Spreadsheet.Drawing.EditingType.Corner, 50, 100, 50, 130, 100, 100)

Delete Points

To delete a point in shapes, you can either use the context menu by right clicking on the node or control points, and choose the Delete Point option, or simply hold the CTRL key and click on the node or control points.

Image depictng how to delete point in shape.

// Delete a node
fpSpread1.AsWorkbook().ActiveSheet.Shapes[0].Nodes.Delete(1);
' Delete a node
fpSpread1.AsWorkbook().ActiveSheet.Shapes(0).Nodes.Delete(1)