Expand Collapse Command in WPF Diagram (SfDiagram)

29 Jan 20252 minutes to read

The ExpandCollapse command is used to show or hide children and view only the relevant nodes in the diagram. The ExpandCollapse command will be executed with the ExpandCollapseParameter, where the parameter contains the information about node that need to be expanded or collapsed. The IsExpanded property of node is used to expand or collapse the children nodes.

ExpandCollapseParameter

The ExpandCollapseParameter is used to compress a view of a hierarchy so that only the roots of each elements are visible. The opposite of collapse is expand that makes the entire elements visible.

Node

The Node property is used to set the node that is to be act as root element.

IsUpdateLayout

The IsUpdateLayout property is used to set whether the layout to be updated or not after the command execution.

C#

if (args.Item is NodeViewModel && (args.Item as NodeViewModel).IsExpanded)
{
    ExpandCollapseParameter param = new ExpandCollapseParameter()
    {
        IsUpdateLayout = true,

        // Set the node that is going to be show or hide its children
        node = args.Item as NodeViewModel,
    };

    IGraphInfo graphinfo = diagramcontrol.Info as IGraphInfo;

    //Show or hide the children of node.
    graphinfo.Commands.ExpandCollapse.Execute(param);
    (args.Item as NodeViewModel).IsExpanded = false;
}
else
{
    ExpandCollapseParameter param = new ExpandCollapseParameter()
    {
        IsUpdateLayout = true,

        // Set the node that is going to be show or hide its children
        node = args.Item as NodeViewModel,
    };
    IGraphInfo graphinfo = diagramcontrol.Info as IGraphInfo;

    //Show or hide the children of node.
    graphinfo.Commands.ExpandCollapse.Execute(param);
    (args.Item as NodeViewModel).IsExpanded = true;
}

View sample in GitHub