menu

Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class ContainerHeader - Blazor API Reference | Syncfusion

    Show / Hide Table of Contents

    Class ContainerHeader

    Represents the header for a Container, providing additional details such as a title, label, or other descriptive information.

    Inheritance
    System.Object
    DiagramObject
    NodeBase
    ContainerHeader
    Implements
    IDiagramObject
    System.ICloneable
    Inherited Members
    DiagramObject.GetParent()
    DiagramObject.OnPropertyChanged(String, Object, Object, IDiagramObject)
    NodeBase.AdditionalInfo
    NodeBase.CanAutoLayout
    NodeBase.Flip
    NodeBase.FlipMode
    NodeBase.ID
    NodeBase.IsVisible
    NodeBase.Margin
    NodeBase.SearchTags
    NodeBase.Tooltip
    NodeBase.ZIndex
    Namespace: Syncfusion.Blazor.Diagram
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class ContainerHeader : NodeBase, IDiagramObject, ICloneable
    Examples
    @code
    {
    protected override void OnInitialized()
       {
           Container container = new Container()
           {
               ID = "container",
               Header = new ContainerHeader()
               {
                   ID = "containerHeader",
                   Annotation = new ShapeAnnotation()
                   {
                       Content = "New Container"
                   },
                   Style = new TextStyle()
                   {
                       Fill = "yellow"
                   },
                   Height = 50
               },
               Height = 200, Width = 200
           };
       }
    }

    Constructors

    ContainerHeader()

    Initializes a new instance of the ContainerHeader class. Sets default values for height, property name, annotation, and style.

    Declaration
    public ContainerHeader()

    ContainerHeader(ContainerHeader)

    Initializes a new instance of the ContainerHeader class by copying the properties from another instance.

    Declaration
    public ContainerHeader(ContainerHeader header)
    Parameters
    Type Name Description
    ContainerHeader header

    The ContainerHeader instance to copy properties from.

    Properties

    Annotation

    Gets or sets the annotation of the header.

    Declaration
    public ShapeAnnotation Annotation { get; set; }
    Property Value
    Type Description
    ShapeAnnotation

    A ShapeAnnotation representing the content displayed in the header. No default value is assigned.

    Remarks

    The annotation provides the content displayed in the header of the Container.

    Examples

    Below is an example of how to set the annotation for a container header:

    @using Syncfusion.Blazor.Diagram
    <SfDiagramComponent @ref="@diagram" Height= "600px" Nodes= "@nodes" Connectors="@connectors" />
    @code
    {
    SfDiagramComponent diagram;
    // Initialize the node collection
    DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
    // Initialize the connector collection
    DiagramObjectCollection<Connector> connectors = new DiagramObjectCollection<Connector>();
    protected override void OnInitialized()
    {
        Node node1 = new Node()
        {
            ID = "node1",
            Height = 50,
            Width = 50,
            OffsetX = 100,
            OffsetY = 200
        };
        Node node2 = new Node()
        {
            ID = "node2",
            Height = 50,
            Width = 50,
            OffsetX = 200,
            OffsetY = 200
        };
        Connector connector = new Connector()
        {
            ID = "connector",
            SourcePoint = new DiagramPoint() { X = 300, Y = 200 },
            TargetPoint = new DiagramPoint() { X = 400, Y = 300 }
        };
        Container container = new Container()
        {
            ID = "container",
            Header = new ContainerHeader()
            {
                ID = "containerHeader",
                Annotation = new ShapeAnnotation()
                {
                    Content = "New Container"
                },
                Style = new TextStyle()
                {
                    Fill = "yellow"
                },
                Height = 50
            },
            Children = new string[] { "node1", "node2", "connector" },
            Height = 200, Width = 200
        };
        nodes.Add(node1);
        nodes.Add(node2);
        connectors.Add(connector);
        nodes.Add(container);
    }
    }

    Height

    Gets or sets the height of the container header.

    Declaration
    public Nullable<double> Height { get; set; }
    Property Value
    Type Description
    System.Nullable<System.Double>

    A System.Double representing the height of the container header. The default value is null.

    Remarks

    This property is used to define the height of the header in a container within the diagram.

    Examples
    @using Syncfusion.Blazor.Diagram
    <SfDiagramComponent @ref="@diagram" Height= "600px" Nodes= "@nodes" Connectors="@connectors" />
    @code
    {
    SfDiagramComponent diagram;
    //Initialize the node collection
    DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
    //Initialize the connector collection
    DiagramObjectCollection<Connector> connectors = new DiagramObjectCollection<Connector>();
    protected override void OnInitialized()
       {
           Node node1 = new Node()
           {
               ID = "node1",
               Height = 50,
               Width = 50,
               OffsetX = 100,
               OffsetY = 200
           };
           Node node2 = new Node()
           {
               ID = "node2",
               Height = 50,
               Width = 50,
               OffsetX = 200,
               OffsetY = 200
           };
           Connector connector = new Connector()
           {
               ID = "connector",
               SourcePoint = new DiagramPoint() { X = 300, Y = 200 },
               TargetPoint = new DiagramPoint() { X = 400, Y = 300 }
           };
           Container container = new Container()
           {
               ID = "container",
               Header = new ContainerHeader()
               {
                   ID = "containerHeader",
                   Annotation = new ShapeAnnotation()
                   {
                       Content = "New Container"
                   },
                   Style = new TextStyle()
                   {
                       Fill = "yellow"
                   },
                   Height = 50
               },
               Children = new string[] { "node1", "node2", "connector" },
               Height = 200, Width = 200
           };
           nodes.Add(node1);
           nodes.Add(node2);
           connectors.Add(connector);
           nodes.Add(container);
       }
    }

    Style

    Gets or sets the style of the header text, providing customization options such as font size, color, and alignment.

    Declaration
    public TextStyle Style { get; set; }
    Property Value
    Type Description
    TextStyle

    A TextStyle instance representing the style settings to be applied.

    Remarks

    This property allows for custom styling of the header text to enhance the visual presentation within the diagram component.

    Examples
    @using Syncfusion.Blazor.Diagram
    <SfDiagramComponent @ref="@diagram" Height= "600px" Nodes= "@nodes" Connectors="@connectors"/>
    @code
    {
    SfDiagramComponent diagram;
    // Initialize the node collection
    DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
    // Initialize the connector collection
    DiagramObjectCollection<Connector> connectors = new DiagramObjectCollection<Connector>();
    protected override void OnInitialized()
    {
        Node node1 = new Node()
        {
            ID = "node1",
            Height = 50,
            Width = 50,
            OffsetX = 100,
            OffsetY = 200
        };
        Node node2 = new Node()
        {
            ID = "node2",
            Height = 50,
            Width = 50,
            OffsetX = 200,
            OffsetY = 200
        };
        Connector connector = new Connector()
        {
            ID = "connector",
            SourcePoint = new DiagramPoint() { X = 300, Y = 200 },
            TargetPoint = new DiagramPoint() { X = 400, Y = 300 }
        };
        Container container = new Container()
        {
            ID = "container",
            Header = new ContainerHeader()
            {
                ID = "containerHeader",
                Annotation = new ShapeAnnotation()
                {
                    Content = "New Container"
                },
                Style = new TextStyle()
                {
                    Fill = "yellow"
                },
                Height = 50
            },
            Children = new string[] { "node1", "node2", "connector" },
            Height = 200, Width = 200
        };
        nodes.Add(node1);
        nodes.Add(node2);
        connectors.Add(connector);
        nodes.Add(container);
    }
    }

    Width

    Gets or sets the width of the container header. Represents the horizontal dimension of the container's header area.

    Declaration
    public Nullable<double> Width { get; set; }
    Property Value
    Type Description
    System.Nullable<System.Double>

    A System.Double representing the width of the container header. The default value is null.

    Remarks

    This width determines how much horizontal space the header of the container occupies within a diagram.

    Examples
    @using Syncfusion.Blazor.Diagram
    <SfDiagramComponent @ref="@diagram" Height= "600px" Nodes= "@nodes" Connectors="@connectors"/>
    @code
    {
    SfDiagramComponent diagram;
    //Initialize the node collection
    DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
    //Initialize the connector collection
    DiagramObjectCollection<Connector> connectors = new DiagramObjectCollection<Connector>();
    protected override void OnInitialized()
       {
           Node node1 = new Node()
           {
               ID = "node1",
               Height = 50,
               Width = 50,
               OffsetX = 100,
               OffsetY = 200
           };
           Node node2 = new Node()
           {
               ID = "node2",
               Height = 50,
               Width = 50,
               OffsetX = 200,
               OffsetY = 200
           };
           Connector connector = new Connector()
           {
               ID = "connector",
               SourcePoint = new DiagramPoint() { X = 300, Y = 200 },
               TargetPoint = new DiagramPoint() { X = 400, Y = 300 }
           };
           Container container = new Container()
           {
               ID = "container",
               Header = new ContainerHeader()
               {
                   ID = "containerHeader",
                   Annotation = new ShapeAnnotation()
                   {
                       Content = "New Container"
                   },
                   Style = new TextStyle()
                   {
                       Fill = "yellow"
                   },
                   Height = 50, Width = 200
               },
               Children = new string[] { "node1", "node2", "connector" },
               Height = 200, Width = 200
           };
           nodes.Add(node1);
           nodes.Add(node2);
           connectors.Add(connector);
           nodes.Add(container);
       }
    }

    Methods

    Clone()

    Creates a new instance of the ContainerHeader class that is a copy of the current instance.

    Declaration
    public override object Clone()
    Returns
    Type Description
    System.Object

    A new ContainerHeader object that is a copy of this instance.

    Overrides
    NodeBase.Clone()

    Implements

    IDiagramObject
    System.ICloneable
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved