Class Phase
Represents a phase is the subprocess which will split each lanes as horizontally or vertically based on the Swimlane orientation.
Inherited Members
Namespace: Syncfusion.Blazor.Diagram
Assembly: Syncfusion.Blazor.dll
Syntax
public class Phase : SwimlaneChild, IDiagramObject, ICloneableRemarks
Phases are used within swimlanes to organize and structure the flow of the business process, providing a clear representation of different stages or steps.
Examples
The following example demonstrates how to add a phase to a swimlane:
<SfDiagramComponent Height="600px" Width="90%" Swimlanes="@swimlaneCollections">
</SfDiagramComponent>
@code {
DiagramObjectCollection<Swimlane> swimlaneCollections = new DiagramObjectCollection<Swimlane>();
protected override void OnInitialized()
{
swimlaneCollections = new DiagramObjectCollection<Swimlane>()
{
new Swimlane()
{
ID = "swimlane1",
Orientation = Orientation.Horizontal,
Height = 200,
Width = 450,
Phases = new DiagramObjectCollection<Phase>()
{
new Phase()
{
Header = new SwimlaneHeader ()
{
Annotation = new Annotation()
{
Content = "Header of phase"
}
},
Width= 450
}
}
}
};
}
} Constructors
Phase()
Initializes a new instance of the Phase
Declaration
public Phase()Phase(Phase)
Initializes a new instance of the Phase class by copying the values from an existing phase.
Declaration
public Phase(Phase src)Parameters
| Type | Name | Description |
|---|---|---|
| Phase | src | The source Phase to copy from. |
Properties
Header
Gets or sets the header of the phase.
Declaration
public SwimlaneHeader Header { get; set; }Property Value
| Type | Description |
|---|---|
| SwimlaneHeader | A SwimlaneHeader object representing the phase's header. The default value is null. |
Remarks
The header defines the title of the phase and provides identifiable annotation within the phase layout.
Examples
The following example demonstrates how to set the header of a phase:
<SfDiagramComponent Height="600px" Width="90%" Swimlanes="@swimlaneCollections">
</SfDiagramComponent>
@code {
DiagramObjectCollection<Swimlane> swimlaneCollections = new DiagramObjectCollection<Swimlane>();
protected override void OnInitialized()
{
swimlaneCollections = new DiagramObjectCollection<Swimlane>()
{
new Swimlane()
{
ID = "swimlane1",
Orientation = Orientation.Horizontal,
Height = 200,
Width = 450,
Phases = new DiagramObjectCollection<Phase>()
{
new Phase()
{
Header = new SwimlaneHeader()
{
Annotation = new Annotation()
{
Content = "Header of phase"
}
},
Width = 450
}
}
}
};
}
}Orientation
Gets or sets the orientation of the phase.
Declaration
public Orientation Orientation { get; set; }Property Value
| Type | Description |
|---|---|
| Orientation | An Orientation representing the orientation of the phase.
The default value is |
Remarks
The orientation specifies whether the phase is displayed horizontally or vertically. This property is applicable only when the phase is added to a Syncfusion.Blazor.Diagram.SymbolPalette.
Examples
The following example demonstrates how to set the orientation of a phase:
<SfSymbolPaletteComponent Width="100%" Height="1000px" Palettes="@Palettes" SymbolHeight="50"
SymbolWidth="50"></SfSymbolPaletteComponent>
@code {
DiagramObjectCollection<Palette> Palettes = new DiagramObjectCollection<Palette>();
protected override void OnInitialized()
{
// Horizontal phase
Phase horizontalPhase = new Phase() { Orientation = Orientation.Horizontal };
// Vertical phase
Phase verticalPhase = new Phase() { Orientation = Orientation.Vertical };
DiagramObjectCollection<Nodebase> SymbolCollection = new DiagramObjectCollection<Nodebase>(){
horizontalPhase, verticalPhase
};
Palettes = new DiagramObjectCollection<Palette>()
{
new Palette() { Symbols = SymbolCollection, Title = "Swimlane Shapes" },
};
}
}Style
Gets or sets the style of the phase.
Declaration
public ShapeStyle Style { get; set; }Property Value
| Type | Description |
|---|---|
| ShapeStyle | A ShapeStyle representing the visual styling applied to the phase. The default value is null. |
Remarks
Use this property to customize the phase's appearance, for instance, by defining its background color, border properties, or shadow effects.
Examples
The following example demonstrates how to set the style of a phase:
<SfDiagramComponent Height="600px" Width="90%" Swimlanes="@swimlaneCollections">
</SfDiagramComponent>
@code {
DiagramObjectCollection<Swimlane> swimlaneCollections = new DiagramObjectCollection<Swimlane>();
protected override void OnInitialized()
{
swimlaneCollections = new DiagramObjectCollection<Swimlane>()
{
new Swimlane()
{
ID = "swimlane1",
Orientation = Orientation.Horizontal,
Height = 200,
Width = 450,
Phases = new DiagramObjectCollection<Phase>()
{
new Phase()
{
Header = new SwimlaneHeader ()
{
Annotation = new Annotation()
{
Content = "Header of phase"
}
},
Style = new ShapeStyle()
{
Fill = "lightblue",
Stroke = "black",
StrokeWidth = 2,
Shadow = new ShadowStyle()
{
Color = "gray",
Blur = 5,
OffsetX = 2,
OffsetY = 2
}
},
Width = 450
}
}
}
};
}
}Methods
Clone()
Creates a new instance of the Phase class that is a copy of the current instance.
Declaration
public override object Clone()Returns
| Type | Description |
|---|---|
| System.Object | A new Phase object that is a copy of this instance. |