Is it possible to have an image inside ExpanderSymbol Nodes?

Yes. It is possible to have an image inside ExpanderSymbol Nodes. We can achieve this in two ways.

• 1.Having Bitmap Nodes inside the ExpanderSymbol Nodes
• 2.Having a property called image for each symbol

1.Having Bitmap Nodes inside the ExpanderSymbol Nodes:

The ExpanderSymbol class should inherit from Rectangle, and in its constructor, we have to define a BitmapNode and append it.

C#

public EmployeeSymbol(float x, float y, float width, float height, float fCurveRadius, string path)
{
PointF pt = new PointF(x, y);
node = new BitmapNode(path);
node.PinPoint = pt;
node.Size = new System.Drawing.SizeF(120, 80);
node.LineStyle.LineColor = Color.Transparent;
this.AppendChild(node);
}
 

VB

Public Sub New(ByVal x As Single, ByVal y As Single, ByVal width As Single, ByVal height As Single, ByVal fCurveRadius As Single, ByVal path As String)
 Dim pt As PointF = New PointF(x, y)
node = New BitmapNode(path)
node.PinPoint = pt
node.Size = New System.Drawing.SizeF(120, 80)
node.LineStyle.LineColor = Color.Transparent
Me.AppendChild(node)
 End Sub
 

The above code snippet is used to append the Bitmap node inside an ExpanderSymbol. Here "path" denotes the path of the image, "pt" denotes the location of the image inside the symbol. It will be invoked using the following code,

C#

int x = (int)Session["X"];
int y = (int)Session["Y"];
string path = Server.MapPath(String.Empty);
path = path + @"\App_Data\Image.png";
EmployeeSymbol emplysymbol = new EmployeeSymbol(x, y, 110, 40, 12, path);
 

VB

Dim x As Integer = CInt(Session("X"))
Dim y As Integer = CInt(Session("Y"))
Dim path As String = Server.MapPath(String.Empty)
path = path & "\App_Data\Image.png"
Dim emplysymbol As EmployeeSymbol = New EmployeeSymbol(x, y, 110, 40, 12, path)

Here "x" and "y" values represents the position of the image on the node.

2.Having a property called image for each symbol:

Here we have to create a property called image for each symbol. When each symbol is drawn, we have to set the property, and the image is drawn on the symbol by overriding the Render method using the property value. The below code snippet is used to set the image property of each symbol:

C#

emplysymbol.Image = System.Drawing.Image.FromFile(datasrcpath + (string.Format(@"\Icons\image{0}.png", n)));
 

VB

Private emplysymbol.Image = System.Drawing.Image.FromFile(datasrcpath & (String.Format("\Icons\image{0}.png", n)))

The below Code snippet illustrate overriding the Render,

C#

protected override void Render(Graphics gfx)
{
    base.Render(gfx);
    gfx.DrawImage(this._Image, 20,10);
}

VB

Protected Overrides Sub Render(ByVal gfx As Graphics)
 MyBase.Render(gfx)
 gfx.DrawImage(Me._Image, 20,10)
End Sub

Conclusion

I hope you enjoyed learning about whether it is possible to have an image inside ExpanderSymbol Nodes.

You can refer to the WinForms Diagram feature tour page to learn about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our WinForms Diagram example to understand how to create and manipulate data.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion®, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!