ImageDraw supports AutoShapes which are preset shapes like rectangles, ovals, lines, arrows, stars, polygons, callouts and paths that can be drawn on the Canvas. In addition, AutoShapes supports imaging effects (a.k.a. Actions), text inside them by allowing padding text feature, border roundness and dashed patterns.
Rich Text Support
AutoShapes can display text inside them and they support the same rich text features available when working with TextElement objects i.e. multi-line text, outlined text, and text alignment.
Rich Fill Support
AutoShapes can be filled out with solid colors, texture images, linear gradients, and built-in patterns. The same is applied for shape's border.
Roundness
AutoShapes support roundness that allows you to make them rounded shapes. For example, by setting up the Roundness property of a Rectangle shape, then you will get a rounded rectangle. By setting up the Roundness property of a Star shape, then you can get a burst (those rounded star shaped ovals often seen in advertising).
Border Style Support
AutoShapes support setting up the line style of the border shape to a dashed pattern.
A Rectangle Element – represented by Neodynamic.WebControls.ImageDraw.RectangleShapeElement class – lets you draw rectangle shapes on the Canvas. RectangleShapeElement objects are created by specifying some basic properties such as Width, Height, Fill, StrokeFill, etc.
Syntax sample:
RectangleShapeElement Output Sample:
By setting up Roundness property to 25, you will get a rounded rectangle:
By setting up StrokeDashStyle property to Dash, you will get the following output:
By setting up Text property to "My Rectangle", you will get the following output:
An Oval Element – represented by Neodynamic.WebControls.ImageDraw.OvalShapeElement class – lets you draw oval shapes (ellipses and circles included) on the Canvas. OvalShapeElement objects are created by specifying some basic properties such as Width, Height, Fill, StrokeFill, etc.
Syntax sample:
OvalShapeElement Output Sample:
By setting up StrokeDashStyle property to DashDot, you will get the following output:
By setting up Text property to "My Oval", you will get the following output:
A Line Element – represented by Neodynamic.WebControls.ImageDraw.LineShapeElement class – lets you draw line shapes on the Canvas. LineShapeElement objects are created by specifying some basic properties such as Width, Height, StrokeFill, etc. Line shapes support cap styles for staring and ending line points. By setting up cap styles, you can convert lines into arrows.
Note Line shapes are drawn within the area defined by Width and Height properties of LineShapeElement class i.e. there's no start and end line points for setting up. LineShapeElement class also feature Orientation property which lets you specify the line orientation to Horizontal (Default), Vertical, DiagonalUp, and DiagonalDown.
Syntax sample:
LineShapeElement Output Sample:
By setting up Orientation property to Vertical, DiagonalUp, and DiagonalDown, you will get the following outputs respectively:
By setting up StrokeDashStyle property to Dash, you will get the following output:
By setting up Text property to "My Line" and TexPadding-Bottom property to 20, you will get the following output:
A Polygon Element – represented by Neodynamic.WebControls.ImageDraw.PolygonShapeElement class – lets you draw irregular polygon shapes on the Canvas. PolygonShapeElement objects are created by specifying some basic properties such as Sides, Width, Height, Fill, StrokeFill, etc.
Syntax sample:
PolygonShapeElement Output Sample:
By setting up Roundness property to 25, you will get a rounded pentagon:
By setting up StrokeDashStyle property to Dash, you will get the following output:
By setting up Text property to "My Rectangle', you will get the following output:
A Star Element – represented by Neodynamic.WebControls.ImageDraw.StarShapeElement class – lets you draw istar shapes and bursts (those rounded star shaped ovals often seen in advertising) on the Canvas. StarShapeElement objects are created by specifying some basic properties such as Points, InnerRadiusPercentage, Width, Height, Fill, StrokeFill, etc.
Syntax sample:
StarShapeElement Output Sample:
By setting up Roundness property to 50, you will get a rounded 10-points star:
By setting up StrokeDashStyle property to Dot, you will get the following output:
By setting up Text property to "50% Off", you will get the following output:
A Callout Element – represented by Neodynamic.WebControls.ImageDraw.CalloutShapeElement class – lets you draw callout shapes (a.k.a. speech bubbles) on the Canvas. CalloutShapeElement objects are created by specifying some basic properties such as Arrow Tip coord., Width, Height, Fill, StrokeFill, etc.
Syntax sample:
CalloutShapeElement Output Sample:
By setting up CalloutType property to Rectangle and changing the CalloutArrowX and CalloutArrowY properties you get a rectangular callout:
A Path Element – represented by Neodynamic.WebControls.ImageDraw.PathShapeElement class – lets you draw shapes described by a path i.e. a set of pair of points on the Canvas. PathShapeElement objects are created by specifying some basic properties such as PathPoints, Fill, StrokeFill, etc.
Syntax sample:
PathShapeElement Output Sample:
By setting up ClosedPath property to True and Roundness property to 50:
As for ImageElement and TextElement objects, all ShapeElement derived-classes - RectangleShapeElement, OvalShapeElement, LineShapeElement, PolygonShapeElement, StarShapeElement, CalloutShapeElement and PathShapeElement objects - can be "affected" by more than one Action due to they feature an Actions property of type Neodynamic.WebControls.ImageDraw.ActionCollection.
Visit Neodynamic's website.