From d7565612744f1e94c7a48817b34628ea1d71b9ed Mon Sep 17 00:00:00 2001 From: SriRam4552 Date: Tue, 3 Feb 2026 15:11:51 +0530 Subject: [PATCH] 1007315: SymbolPalette --- .../AddConnectorToSymbolPalette.razor | 24 +- .../SymbolPalette/AddGroupToPalette.razor | 28 +- .../SymbolPalette/AddNodeToPalette.razor | 30 +- .../AddPaletteToSymbolPalette.razor | 36 +-- .../AddRemovePaletteAtRuntime.razor | 34 +-- .../AddRemoveSymbolAtRuntime.razor | 34 +-- .../SymbolPalette/AnimationSupport.razor | 20 +- .../SymbolPalette/CreateSymbolPalette.razor | 10 +- .../SymbolPalette/CustomSymbolSize.razor | 85 ++++++ .../SymbolPalette/DescriptionStyle.razor | 18 +- .../Pages/SymbolPalette/DragAndDrop.razor | 61 ++-- .../SymbolPalette/EnableChunkMessage.razor | 25 +- .../Pages/SymbolPalette/GroupSample.razor | 67 ++-- .../SymbolPalette/PaletteExpandMode.razor | 287 +++++++++-------- .../Pages/SymbolPalette/PaletteHeader.razor | 40 +-- .../Pages/SymbolPalette/RefereshPalette.razor | 38 +-- .../Pages/SymbolPalette/SearchOption.razor | 263 ++++++++-------- .../Pages/SymbolPalette/SearchTag.razor | 36 ++- .../SymbolPalette/SelectionChanged.razor | 46 +-- .../Pages/SymbolPalette/ShowToolTip.razor | 46 +-- .../SymbolDescriptionSample.razor | 29 +- .../SymbolPalette/SymbolPaletteTemplate.razor | 16 +- .../SymbolPalette/SymbolPaletteTooltip.razor | 67 ++-- .../Pages/SymbolPalette/SymbolPreview.razor | 58 ++-- .../Pages/SymbolPalette/SymbolStretch.razor | 50 +-- .../AddConnectorToSymbolPalette.razor | 24 +- .../SymbolPalette/AddGroupToPalette.razor | 28 +- .../SymbolPalette/AddNodeToPalette.razor | 30 +- .../AddPaletteToSymbolPalette.razor | 36 +-- .../AddRemovePaletteAtRuntime.razor | 34 +-- .../AddRemoveSymbolAtRuntime.razor | 34 +-- .../SymbolPalette/AnimationSupport.razor | 20 +- .../SymbolPalette/CreateSymbolPalette.razor | 10 +- .../SymbolPalette/CustomSymbolSize.razor | 85 ++++++ .../SymbolPalette/DescriptionStyle.razor | 19 +- .../Pages/SymbolPalette/DragAndDrop.razor | 61 ++-- .../SymbolPalette/EnableChunkMessage.razor | 25 +- .../Pages/SymbolPalette/GroupSample.razor | 67 ++-- .../SymbolPalette/PaletteExpandMode.razor | 289 ++++++++++-------- .../Pages/SymbolPalette/PaletteHeader.razor | 40 +-- .../Pages/SymbolPalette/RefereshPalette.razor | 38 +-- .../Pages/SymbolPalette/SearchOption.razor | 263 ++++++++-------- .../Wasm/Pages/SymbolPalette/SearchTag.razor | 36 ++- .../SymbolPalette/SelectionChanged.razor | 46 +-- .../Pages/SymbolPalette/ShowToolTip.razor | 46 +-- .../SymbolDescriptionSample.razor | 29 +- .../SymbolPalette/SymbolPaletteTemplate.razor | 16 +- .../SymbolPalette/SymbolPaletteTooltip.razor | 67 ++-- .../Pages/SymbolPalette/SymbolPreview.razor | 58 ++-- .../Pages/SymbolPalette/SymbolStretch.razor | 50 +-- 50 files changed, 1626 insertions(+), 1273 deletions(-) create mode 100644 Diagram/Server/Pages/SymbolPalette/CustomSymbolSize.razor create mode 100644 Diagram/Wasm/Pages/SymbolPalette/CustomSymbolSize.razor diff --git a/Diagram/Server/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor b/Diagram/Server/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor index 15afb4fe..071b748c 100644 --- a/Diagram/Server/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor +++ b/Diagram/Server/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor @@ -6,8 +6,8 @@
- +
@@ -15,14 +15,14 @@ @code { - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpalette + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); // Defines palette's connector collection - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -31,11 +31,11 @@ private void InitPaletteModel() { - PaletteConnectors = new DiagramObjectCollection(); + _paletteConnectors = new DiagramObjectCollection(); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteConnectors,Title="Connectors" ,IsExpanded = true}, + new Palette(){ Symbols = _paletteConnectors, Title = "Connectors" ,IsExpanded = true }, }; } @@ -56,6 +56,6 @@ } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } } diff --git a/Diagram/Server/Pages/SymbolPalette/AddGroupToPalette.razor b/Diagram/Server/Pages/SymbolPalette/AddGroupToPalette.razor index 549c98d5..74391eaf 100644 --- a/Diagram/Server/Pages/SymbolPalette/AddGroupToPalette.razor +++ b/Diagram/Server/Pages/SymbolPalette/AddGroupToPalette.razor @@ -6,8 +6,8 @@
- +
@@ -15,20 +15,20 @@ @code { - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the symbol palette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's group collection - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -39,9 +39,9 @@ { CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols=PaletteGroup,Title="Group Shapes",IsExpanded=true} + new Palette(){ Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -68,15 +68,15 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } } diff --git a/Diagram/Server/Pages/SymbolPalette/AddNodeToPalette.razor b/Diagram/Server/Pages/SymbolPalette/AddNodeToPalette.razor index 28f3bd2f..13dc2f5f 100644 --- a/Diagram/Server/Pages/SymbolPalette/AddNodeToPalette.razor +++ b/Diagram/Server/Pages/SymbolPalette/AddNodeToPalette.razor @@ -6,8 +6,8 @@
- +
@@ -17,15 +17,15 @@ @code { - //Reference the symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpreview + private DiagramSize _symbolPreview; + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -34,14 +34,14 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Flow Shapes",ID="Flow Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, }; } @@ -54,6 +54,6 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } } diff --git a/Diagram/Server/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor b/Diagram/Server/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor index 2d1fc192..54793917 100644 --- a/Diagram/Server/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor +++ b/Diagram/Server/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor @@ -6,8 +6,8 @@
- +
@@ -15,22 +15,22 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SfSymbolPaletteComponent _symbolPalette; + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); // Defines palette's group collection. - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); // Defines palette's connector collection. - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -42,11 +42,11 @@ CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Flow Shapes", ID = "Flow Shapes" }, - new Palette(){Symbols = PaletteConnectors,Title = "Connectors", IsExpanded = true}, - new Palette(){Symbols = PaletteGroup,Title = "Group Shapes", IsExpanded = true} + new Palette(){ Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette(){ Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette(){ Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -58,7 +58,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void CreatePaletteConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape) @@ -76,7 +76,7 @@ Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } private void CreatePaletteGroup() @@ -101,13 +101,13 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor b/Diagram/Server/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor index 06ff42bc..1c8ac119 100644 --- a/Diagram/Server/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor +++ b/Diagram/Server/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor @@ -10,8 +10,8 @@
- +
@@ -20,15 +20,15 @@ @code { - //Reference the symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpreview + private DiagramSize _symbolPreview; + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -37,14 +37,14 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Flow Shapes",ID="Flow Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, }; } @@ -57,7 +57,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void AddPalette() @@ -73,11 +73,11 @@ { new Palette(){Symbols = newNodes,Title = "BasicShapes",ID = "BasicShapes" }, }; - symbolpalette.AddPalettes(newPalettes); + _symbolPalette.AddPalettes(newPalettes); } private void RemovePalette() { - symbolpalette.RemovePalettes("BasicShapes"); + _symbolPalette.RemovePalettes("BasicShapes"); } } diff --git a/Diagram/Server/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor b/Diagram/Server/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor index 6f974996..e28581c8 100644 --- a/Diagram/Server/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor +++ b/Diagram/Server/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor @@ -10,8 +10,8 @@
- +
@@ -20,15 +20,15 @@ @code { - //Reference the symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpreview + private DiagramSize _symbolPreview; + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -37,14 +37,14 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="FlowShapes",ID="FlowShapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "FlowShapes", ID = "FlowShapes" }, }; } @@ -57,7 +57,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void AddSymbol() @@ -67,11 +67,11 @@ ID = "Decision", Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.Decision } }; - symbolpalette.AddPaletteItem("FlowShapes", decision, false); + _symbolPalette.AddPaletteItem("FlowShapes", decision, false); } private void RemoveSymbol() { - symbolpalette.RemovePaletteItem("FlowShapes", "Decision"); + _symbolPalette.RemovePaletteItem("FlowShapes", "Decision"); } } diff --git a/Diagram/Server/Pages/SymbolPalette/AnimationSupport.razor b/Diagram/Server/Pages/SymbolPalette/AnimationSupport.razor index 83bedad5..f99db75a 100644 --- a/Diagram/Server/Pages/SymbolPalette/AnimationSupport.razor +++ b/Diagram/Server/Pages/SymbolPalette/AnimationSupport.razor @@ -6,8 +6,8 @@
- +
@@ -15,18 +15,18 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SfSymbolPaletteComponent _symbolPalette; + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -38,9 +38,9 @@ CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); CreatePaletteNode(NodeBasicShapes.Ellipse, "Ellipse"); CreatePaletteNode(NodeBasicShapes.Star, "Star"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -53,6 +53,6 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/CreateSymbolPalette.razor b/Diagram/Server/Pages/SymbolPalette/CreateSymbolPalette.razor index 4eb982a4..2ac38daa 100644 --- a/Diagram/Server/Pages/SymbolPalette/CreateSymbolPalette.razor +++ b/Diagram/Server/Pages/SymbolPalette/CreateSymbolPalette.razor @@ -4,13 +4,13 @@ @using Syncfusion.Blazor.Diagram @* Initializes the symbol palette *@ - + @code { - //Reference the symbol palette - private SfSymbolPaletteComponent SymbolPalette; - //Initialize the palettes collection - private DiagramObjectCollection palettes = new DiagramObjectCollection(); + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + // Initialize the palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/CustomSymbolSize.razor b/Diagram/Server/Pages/SymbolPalette/CustomSymbolSize.razor new file mode 100644 index 00000000..154cc2f8 --- /dev/null +++ b/Diagram/Server/Pages/SymbolPalette/CustomSymbolSize.razor @@ -0,0 +1,85 @@ +@page "/CustomSymbolSize" + +@using Syncfusion.Blazor.Diagram +@using Syncfusion.Blazor.Diagram.SymbolPalette +@using Syncfusion.Blazor.Buttons + +
+
+ + +
+
+
+ + +
+
+
+ +@code { + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + private double _symbolWidth = 60; + private double _symbolHeight = 60; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + + // Defines palette's flow-shape collection + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + + protected override void OnInitialized() + { + InitPaletteModel(); + } + + private void InitPaletteModel() + { + Node node1 = new Node() + { + ID = "Rectangle", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + }; + + Node node2 = new Node() + { + ID = "Ellipse", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + }; + + Node node3 = new Node() + { + ID = "Diamond", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Diamond }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + }; + + _paletteNodes.Add(node1); + _paletteNodes.Add(node2); + _paletteNodes.Add(node3); + + _palettes = new DiagramObjectCollection() + { + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, + }; + } + + // Method to update symbol width and symbol height + private void UpdateSize() + { + _symbolWidth = 80; + _symbolHeight = 80; + } +} + diff --git a/Diagram/Server/Pages/SymbolPalette/DescriptionStyle.razor b/Diagram/Server/Pages/SymbolPalette/DescriptionStyle.razor index 0ea95403..3a317913 100644 --- a/Diagram/Server/Pages/SymbolPalette/DescriptionStyle.razor +++ b/Diagram/Server/Pages/SymbolPalette/DescriptionStyle.razor @@ -6,8 +6,8 @@
- +
@@ -15,11 +15,11 @@ @code { - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SfSymbolPaletteComponent _symbolPalette; + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's basic-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -31,9 +31,9 @@ CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); CreatePaletteNode(NodeBasicShapes.Ellipse, "Ellipse"); CreatePaletteNode(NodeBasicShapes.Hexagon, "Hexagon"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -45,7 +45,7 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) diff --git a/Diagram/Server/Pages/SymbolPalette/DragAndDrop.razor b/Diagram/Server/Pages/SymbolPalette/DragAndDrop.razor index 50048713..63d5f48f 100644 --- a/Diagram/Server/Pages/SymbolPalette/DragAndDrop.razor +++ b/Diagram/Server/Pages/SymbolPalette/DragAndDrop.razor @@ -133,13 +133,13 @@
- +
- +
@@ -148,32 +148,40 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfDiagramComponent diagram; - private SfSymbolPaletteComponent SymbolPalette; - //Define nodes collection. - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Define connectors collection. - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfDiagramComponent _diagram; + + private SfSymbolPaletteComponent _symbolPalette; + + // Define nodes collection. + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + + // Define connectors collection. + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + // Defines palette's group collection. - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); + // Defines palette's connector collection. - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override async Task OnAfterRenderAsync(bool firstRender) { - SymbolPalette.Targets = new DiagramObjectCollection() { }; - SymbolPalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } protected override void OnInitialized() @@ -186,11 +194,12 @@ CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Flow Shapes", ID = "Flow Shapes" }, - new Palette(){Symbols = PaletteConnectors,Title = "Connectors", IsExpanded = true}, - new Palette(){Symbols = PaletteGroup,Title = "Group Shapes", IsExpanded = true} + new Palette() { Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette() { Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette() { Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -202,7 +211,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void CreatePaletteConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape) @@ -220,7 +229,7 @@ Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } private void CreatePaletteGroup() @@ -245,13 +254,13 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/EnableChunkMessage.razor b/Diagram/Server/Pages/SymbolPalette/EnableChunkMessage.razor index 7da9e794..28ec1d6e 100644 --- a/Diagram/Server/Pages/SymbolPalette/EnableChunkMessage.razor +++ b/Diagram/Server/Pages/SymbolPalette/EnableChunkMessage.razor @@ -3,20 +3,21 @@ @using Syncfusion.Blazor.Diagram @using Syncfusion.Blazor.Diagram.SymbolPalette - + @code { - private DiagramSize symbolDragPreviewSize; - private DiagramObjectCollection palettes; - private double symbolHeight = 75; - private double symbolWidth = 75; + private DiagramSize _symbolDragPreviewSize; + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + private double _symbolHeight = 75; + private double _symbolWidth = 75; protected override void OnInitialized() { - symbolDragPreviewSize = new DiagramSize(); - symbolDragPreviewSize.Width = 80; - symbolDragPreviewSize.Height = 80; + _symbolDragPreviewSize = new DiagramSize(); + _symbolDragPreviewSize.Width = 80; + _symbolDragPreviewSize.Height = 80; + InitializeFloorPlannerPalettes(); } @@ -415,9 +416,9 @@ Palette DiningRoom = new Palette() { Symbols = DiningRoomSymbols, Title = "Dining Room", ID = "DiningRoom", IconCss = "e-ddb-icons e-flow" }; Palette Kitchen = new Palette() { Symbols = KitchenSymbols, Title = "Kitchen", ID = "Kitchen", IconCss = "e-ddb-icons e-flow" }; - palettes = new DiagramObjectCollection(); - palettes.Add(Door); - palettes.Add(DiningRoom); - palettes.Add(Kitchen); + _palettes = new DiagramObjectCollection(); + _palettes.Add(Door); + _palettes.Add(DiningRoom); + _palettes.Add(Kitchen); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/GroupSample.razor b/Diagram/Server/Pages/SymbolPalette/GroupSample.razor index adb2c9ef..253d65eb 100644 --- a/Diagram/Server/Pages/SymbolPalette/GroupSample.razor +++ b/Diagram/Server/Pages/SymbolPalette/GroupSample.razor @@ -133,8 +133,8 @@
- +
@@ -148,35 +148,43 @@ @code { - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the diagram - private SfDiagramComponent diagram; - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define nodes collection - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Define connectors collection - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + // Reference the diagram + private SfDiagramComponent _diagram; + + // Reference the symbolpalette + private SfSymbolPaletteComponent _symbolPalette; + + // Define nodes collection + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + + // Define connectors collection + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + // Defines palette's group collection - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); + // Defines palette's connector collection - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override async Task OnAfterRenderAsync(bool firstRender) { - symbolpalette.Targets = new DiagramObjectCollection() { }; - symbolpalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } protected override void OnInitialized() @@ -191,11 +199,11 @@ CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Flow Shapes",ID="Flow Shapes" }, - new Palette(){Symbols =PaletteConnectors,Title="Connectors" ,IsExpanded = true}, - new Palette(){Symbols=PaletteGroup,Title="Group Shapes",IsExpanded=true} + new Palette() { Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette() { Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette() { Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -208,7 +216,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } //Method to create palette connector @@ -228,7 +236,7 @@ } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } //Method to create palette group private void CreatePaletteGroup() @@ -253,15 +261,14 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } -} - +} \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/PaletteExpandMode.razor b/Diagram/Server/Pages/SymbolPalette/PaletteExpandMode.razor index 74fe704f..409f89db 100644 --- a/Diagram/Server/Pages/SymbolPalette/PaletteExpandMode.razor +++ b/Diagram/Server/Pages/SymbolPalette/PaletteExpandMode.razor @@ -4,104 +4,122 @@ @using Syncfusion.Blazor.Diagram.SymbolPalette @using Syncfusion.Blazor.DropDowns - + @code { - //Reference the symbolpalette - private SfSymbolPaletteComponent Palette; - //Define the symbolmargin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private int? index { get; set; } = 1; - //Define pallette collection - private DiagramObjectCollection Palettes; - private SfDropDownList Expandable; - private int? sizeChangeValue { get; set; } = 80; - private bool animationChecked = true; - private bool AnimationMode = true; - private bool icon = true; - private double SymbolHeight = 50; - private double SymbolWidth = 50; - private string Height { get; set; } = "580px"; - private double length = 70; - private DiagramObjectCollection ConnectorCollection { get; set; } - private SymbolInfo SymbolInfo { get; set; } - private DiagramObjectCollection BasicShape { get; set; } - private DiagramObjectCollection Connectors { get; set; } - private DiagramObjectCollection FlowShapess { get; set; } + // Reference the symbolpalette + private SfSymbolPaletteComponent _palette; + + // Define the symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + private int? _index { get; set; } = 1; + + // Define palette collection + private DiagramObjectCollection _palettes; + + private SfDropDownList _expandable; + + private int? _sizeChangeValue { get; set; } = 80; + + private bool _animationChecked = true; + + private bool _animationMode = true; + + private bool _icon = true; + + private double _symbolHeight = 50; + + private double _symbolWidth = 50; + + private string _height { get; set; } = "580px"; + + private double _length = 70; + + private DiagramObjectCollection _connectorCollection { get; set; } + + private SymbolInfo _symbolInfo { get; set; } + + private DiagramObjectCollection _basicShape { get; set; } + + private DiagramObjectCollection _connectors { get; set; } + + private DiagramObjectCollection _flowShapes { get; set; } private class Modevalue { public string Text { get; set; } public string Value { get; set; } } - private List ExpandMode = new List() { + private List _expandMode = new List() { new Modevalue { Text ="Single", Value= "Single" }, new Modevalue { Text = "Multiple", Value = "Multiple" }, }; - Syncfusion.Blazor.Navigations.ExpandMode ExpandModeType = Syncfusion.Blazor.Navigations.ExpandMode.Multiple; + private Syncfusion.Blazor.Navigations.ExpandMode _expandModeType = Syncfusion.Blazor.Navigations.ExpandMode.Multiple; private void ModeChange(Syncfusion.Blazor.DropDowns.ChangeEventArgs args) { - if (args.Value == "Multiple") { - Palette.Palettes[0].IsExpanded = true; - Palette.Palettes[1].IsExpanded = true; - Palette.Palettes[2].IsExpanded = true; + _palette.Palettes[0].IsExpanded = true; + _palette.Palettes[1].IsExpanded = true; + _palette.Palettes[2].IsExpanded = true; } else { - Palette.Palettes[0].IsExpanded = true; - Palette.Palettes[1].IsExpanded = false; - Palette.Palettes[2].IsExpanded = false; - + _palette.Palettes[0].IsExpanded = true; + _palette.Palettes[1].IsExpanded = false; + _palette.Palettes[2].IsExpanded = false; } + this.StateHasChanged(); } - private void sizeChange(Syncfusion.Blazor.Inputs.ChangeEventArgs args) + private void SizeChange(Syncfusion.Blazor.Inputs.ChangeEventArgs args) { - this.SymbolWidth = double.Parse(args.Value.ToString()); - this.SymbolHeight = double.Parse(args.Value.ToString()); - this.sizeChangeValue = int.Parse(args.Value.ToString()); + this._symbolWidth = double.Parse(args.Value.ToString()); + this._symbolHeight = double.Parse(args.Value.ToString()); + this._sizeChangeValue = int.Parse(args.Value.ToString()); this.StateHasChanged(); } - private void animationChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) + private void AnimationChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) { - this.animationChecked = args.Checked; - this.AnimationMode = args.Checked; + this._animationChecked = args.Checked; + this._animationMode = args.Checked; this.StateHasChanged(); } - private void iconChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) + private void IconChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) { - for (var i = 0; i < Palettes.Count; i++) + for (var i = 0; i < _palettes.Count; i++) { - this.icon = args.Checked; + this._icon = args.Checked; + if (args.Checked) { if (i == 0) { - Palettes[i].IconCss = "e-ddb-icons e-basic"; + _palettes[i].IconCss = "e-ddb-icons e-basic"; } else if (i == 1) { - Palettes[i].IconCss = "e-ddb-icons e-flow"; + _palettes[i].IconCss = "e-ddb-icons e-flow"; } else if (i == 2) { - Palettes[i].IconCss = "e-ddb-icons e-connector"; + _palettes[i].IconCss = "e-ddb-icons e-connector"; } } else { - Palettes[i].IconCss = ""; + _palettes[i].IconCss = string.Empty; } + this.StateHasChanged(); } } @@ -113,93 +131,118 @@ private void InitializePalatte() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - SymbolInfo = new SymbolInfo() - { - Fit = true - }; + _symbolInfo = new SymbolInfo() { Fit = true }; - BasicShape = new DiagramObjectCollection + _basicShape = new DiagramObjectCollection { new Node() { - ID="Rectangle" , Shape = new BasicShape(){ - Type = NodeShapes.Basic, Shape=NodeBasicShapes.Rectangle}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Rectangle", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Ellipse" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Ellipse }, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Ellipse", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Parallelogram" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Parallelogram }, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Parallelogram", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Parallelogram }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Triangle" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Triangle}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Triangle", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Triangle }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Hexagon" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Hexagon}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Hexagon", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Hexagon }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Pentagon" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Pentagon }, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Pentagon", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Pentagon }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Cylinder" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Cylinder}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Cylinder", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Cylinder }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Star" , Shape = new BasicShape(){ - Type =NodeShapes.Basic, Shape=NodeBasicShapes.Star}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} - }, + ID = "Star", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Star }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } + } }; - Connectors = new DiagramObjectCollection() + _connectors = new DiagramObjectCollection() { - new Connector(){ID="Link1" , Type = ConnectorSegmentType.Orthogonal ,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings() - { Shape=DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" }},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "Link1", + Type = ConnectorSegmentType.Orthogonal, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="link3" , Type=ConnectorSegmentType.Orthogonal,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings(){ Shape=DecoratorShape.None},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "link3", + Type = ConnectorSegmentType.Orthogonal, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.None }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="Link21" , Type=ConnectorSegmentType.Straight,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings() - { Shape=DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" }},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "Link21", + Type = ConnectorSegmentType.Straight, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="link23" , Type=ConnectorSegmentType.Straight,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings(){ Shape=DecoratorShape.None},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "link23", + Type = ConnectorSegmentType.Straight, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.None }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="link33" , Type=ConnectorSegmentType.Bezier,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings(){ Shape=DecoratorShape.None},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "link33", + Type = ConnectorSegmentType.Bezier, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.None }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } } }; - FlowShapess = new DiagramObjectCollection() + _flowShapes = new DiagramObjectCollection { new Node() { ID = "Terminator", - Style = new ShapeStyle(){StrokeWidth = 2, StrokeColor = "#757575" }, - Shape = new FlowShape() { Type = NodeShapes.Flow,Shape=NodeFlowShapes.Terminator } + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" }, + Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.Terminator } }, new Node() { @@ -235,8 +278,7 @@ { ID = "Direct Data", Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" }, - Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.DirectData - } + Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.DirectData } }, new Node() { @@ -246,36 +288,31 @@ } }; - Palettes.Add( - new Palette() - { - ID = "Flowshapess", - IsExpanded = true, - Symbols = FlowShapess, - Title = "Flowshapes", - IconCss = "e-ddb-icons e-flow" - } - ); - Palettes.Add( - new Palette() - { - ID = "BasicShape", - IsExpanded = true, - Symbols = BasicShape, - Title = "Basic Shapes", - IconCss = "e-ddb-icons e-basic" - } - ); + _palettes.Add(new Palette() + { + ID = "Flowshapess", + IsExpanded = true, + Symbols = _flowShapes, + Title = "Flowshapes", + IconCss = "e-ddb-icons e-flow" + }); - Palettes.Add( - new Palette() - { - ID = "Connectors", - IsExpanded = true, - Symbols = Connectors, - Title = "Connectors", - IconCss = "e-ddb-icons e-connector" - } - ); + _palettes.Add(new Palette() + { + ID = "BasicShape", + IsExpanded = true, + Symbols = _basicShape, + Title = "Basic Shapes", + IconCss = "e-ddb-icons e-basic" + }); + + _palettes.Add(new Palette() + { + ID = "Connectors", + IsExpanded = true, + Symbols = _connectors, + Title = "Connectors", + IconCss = "e-ddb-icons e-connector" + }); } } diff --git a/Diagram/Server/Pages/SymbolPalette/PaletteHeader.razor b/Diagram/Server/Pages/SymbolPalette/PaletteHeader.razor index 2920bdc1..66fdfb3b 100644 --- a/Diagram/Server/Pages/SymbolPalette/PaletteHeader.razor +++ b/Diagram/Server/Pages/SymbolPalette/PaletteHeader.razor @@ -13,8 +13,8 @@
- +
@@ -22,16 +22,20 @@ @code { - //Define symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the symbol palette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -46,11 +50,11 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -62,13 +66,13 @@ ID = "Star", Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Star } }; - symbolpalette.AddPaletteItem("Basic Shapes", Star, false); + _symbolPalette.AddPaletteItem("Basic Shapes", Star, false); } //Method to update heading private void UpdateHeading1() { - symbolpalette.RemovePaletteItem("Basic Shapes", "Star"); + _symbolPalette.RemovePaletteItem("Basic Shapes", "Star"); } //Method to update heading @@ -83,12 +87,12 @@ { new Palette(){Symbols =newNodes,Title="FlowShapes",ID="FlowShapes" }, }; - symbolpalette.AddPalettes(newPalettes); + _symbolPalette.AddPalettes(newPalettes); } private void UpdateHeading3() { - symbolpalette.RemovePalettes("FlowShapes"); + _symbolPalette.RemovePalettes("FlowShapes"); } } diff --git a/Diagram/Server/Pages/SymbolPalette/RefereshPalette.razor b/Diagram/Server/Pages/SymbolPalette/RefereshPalette.razor index 9d161cb6..4ce66c84 100644 --- a/Diagram/Server/Pages/SymbolPalette/RefereshPalette.razor +++ b/Diagram/Server/Pages/SymbolPalette/RefereshPalette.razor @@ -7,8 +7,8 @@
- +
@@ -17,18 +17,21 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -38,9 +41,10 @@ private void InitPaletteModel() { CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -50,22 +54,22 @@ { ID = id, Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, - Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" } }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { - SymbolInfo SymbolInfo = new SymbolInfo(); - string text = null; - text = (symbol as Node).ID; - SymbolInfo.Description = new SymbolDescription() { Text = text }; - return SymbolInfo; + SymbolInfo symbolInfo = new SymbolInfo(); + string text = (symbol as Node).ID; + symbolInfo.Description = new SymbolDescription() { Text = text }; + return symbolInfo; } private void RefreshSymbols() { - SymbolPalette.RefreshSymbols(); + _symbolPalette.RefreshSymbols(); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/SearchOption.razor b/Diagram/Server/Pages/SymbolPalette/SearchOption.razor index 9a8218a3..cd76b026 100644 --- a/Diagram/Server/Pages/SymbolPalette/SearchOption.razor +++ b/Diagram/Server/Pages/SymbolPalette/SearchOption.razor @@ -207,25 +207,25 @@ @*End:Hidden*@ @*End:Hidden*@
-
- + - + - + @@ -239,162 +239,156 @@ @code { @*Hidden:Lines*@ - private int? index { get; set; } = 1; - private int? sizeChangeValue { get; set; } = 75; - private bool icon = true; - private bool text = true; - private bool animation = true; - private bool animationCheckbox = true; + private int? _index { get; set; } = 1; + private int? _sizeChangeValue { get; set; } = 75; + private bool _icon = true; + private bool _text = true; + private bool _animation = true; + private bool _animationCheckbox = true; @*End:Hidden*@ - private DiagramSize symbolDragPreviewSize; - private SymbolExpandMode paletteExpandMode = SymbolExpandMode.Multiple; - private SymbolInfo SymbolInfo = new SymbolInfo(); - private SfDiagramComponent Diagram; - private SfSymbolPaletteComponent palette; - private DiagramObjectCollection palettes; - private double symbolHeight = 75; - private double symbolWidth = 75; - private DiagramObjectCollection basicShapes { get; set; } - private DiagramObjectCollection connectors { get; set; } - private DiagramObjectCollection flowShapes { get; set; } + + private DiagramSize _symbolDragPreviewSize; + private SymbolExpandMode _paletteExpandMode = SymbolExpandMode.Multiple; + private SymbolInfo _symbolInfo = new SymbolInfo(); + private SfDiagramComponent _diagram; + private SfSymbolPaletteComponent _palette; + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + private double _symbolHeight = 75; + private double _symbolWidth = 75; + private DiagramObjectCollection _basicShapes = new DiagramObjectCollection(); + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + private DiagramObjectCollection _flowShapes = new DiagramObjectCollection(); + // Defines interval values for GridLines - private double[] GridLineIntervals { get; set; } - //Defines Diagram's Nodes collection - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Defines Diagram's Connectors collection - private DiagramObjectCollection diagramConnectors = new DiagramObjectCollection(); + private double[] _gridLineIntervals { get; set; } + + // Defines Diagram's Nodes collection + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + // Defines Diagram's Connectors collection + private DiagramObjectCollection _diagramConnectors = new DiagramObjectCollection(); + [Inject] - protected IJSRuntime jsRuntime { get; set; } - @*Hidden:Lines*@ - @*End:Hidden*@ + protected IJSRuntime _jsRuntime { get; set; } protected override async Task OnAfterRenderAsync(bool firstRender) { await base.OnAfterRenderAsync(firstRender); - palette.Targets = new DiagramObjectCollection + _palette.Targets = new DiagramObjectCollection { - Diagram + _diagram }; } protected override void OnInitialized() { - - symbolDragPreviewSize = new DiagramSize(); - symbolDragPreviewSize.Width = 80; - symbolDragPreviewSize.Height = 80; - GridLineIntervals = new double[] { 1, 9, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75 }; - InitializePalatte(); + _symbolDragPreviewSize = new DiagramSize(); + _symbolDragPreviewSize.Width = 80; + _symbolDragPreviewSize.Height = 80; + + _gridLineIntervals = new double[] { 1, 9, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75 }; + InitializePalette(); } - private void InitializePalatte() + private void InitializePalette() { - palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); // palette which contains basic shape nodes - basicShapes = new DiagramObjectCollection + _basicShapes = new DiagramObjectCollection { - CreateBasicNode("Rectangle",NodeBasicShapes.Rectangle), - CreateBasicNode("Ellipse",NodeBasicShapes.Ellipse), - CreateBasicNode("Diamond",NodeBasicShapes.Diamond), - CreateBasicNode("Triangle",NodeBasicShapes.Triangle), - CreateBasicNode("Hexagon",NodeBasicShapes.Hexagon), - CreateBasicNode("Pentagon",NodeBasicShapes.Pentagon), - CreateBasicNode("Cylinder",NodeBasicShapes.Cylinder), - CreateBasicNode("Star",NodeBasicShapes.Star), - CreateBasicNode("Octagon",NodeBasicShapes.Octagon), - CreateBasicNode("Plus",NodeBasicShapes.Plus), - CreateBasicNode("Heptagon",NodeBasicShapes.Heptagon), + CreateBasicNode("Rectangle", NodeBasicShapes.Rectangle), + CreateBasicNode("Ellipse", NodeBasicShapes.Ellipse), + CreateBasicNode("Diamond", NodeBasicShapes.Diamond), + CreateBasicNode("Triangle", NodeBasicShapes.Triangle), + CreateBasicNode("Hexagon", NodeBasicShapes.Hexagon), + CreateBasicNode("Pentagon", NodeBasicShapes.Pentagon), + CreateBasicNode("Cylinder", NodeBasicShapes.Cylinder), + CreateBasicNode("Star", NodeBasicShapes.Star), + CreateBasicNode("Octagon", NodeBasicShapes.Octagon), + CreateBasicNode("Plus", NodeBasicShapes.Plus), + CreateBasicNode("Heptagon", NodeBasicShapes.Heptagon), }; // palette which contains connectors - connectors = new DiagramObjectCollection() + _connectors = new DiagramObjectCollection { - CreateConnector("link1",ConnectorSegmentType.Orthogonal,DecoratorShape.Arrow), - CreateConnector("link2",ConnectorSegmentType.Orthogonal,DecoratorShape.None), - CreateConnector("link3",ConnectorSegmentType.Straight,DecoratorShape.Arrow), - CreateConnector("link4",ConnectorSegmentType.Straight,DecoratorShape.None), - CreateConnector("link5",ConnectorSegmentType.Bezier,DecoratorShape.None), - CreateConnector("link6",ConnectorSegmentType.Bezier, DecoratorShape.Arrow) - + CreateConnector("link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow), + CreateConnector("link2", ConnectorSegmentType.Orthogonal, DecoratorShape.None), + CreateConnector("link3", ConnectorSegmentType.Straight, DecoratorShape.Arrow), + CreateConnector("link4", ConnectorSegmentType.Straight, DecoratorShape.None), + CreateConnector("link5", ConnectorSegmentType.Bezier, DecoratorShape.None), + CreateConnector("link6", ConnectorSegmentType.Bezier, DecoratorShape.Arrow) }; // palette which contains flow shape nodes - flowShapes = new DiagramObjectCollection() + _flowShapes = new DiagramObjectCollection { - CreateFlowNode("Terminator",NodeFlowShapes.Terminator), - CreateFlowNode("Process",NodeFlowShapes.Process), - CreateFlowNode("Sort",NodeFlowShapes.Sort), - CreateFlowNode("Document",NodeFlowShapes.Document), - CreateFlowNode("Display",NodeFlowShapes.Display), - CreateFlowNode("PaperTap",NodeFlowShapes.PaperTap), - CreateFlowNode("Delay",NodeFlowShapes.Delay), - CreateFlowNode("Data",NodeFlowShapes.Data), - CreateFlowNode("Card",NodeFlowShapes.Card), - CreateFlowNode("Collate",NodeFlowShapes.Collate), - CreateFlowNode("Decision",NodeFlowShapes.Decision), + CreateFlowNode("Terminator", NodeFlowShapes.Terminator), + CreateFlowNode("Process", NodeFlowShapes.Process), + CreateFlowNode("Sort", NodeFlowShapes.Sort), + CreateFlowNode("Document", NodeFlowShapes.Document), + CreateFlowNode("Display", NodeFlowShapes.Display), + CreateFlowNode("PaperTap", NodeFlowShapes.PaperTap), + CreateFlowNode("Delay", NodeFlowShapes.Delay), + CreateFlowNode("Data", NodeFlowShapes.Data), + CreateFlowNode("Card", NodeFlowShapes.Card), + CreateFlowNode("Collate", NodeFlowShapes.Collate), + CreateFlowNode("Decision", NodeFlowShapes.Decision), }; #pragma warning disable BL0005 - palettes.Add( - new Palette() - { - ID = "BasicShape", - IsExpanded = true, - Symbols = basicShapes, - Title = "Basic Shapes", - IconCss = "e-ddb-icons e-basic" - } - ); - palettes.Add( - new Palette() - { - ID = "FlowShape", - IsExpanded = true, - Symbols = flowShapes, - Title = "Flow Shapes", - IconCss = "e-ddb-icons e-flow" - } - ); - palettes.Add( - new Palette() - { - ID = "Connectors", - IsExpanded = true, - Symbols = connectors, - Title = "Connectors", - IconCss = "e-ddb-icons e-connector" - } - ); + _palettes.Add(new Palette() + { + ID = "BasicShape", + IsExpanded = true, + Symbols = _basicShapes, + Title = "Basic Shapes", + IconCss = "e-ddb-icons e-basic" + }); + + _palettes.Add(new Palette() + { + ID = "FlowShape", + IsExpanded = true, + Symbols = _flowShapes, + Title = "Flow Shapes", + IconCss = "e-ddb-icons e-flow" + }); + + _palettes.Add(new Palette() + { + ID = "Connectors", + IsExpanded = true, + Symbols = _connectors, + Title = "Connectors", + IconCss = "e-ddb-icons e-connector" + }); #pragma warning restore BL0005 } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { + SymbolInfo symbolInfo = new SymbolInfo(); string description = symbol is Node ? (symbol as Node).ID : (symbol as Connector).ID; - if (text) + + if (_text) { - SymbolInfo.Description = new SymbolDescription() + symbolInfo.Description = new SymbolDescription() { Text = description, - Style = new TextStyle() - { - TextOverflow = TextOverflow.Wrap - }, + Style = new TextStyle() { TextOverflow = TextOverflow.Wrap } }; } else { - SymbolInfo.Description = new SymbolDescription() - { - Text = "", - Style = new TextStyle() - { - TextOverflow = TextOverflow.Wrap - }, + symbolInfo.Description = new SymbolDescription() + { + Text = string.Empty, + Style = new TextStyle() { TextOverflow = TextOverflow.Wrap } }; } - return SymbolInfo; + + return symbolInfo; } // Method to create basic shape node @@ -403,14 +397,11 @@ Node node = new Node() { ID = id, - Shape = new BasicShape() - { - Type = shapes.Basic, - Shape = type - }, - SearchTags = new List() {"Basic" }, + Shape = new BasicShape() { Type = shapes.Basic, Shape = type }, + SearchTags = new List() { "Basic" }, Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }; + return node; } @@ -420,14 +411,11 @@ Node node = new Node() { ID = id, - Shape = new FlowShape() - { - Type = shapes.Flow, - Shape = type - }, - SearchTags = new List() {"flow" }, + Shape = new FlowShape() { Type = shapes.Flow, Shape = type }, + SearchTags = new List() { "flow" }, Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }; + return node; } @@ -438,16 +426,13 @@ { ID = id, Type = type, - SearchTags = new List() {"connector" }, + SearchTags = new List() { "connector" }, SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, - TargetDecorator = new DecoratorSettings() - { - Shape = shape, - Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } - }, + TargetDecorator = new DecoratorSettings() { Shape = shape, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } }, Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }; + return connector; } -} \ No newline at end of file +} diff --git a/Diagram/Server/Pages/SymbolPalette/SearchTag.razor b/Diagram/Server/Pages/SymbolPalette/SearchTag.razor index b83dde41..a0903e8e 100644 --- a/Diagram/Server/Pages/SymbolPalette/SearchTag.razor +++ b/Diagram/Server/Pages/SymbolPalette/SearchTag.razor @@ -6,8 +6,8 @@
- +
@@ -15,18 +15,21 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin - { - Left = 15, - Right = 15, - Top = 15, - Bottom = 15 - }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SymbolMargin _symbolMargin = new SymbolMargin + { + Left = 15, + Right = 15, + Top = 15, + Bottom = 15 + }; + + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -38,9 +41,10 @@ CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); CreatePaletteNode(NodeBasicShapes.Ellipse, "Ellipse"); CreatePaletteNode(NodeBasicShapes.Star, "Star"); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -53,6 +57,6 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/SelectionChanged.razor b/Diagram/Server/Pages/SymbolPalette/SelectionChanged.razor index 07750397..3e36cd7f 100644 --- a/Diagram/Server/Pages/SymbolPalette/SelectionChanged.razor +++ b/Diagram/Server/Pages/SymbolPalette/SelectionChanged.razor @@ -7,8 +7,8 @@
- +
@@ -16,18 +16,23 @@ @code { - //Define symbolpreview - private DiagramSize SymbolPreview; - //Define symbolmargin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private double symbolwidth = 60; - private double symbolheight = 60; - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + private double _symbolWidth = 60; + private double _symbolHeight = 60; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -54,23 +59,24 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Diamond }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node1); - PaletteNodes.Add(node2); - PaletteNodes.Add(node3); + _paletteNodes.Add(node1); + _paletteNodes.Add(node2); + _paletteNodes.Add(node3); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } private void SelectionChangedMethod(PaletteSelectionChangedEventArgs args) { - if(args.OldValue.Contains("Rectangle")) + if (args.OldValue.Contains("Rectangle")) { // Actions to be performed } - if(args.NewValue.Contains("Ellipse")) + + if (args.NewValue.Contains("Ellipse")) { // Actions to be performed } diff --git a/Diagram/Server/Pages/SymbolPalette/ShowToolTip.razor b/Diagram/Server/Pages/SymbolPalette/ShowToolTip.razor index c85f14ca..a04d73ad 100644 --- a/Diagram/Server/Pages/SymbolPalette/ShowToolTip.razor +++ b/Diagram/Server/Pages/SymbolPalette/ShowToolTip.razor @@ -8,37 +8,39 @@
- +
- +
- +
@code { // Controls tooltip visibility for symbols at runtime. - private bool showTooltip = false; - private SfSymbolPaletteComponent? symbolPalette; - private SfDiagramComponent? diagram; - private SymbolMargin symbolMargin = new SymbolMargin() + private bool _showTooltip = false; + private SfSymbolPaletteComponent? _symbolPalette; + private SfDiagramComponent? _diagram; + + private SymbolMargin _symbolMargin = new SymbolMargin() { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private DiagramObjectCollection Palettes { get; set; } = new DiagramObjectCollection(); - private DiagramObjectCollection FlowShapesPalette { get; set; } = new DiagramObjectCollection(); - private DiagramObjectCollection BasicShapesPalette { get; set; } = new DiagramObjectCollection(); - private DiagramObjectCollection ConnectorsPalette { get; set; } = new DiagramObjectCollection(); + + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + private DiagramObjectCollection _flowShapesPalette = new DiagramObjectCollection(); + private DiagramObjectCollection _basicShapesPalette = new DiagramObjectCollection(); + private DiagramObjectCollection _connectorsPalette = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -48,10 +50,10 @@ protected override async Task OnAfterRenderAsync(bool firstRender) { - if (firstRender && symbolPalette != null && diagram != null) + if (firstRender && _symbolPalette != null && _diagram != null) { // Set diagram as drag-drop target for symbol palette. - symbolPalette.Targets = new DiagramObjectCollection { diagram }; + _symbolPalette.Targets = new DiagramObjectCollection { _diagram }; } } @@ -59,7 +61,7 @@ private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { // Enable/disable tooltip display based on user preference at runtime. - return new SymbolInfo { ShowTooltip = showTooltip }; + return new SymbolInfo { ShowTooltip = _showTooltip }; } private void InitPaletteModel() @@ -83,11 +85,11 @@ AddConnector("StraightOpp", ConnectorSegmentType.Straight, DecoratorShape.None, 3); // Create palette collection with all shape categories. - Palettes = new DiagramObjectCollection + _palettes = new DiagramObjectCollection { - new Palette { Symbols = FlowShapesPalette, Title = "Flow Shapes", ID = "FlowShapes", IsExpanded = true }, - new Palette { Symbols = BasicShapesPalette, Title = "Basic Shapes", ID = "BasicShapes", IsExpanded = true }, - new Palette { Symbols = ConnectorsPalette, Title = "Connectors", ID = "Connectors", IsExpanded = true } + new Palette { Symbols = _flowShapesPalette, Title = "Flow Shapes", ID = "FlowShapes", IsExpanded = true }, + new Palette { Symbols = _basicShapesPalette, Title = "Basic Shapes", ID = "BasicShapes", IsExpanded = true }, + new Palette { Symbols = _connectorsPalette, Title = "Connectors", ID = "Connectors", IsExpanded = true } }; } @@ -112,7 +114,7 @@ Position = Position.RightCenter }; } - FlowShapesPalette.Add(node); + _flowShapesPalette.Add(node); } private void AddBasicShape(NodeBasicShapes shapeType, string id, int index) @@ -141,7 +143,7 @@ Position = Position.RightCenter }; } - BasicShapesPalette.Add(node); + _basicShapesPalette.Add(node); } private void AddConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape, int index) @@ -170,6 +172,6 @@ ShowTipPointer = true }; } - ConnectorsPalette.Add(connector); + _connectorsPalette.Add(connector); } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor b/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor index 4e59aa04..67a1f004 100644 --- a/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor +++ b/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor @@ -6,8 +6,8 @@
- +
@@ -15,18 +15,21 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -50,15 +53,15 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { - SymbolInfo SymbolInfo = new SymbolInfo(); - string text = null; - text = (symbol as Node).ID; - SymbolInfo.Description = new SymbolDescription() { Text = text }; - return SymbolInfo; + SymbolInfo symbolInfo = new SymbolInfo(); + string text = (symbol as Node).ID; + symbolInfo.Description = new SymbolDescription() { Text = text }; + return symbolInfo; } } \ No newline at end of file diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTemplate.razor b/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTemplate.razor index a1c7de8f..4be243cd 100644 --- a/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTemplate.razor +++ b/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTemplate.razor @@ -3,7 +3,7 @@ @using Syncfusion.Blazor.Diagram @using Syncfusion.Blazor.Diagram.SymbolPalette - + @@ -13,22 +13,24 @@ @code { - private DiagramObjectCollection Symbols = new DiagramObjectCollection(); - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private DiagramObjectCollection _symbols = new DiagramObjectCollection(); + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); protected override void OnInitialized() { - Symbols = new DiagramObjectCollection(); + _symbols = new DiagramObjectCollection(); + Node node = new Node() { ID = "Nativenode", Shape = new Shape() { Type = NodeShapes.SVG }, }; - Symbols.Add(node as NodeBase); - Palettes = new DiagramObjectCollection() + _symbols.Add(node as NodeBase); + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =Symbols,Title="Template Shape" }, + new Palette() { Symbols = _symbols, Title = "Template Shape" }, }; } } diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTooltip.razor b/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTooltip.razor index 74b42196..1126d893 100644 --- a/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTooltip.razor +++ b/Diagram/Server/Pages/SymbolPalette/SymbolPaletteTooltip.razor @@ -134,13 +134,13 @@
- +
- +
@@ -149,32 +149,40 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfDiagramComponent diagram; - private SfSymbolPaletteComponent SymbolPalette; - //Define nodes collection. - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Define connectors collection. - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfDiagramComponent _diagram; + + private SfSymbolPaletteComponent _symbolPalette; + + // Define nodes collection. + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + + // Define connectors collection. + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + // Defines palette's group collection. - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); + // Defines palette's connector collection. - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override async Task OnAfterRenderAsync(bool firstRender) { - SymbolPalette.Targets = new DiagramObjectCollection() { }; - SymbolPalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } protected override void OnInitialized() @@ -187,11 +195,12 @@ CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Flow Shapes", ID = "Flow Shapes" }, - new Palette(){Symbols = PaletteConnectors,Title = "Connectors", IsExpanded = true}, - new Palette(){Symbols = PaletteGroup,Title = "Group Shapes", IsExpanded = true} + new Palette() { Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette() { Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette() { Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -210,7 +219,8 @@ }, Constraints = NodeConstraints.Default | NodeConstraints.Tooltip }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } private void CreatePaletteConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape) @@ -235,7 +245,8 @@ }, Constraints = ConnectorConstraints.Default | ConnectorConstraints.Tooltip }; - PaletteConnectors.Add(connector); + + _paletteConnectors.Add(connector); } private void CreatePaletteGroup() @@ -250,6 +261,7 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; + Node node2 = new Node() { ID = "node2", @@ -260,14 +272,17 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); + NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + + _paletteGroup.Add(group); } private void DragDrop(DropEventArgs args) diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolPreview.razor b/Diagram/Server/Pages/SymbolPalette/SymbolPreview.razor index e2ce9fda..f414c93d 100644 --- a/Diagram/Server/Pages/SymbolPalette/SymbolPreview.razor +++ b/Diagram/Server/Pages/SymbolPalette/SymbolPreview.razor @@ -133,13 +133,13 @@
- +
- +
@@ -148,20 +148,27 @@ @code { - //Define symbolpreview - private DiagramSize Preview; - //Define SymbolMargin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the diagram - private SfDiagramComponent diagram; - //Reference the symbol palette - private SfSymbolPaletteComponent symbolpalette; - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + // Define symbol preview + private DiagramSize _preview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + // Reference the diagram + private SfDiagramComponent _diagram; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -170,25 +177,25 @@ protected override async Task OnAfterRenderAsync(bool firstRender) { - symbolpalette.Targets = new DiagramObjectCollection() { }; - symbolpalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } private void InitPaletteModel() { - Preview = new DiagramSize(); - Preview.Width = 100; - Preview.Height = 100; + _preview = new DiagramSize(); + _preview.Width = 100; + _preview.Height = 100; CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } - //Method to create palette node + // Method to create palette node private void CreatePaletteNode(NodeBasicShapes basicShape, string id) { Node node = new Node() @@ -197,7 +204,8 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } } diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor b/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor index 36054cf0..b8e31417 100644 --- a/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor +++ b/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor @@ -13,24 +13,28 @@
-@code +@code { - //Define symbolpreview - private DiagramSize SymbolPreview; - //Define SymbolMargin - private SymbolMargin SymbolMargin = new SymbolMargin + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -39,18 +43,18 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } - //Method to create palette node + // Method to create palette node private void CreatePaletteNode(NodeBasicShapes basicShape, string id) { Node node = new Node() @@ -59,17 +63,17 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } - //Method to getsymbolinfo + // Method to get symbol info private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { - SymbolInfo SymbolInfo = new SymbolInfo(); - //SymbolInfo.Fit = true; - string text = null; - text = (symbol as Node).ID; - SymbolInfo.Description = new SymbolDescription() { Text = text }; - return SymbolInfo; + SymbolInfo symbolInfo = new SymbolInfo(); + // symbolInfo.Fit = true; + string text = (symbol as Node).ID; + symbolInfo.Description = new SymbolDescription() { Text = text }; + return symbolInfo; } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor b/Diagram/Wasm/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor index 15afb4fe..071b748c 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AddConnectorToSymbolPalette.razor @@ -6,8 +6,8 @@
- +
@@ -15,14 +15,14 @@ @code { - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpalette + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); // Defines palette's connector collection - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -31,11 +31,11 @@ private void InitPaletteModel() { - PaletteConnectors = new DiagramObjectCollection(); + _paletteConnectors = new DiagramObjectCollection(); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteConnectors,Title="Connectors" ,IsExpanded = true}, + new Palette(){ Symbols = _paletteConnectors, Title = "Connectors" ,IsExpanded = true }, }; } @@ -56,6 +56,6 @@ } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/AddGroupToPalette.razor b/Diagram/Wasm/Pages/SymbolPalette/AddGroupToPalette.razor index 549c98d5..74391eaf 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AddGroupToPalette.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AddGroupToPalette.razor @@ -6,8 +6,8 @@
- +
@@ -15,20 +15,20 @@ @code { - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the symbol palette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's group collection - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -39,9 +39,9 @@ { CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols=PaletteGroup,Title="Group Shapes",IsExpanded=true} + new Palette(){ Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -68,15 +68,15 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/AddNodeToPalette.razor b/Diagram/Wasm/Pages/SymbolPalette/AddNodeToPalette.razor index 28f3bd2f..13dc2f5f 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AddNodeToPalette.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AddNodeToPalette.razor @@ -6,8 +6,8 @@
- +
@@ -17,15 +17,15 @@ @code { - //Reference the symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpreview + private DiagramSize _symbolPreview; + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -34,14 +34,14 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Flow Shapes",ID="Flow Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, }; } @@ -54,6 +54,6 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor b/Diagram/Wasm/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor index 2d1fc192..54793917 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AddPaletteToSymbolPalette.razor @@ -6,8 +6,8 @@
- +
@@ -15,22 +15,22 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SfSymbolPaletteComponent _symbolPalette; + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); // Defines palette's group collection. - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); // Defines palette's connector collection. - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -42,11 +42,11 @@ CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Flow Shapes", ID = "Flow Shapes" }, - new Palette(){Symbols = PaletteConnectors,Title = "Connectors", IsExpanded = true}, - new Palette(){Symbols = PaletteGroup,Title = "Group Shapes", IsExpanded = true} + new Palette(){ Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette(){ Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette(){ Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -58,7 +58,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void CreatePaletteConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape) @@ -76,7 +76,7 @@ Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } private void CreatePaletteGroup() @@ -101,13 +101,13 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor b/Diagram/Wasm/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor index 06ff42bc..1c8ac119 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AddRemovePaletteAtRuntime.razor @@ -10,8 +10,8 @@
- +
@@ -20,15 +20,15 @@ @code { - //Reference the symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpreview + private DiagramSize _symbolPreview; + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -37,14 +37,14 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Flow Shapes",ID="Flow Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, }; } @@ -57,7 +57,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void AddPalette() @@ -73,11 +73,11 @@ { new Palette(){Symbols = newNodes,Title = "BasicShapes",ID = "BasicShapes" }, }; - symbolpalette.AddPalettes(newPalettes); + _symbolPalette.AddPalettes(newPalettes); } private void RemovePalette() { - symbolpalette.RemovePalettes("BasicShapes"); + _symbolPalette.RemovePalettes("BasicShapes"); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor b/Diagram/Wasm/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor index 6f974996..e28581c8 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AddRemoveSymbolAtRuntime.razor @@ -10,8 +10,8 @@
- +
@@ -20,15 +20,15 @@ @code { - //Reference the symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Reference the symbolpreview + private DiagramSize _symbolPreview; + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + private SfSymbolPaletteComponent _symbolPalette; + // Define palattes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -37,14 +37,14 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="FlowShapes",ID="FlowShapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "FlowShapes", ID = "FlowShapes" }, }; } @@ -57,7 +57,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void AddSymbol() @@ -67,11 +67,11 @@ ID = "Decision", Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.Decision } }; - symbolpalette.AddPaletteItem("FlowShapes", decision, false); + _symbolPalette.AddPaletteItem("FlowShapes", decision, false); } private void RemoveSymbol() { - symbolpalette.RemovePaletteItem("FlowShapes", "Decision"); + _symbolPalette.RemovePaletteItem("FlowShapes", "Decision"); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/AnimationSupport.razor b/Diagram/Wasm/Pages/SymbolPalette/AnimationSupport.razor index 83bedad5..f99db75a 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/AnimationSupport.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/AnimationSupport.razor @@ -6,8 +6,8 @@
- +
@@ -15,18 +15,18 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SfSymbolPaletteComponent _symbolPalette; + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -38,9 +38,9 @@ CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); CreatePaletteNode(NodeBasicShapes.Ellipse, "Ellipse"); CreatePaletteNode(NodeBasicShapes.Star, "Star"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -53,6 +53,6 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/CreateSymbolPalette.razor b/Diagram/Wasm/Pages/SymbolPalette/CreateSymbolPalette.razor index 4eb982a4..2ac38daa 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/CreateSymbolPalette.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/CreateSymbolPalette.razor @@ -4,13 +4,13 @@ @using Syncfusion.Blazor.Diagram @* Initializes the symbol palette *@ - + @code { - //Reference the symbol palette - private SfSymbolPaletteComponent SymbolPalette; - //Initialize the palettes collection - private DiagramObjectCollection palettes = new DiagramObjectCollection(); + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + // Initialize the palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/CustomSymbolSize.razor b/Diagram/Wasm/Pages/SymbolPalette/CustomSymbolSize.razor new file mode 100644 index 00000000..154cc2f8 --- /dev/null +++ b/Diagram/Wasm/Pages/SymbolPalette/CustomSymbolSize.razor @@ -0,0 +1,85 @@ +@page "/CustomSymbolSize" + +@using Syncfusion.Blazor.Diagram +@using Syncfusion.Blazor.Diagram.SymbolPalette +@using Syncfusion.Blazor.Buttons + +
+
+ + +
+
+
+ + +
+
+
+ +@code { + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + private double _symbolWidth = 60; + private double _symbolHeight = 60; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + + // Defines palette's flow-shape collection + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + + protected override void OnInitialized() + { + InitPaletteModel(); + } + + private void InitPaletteModel() + { + Node node1 = new Node() + { + ID = "Rectangle", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + }; + + Node node2 = new Node() + { + ID = "Ellipse", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + }; + + Node node3 = new Node() + { + ID = "Diamond", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Diamond }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + }; + + _paletteNodes.Add(node1); + _paletteNodes.Add(node2); + _paletteNodes.Add(node3); + + _palettes = new DiagramObjectCollection() + { + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, + }; + } + + // Method to update symbol width and symbol height + private void UpdateSize() + { + _symbolWidth = 80; + _symbolHeight = 80; + } +} + diff --git a/Diagram/Wasm/Pages/SymbolPalette/DescriptionStyle.razor b/Diagram/Wasm/Pages/SymbolPalette/DescriptionStyle.razor index 6186c3a5..3a317913 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/DescriptionStyle.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/DescriptionStyle.razor @@ -2,13 +2,12 @@ @using Syncfusion.Blazor.Diagram @using Syncfusion.Blazor.Diagram.SymbolPalette -@using TextWrap = Syncfusion.Blazor.Diagram.TextWrap
- +
@@ -16,11 +15,11 @@ @code { - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SfSymbolPaletteComponent _symbolPalette; + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); // Defines palette's basic-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -32,9 +31,9 @@ CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); CreatePaletteNode(NodeBasicShapes.Ellipse, "Ellipse"); CreatePaletteNode(NodeBasicShapes.Hexagon, "Hexagon"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette(){ Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -46,7 +45,7 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) diff --git a/Diagram/Wasm/Pages/SymbolPalette/DragAndDrop.razor b/Diagram/Wasm/Pages/SymbolPalette/DragAndDrop.razor index 50048713..63d5f48f 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/DragAndDrop.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/DragAndDrop.razor @@ -133,13 +133,13 @@
- +
- +
@@ -148,32 +148,40 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfDiagramComponent diagram; - private SfSymbolPaletteComponent SymbolPalette; - //Define nodes collection. - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Define connectors collection. - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfDiagramComponent _diagram; + + private SfSymbolPaletteComponent _symbolPalette; + + // Define nodes collection. + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + + // Define connectors collection. + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + // Defines palette's group collection. - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); + // Defines palette's connector collection. - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override async Task OnAfterRenderAsync(bool firstRender) { - SymbolPalette.Targets = new DiagramObjectCollection() { }; - SymbolPalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } protected override void OnInitialized() @@ -186,11 +194,12 @@ CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Flow Shapes", ID = "Flow Shapes" }, - new Palette(){Symbols = PaletteConnectors,Title = "Connectors", IsExpanded = true}, - new Palette(){Symbols = PaletteGroup,Title = "Group Shapes", IsExpanded = true} + new Palette() { Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette() { Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette() { Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -202,7 +211,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } private void CreatePaletteConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape) @@ -220,7 +229,7 @@ Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } private void CreatePaletteGroup() @@ -245,13 +254,13 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/EnableChunkMessage.razor b/Diagram/Wasm/Pages/SymbolPalette/EnableChunkMessage.razor index 7da9e794..28ec1d6e 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/EnableChunkMessage.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/EnableChunkMessage.razor @@ -3,20 +3,21 @@ @using Syncfusion.Blazor.Diagram @using Syncfusion.Blazor.Diagram.SymbolPalette - + @code { - private DiagramSize symbolDragPreviewSize; - private DiagramObjectCollection palettes; - private double symbolHeight = 75; - private double symbolWidth = 75; + private DiagramSize _symbolDragPreviewSize; + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + private double _symbolHeight = 75; + private double _symbolWidth = 75; protected override void OnInitialized() { - symbolDragPreviewSize = new DiagramSize(); - symbolDragPreviewSize.Width = 80; - symbolDragPreviewSize.Height = 80; + _symbolDragPreviewSize = new DiagramSize(); + _symbolDragPreviewSize.Width = 80; + _symbolDragPreviewSize.Height = 80; + InitializeFloorPlannerPalettes(); } @@ -415,9 +416,9 @@ Palette DiningRoom = new Palette() { Symbols = DiningRoomSymbols, Title = "Dining Room", ID = "DiningRoom", IconCss = "e-ddb-icons e-flow" }; Palette Kitchen = new Palette() { Symbols = KitchenSymbols, Title = "Kitchen", ID = "Kitchen", IconCss = "e-ddb-icons e-flow" }; - palettes = new DiagramObjectCollection(); - palettes.Add(Door); - palettes.Add(DiningRoom); - palettes.Add(Kitchen); + _palettes = new DiagramObjectCollection(); + _palettes.Add(Door); + _palettes.Add(DiningRoom); + _palettes.Add(Kitchen); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/GroupSample.razor b/Diagram/Wasm/Pages/SymbolPalette/GroupSample.razor index adb2c9ef..253d65eb 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/GroupSample.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/GroupSample.razor @@ -133,8 +133,8 @@
- +
@@ -148,35 +148,43 @@ @code { - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the diagram - private SfDiagramComponent diagram; - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define nodes collection - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Define connectors collection - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + // Reference the diagram + private SfDiagramComponent _diagram; + + // Reference the symbolpalette + private SfSymbolPaletteComponent _symbolPalette; + + // Define nodes collection + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + + // Define connectors collection + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + // Defines palette's group collection - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); + // Defines palette's connector collection - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override async Task OnAfterRenderAsync(bool firstRender) { - symbolpalette.Targets = new DiagramObjectCollection() { }; - symbolpalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } protected override void OnInitialized() @@ -191,11 +199,11 @@ CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Flow Shapes",ID="Flow Shapes" }, - new Palette(){Symbols =PaletteConnectors,Title="Connectors" ,IsExpanded = true}, - new Palette(){Symbols=PaletteGroup,Title="Group Shapes",IsExpanded=true} + new Palette() { Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette() { Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette() { Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -208,7 +216,7 @@ Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = flowShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } //Method to create palette connector @@ -228,7 +236,7 @@ } }; - PaletteConnectors.Add(connector); + _paletteConnectors.Add(connector); } //Method to create palette group private void CreatePaletteGroup() @@ -253,15 +261,14 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + _paletteGroup.Add(group); } -} - +} \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/PaletteExpandMode.razor b/Diagram/Wasm/Pages/SymbolPalette/PaletteExpandMode.razor index 74fe704f..8cb191ce 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/PaletteExpandMode.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/PaletteExpandMode.razor @@ -4,104 +4,124 @@ @using Syncfusion.Blazor.Diagram.SymbolPalette @using Syncfusion.Blazor.DropDowns - + + + @code { - //Reference the symbolpalette - private SfSymbolPaletteComponent Palette; - //Define the symbolmargin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private int? index { get; set; } = 1; - //Define pallette collection - private DiagramObjectCollection Palettes; - private SfDropDownList Expandable; - private int? sizeChangeValue { get; set; } = 80; - private bool animationChecked = true; - private bool AnimationMode = true; - private bool icon = true; - private double SymbolHeight = 50; - private double SymbolWidth = 50; - private string Height { get; set; } = "580px"; - private double length = 70; - private DiagramObjectCollection ConnectorCollection { get; set; } - private SymbolInfo SymbolInfo { get; set; } - private DiagramObjectCollection BasicShape { get; set; } - private DiagramObjectCollection Connectors { get; set; } - private DiagramObjectCollection FlowShapess { get; set; } + // Reference the symbolpalette + private SfSymbolPaletteComponent _palette; + + // Define the symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + private int? _index { get; set; } = 1; + + // Define palette collection + private DiagramObjectCollection _palettes; + + private SfDropDownList _expandable; + + private int? _sizeChangeValue { get; set; } = 80; + + private bool _animationChecked = true; + + private bool _animationMode = true; + + private bool _icon = true; + + private double _symbolHeight = 50; + + private double _symbolWidth = 50; + + private string _height { get; set; } = "580px"; + + private double _length = 70; + + private DiagramObjectCollection _connectorCollection { get; set; } + + private SymbolInfo _symbolInfo { get; set; } + + private DiagramObjectCollection _basicShape { get; set; } + + private DiagramObjectCollection _connectors { get; set; } + + private DiagramObjectCollection _flowShapes { get; set; } private class Modevalue { public string Text { get; set; } public string Value { get; set; } } - private List ExpandMode = new List() { + private List _expandMode = new List() { new Modevalue { Text ="Single", Value= "Single" }, new Modevalue { Text = "Multiple", Value = "Multiple" }, }; - Syncfusion.Blazor.Navigations.ExpandMode ExpandModeType = Syncfusion.Blazor.Navigations.ExpandMode.Multiple; + private Syncfusion.Blazor.Navigations.ExpandMode _expandModeType = Syncfusion.Blazor.Navigations.ExpandMode.Multiple; private void ModeChange(Syncfusion.Blazor.DropDowns.ChangeEventArgs args) { - if (args.Value == "Multiple") { - Palette.Palettes[0].IsExpanded = true; - Palette.Palettes[1].IsExpanded = true; - Palette.Palettes[2].IsExpanded = true; + _palette.Palettes[0].IsExpanded = true; + _palette.Palettes[1].IsExpanded = true; + _palette.Palettes[2].IsExpanded = true; } else { - Palette.Palettes[0].IsExpanded = true; - Palette.Palettes[1].IsExpanded = false; - Palette.Palettes[2].IsExpanded = false; - + _palette.Palettes[0].IsExpanded = true; + _palette.Palettes[1].IsExpanded = false; + _palette.Palettes[2].IsExpanded = false; } + this.StateHasChanged(); } - private void sizeChange(Syncfusion.Blazor.Inputs.ChangeEventArgs args) + private void SizeChange(Syncfusion.Blazor.Inputs.ChangeEventArgs args) { - this.SymbolWidth = double.Parse(args.Value.ToString()); - this.SymbolHeight = double.Parse(args.Value.ToString()); - this.sizeChangeValue = int.Parse(args.Value.ToString()); + this._symbolWidth = double.Parse(args.Value.ToString()); + this._symbolHeight = double.Parse(args.Value.ToString()); + this._sizeChangeValue = int.Parse(args.Value.ToString()); this.StateHasChanged(); } - private void animationChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) + private void AnimationChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) { - this.animationChecked = args.Checked; - this.AnimationMode = args.Checked; + this._animationChecked = args.Checked; + this._animationMode = args.Checked; this.StateHasChanged(); } - private void iconChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) + private void IconChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args) { - for (var i = 0; i < Palettes.Count; i++) + for (var i = 0; i < _palettes.Count; i++) { - this.icon = args.Checked; + this._icon = args.Checked; + if (args.Checked) { if (i == 0) { - Palettes[i].IconCss = "e-ddb-icons e-basic"; + _palettes[i].IconCss = "e-ddb-icons e-basic"; } else if (i == 1) { - Palettes[i].IconCss = "e-ddb-icons e-flow"; + _palettes[i].IconCss = "e-ddb-icons e-flow"; } else if (i == 2) { - Palettes[i].IconCss = "e-ddb-icons e-connector"; + _palettes[i].IconCss = "e-ddb-icons e-connector"; } } else { - Palettes[i].IconCss = ""; + _palettes[i].IconCss = string.Empty; } + this.StateHasChanged(); } } @@ -113,93 +133,118 @@ private void InitializePalatte() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - SymbolInfo = new SymbolInfo() - { - Fit = true - }; + _symbolInfo = new SymbolInfo() { Fit = true }; - BasicShape = new DiagramObjectCollection + _basicShape = new DiagramObjectCollection { new Node() { - ID="Rectangle" , Shape = new BasicShape(){ - Type = NodeShapes.Basic, Shape=NodeBasicShapes.Rectangle}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Rectangle", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Ellipse" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Ellipse }, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Ellipse", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Parallelogram" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Parallelogram }, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Parallelogram", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Parallelogram }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Triangle" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Triangle}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Triangle", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Triangle }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Hexagon" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Hexagon}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Hexagon", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Hexagon }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Pentagon" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Pentagon }, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Pentagon", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Pentagon }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Cylinder" , Shape = new BasicShape(){ - Type =NodeShapes.Basic,Shape=NodeBasicShapes.Cylinder}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} + ID = "Cylinder", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Cylinder }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, new Node() { - ID="Star" , Shape = new BasicShape(){ - Type =NodeShapes.Basic, Shape=NodeBasicShapes.Star}, - Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575"} - }, + ID = "Star", + Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Star }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } + } }; - Connectors = new DiagramObjectCollection() + _connectors = new DiagramObjectCollection() { - new Connector(){ID="Link1" , Type = ConnectorSegmentType.Orthogonal ,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings() - { Shape=DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" }},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "Link1", + Type = ConnectorSegmentType.Orthogonal, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="link3" , Type=ConnectorSegmentType.Orthogonal,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings(){ Shape=DecoratorShape.None},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "link3", + Type = ConnectorSegmentType.Orthogonal, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.None }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="Link21" , Type=ConnectorSegmentType.Straight,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings() - { Shape=DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" }},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "Link21", + Type = ConnectorSegmentType.Straight, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.Arrow, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="link23" , Type=ConnectorSegmentType.Straight,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings(){ Shape=DecoratorShape.None},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "link23", + Type = ConnectorSegmentType.Straight, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.None }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }, - new Connector(){ID="link33" , Type=ConnectorSegmentType.Bezier,SourcePoint= new DiagramPoint(){ X=0,Y=0 },TargetPoint = new DiagramPoint(){ X=40,Y=40}, - TargetDecorator= new DecoratorSettings(){ Shape=DecoratorShape.None},Style= new ShapeStyle(){ StrokeWidth=2, StrokeColor = "#757575"} + new Connector() + { + ID = "link33", + Type = ConnectorSegmentType.Bezier, + SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, + TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, + TargetDecorator = new DecoratorSettings() { Shape = DecoratorShape.None }, + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } } }; - FlowShapess = new DiagramObjectCollection() + _flowShapes = new DiagramObjectCollection { new Node() { ID = "Terminator", - Style = new ShapeStyle(){StrokeWidth = 2, StrokeColor = "#757575" }, - Shape = new FlowShape() { Type = NodeShapes.Flow,Shape=NodeFlowShapes.Terminator } + Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" }, + Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.Terminator } }, new Node() { @@ -235,8 +280,7 @@ { ID = "Direct Data", Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" }, - Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.DirectData - } + Shape = new FlowShape() { Type = NodeShapes.Flow, Shape = NodeFlowShapes.DirectData } }, new Node() { @@ -246,36 +290,31 @@ } }; - Palettes.Add( - new Palette() - { - ID = "Flowshapess", - IsExpanded = true, - Symbols = FlowShapess, - Title = "Flowshapes", - IconCss = "e-ddb-icons e-flow" - } - ); - Palettes.Add( - new Palette() - { - ID = "BasicShape", - IsExpanded = true, - Symbols = BasicShape, - Title = "Basic Shapes", - IconCss = "e-ddb-icons e-basic" - } - ); + _palettes.Add(new Palette() + { + ID = "Flowshapess", + IsExpanded = true, + Symbols = _flowShapes, + Title = "Flowshapes", + IconCss = "e-ddb-icons e-flow" + }); - Palettes.Add( - new Palette() - { - ID = "Connectors", - IsExpanded = true, - Symbols = Connectors, - Title = "Connectors", - IconCss = "e-ddb-icons e-connector" - } - ); + _palettes.Add(new Palette() + { + ID = "BasicShape", + IsExpanded = true, + Symbols = _basicShape, + Title = "Basic Shapes", + IconCss = "e-ddb-icons e-basic" + }); + + _palettes.Add(new Palette() + { + ID = "Connectors", + IsExpanded = true, + Symbols = _connectors, + Title = "Connectors", + IconCss = "e-ddb-icons e-connector" + }); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/PaletteHeader.razor b/Diagram/Wasm/Pages/SymbolPalette/PaletteHeader.razor index 2920bdc1..66fdfb3b 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/PaletteHeader.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/PaletteHeader.razor @@ -13,8 +13,8 @@
- +
@@ -22,16 +22,20 @@ @code { - //Define symbolpreview - private DiagramSize SymbolPreview; - //Define symbol margin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the symbol palette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -46,11 +50,11 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -62,13 +66,13 @@ ID = "Star", Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Star } }; - symbolpalette.AddPaletteItem("Basic Shapes", Star, false); + _symbolPalette.AddPaletteItem("Basic Shapes", Star, false); } //Method to update heading private void UpdateHeading1() { - symbolpalette.RemovePaletteItem("Basic Shapes", "Star"); + _symbolPalette.RemovePaletteItem("Basic Shapes", "Star"); } //Method to update heading @@ -83,12 +87,12 @@ { new Palette(){Symbols =newNodes,Title="FlowShapes",ID="FlowShapes" }, }; - symbolpalette.AddPalettes(newPalettes); + _symbolPalette.AddPalettes(newPalettes); } private void UpdateHeading3() { - symbolpalette.RemovePalettes("FlowShapes"); + _symbolPalette.RemovePalettes("FlowShapes"); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/RefereshPalette.razor b/Diagram/Wasm/Pages/SymbolPalette/RefereshPalette.razor index 9d161cb6..4ce66c84 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/RefereshPalette.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/RefereshPalette.razor @@ -7,8 +7,8 @@
- +
@@ -17,18 +17,21 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -38,9 +41,10 @@ private void InitPaletteModel() { CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -50,22 +54,22 @@ { ID = id, Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, - Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, + Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" } }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { - SymbolInfo SymbolInfo = new SymbolInfo(); - string text = null; - text = (symbol as Node).ID; - SymbolInfo.Description = new SymbolDescription() { Text = text }; - return SymbolInfo; + SymbolInfo symbolInfo = new SymbolInfo(); + string text = (symbol as Node).ID; + symbolInfo.Description = new SymbolDescription() { Text = text }; + return symbolInfo; } private void RefreshSymbols() { - SymbolPalette.RefreshSymbols(); + _symbolPalette.RefreshSymbols(); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/SearchOption.razor b/Diagram/Wasm/Pages/SymbolPalette/SearchOption.razor index 9a8218a3..cd76b026 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SearchOption.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SearchOption.razor @@ -207,25 +207,25 @@ @*End:Hidden*@ @*End:Hidden*@
-
- + - + - + @@ -239,162 +239,156 @@ @code { @*Hidden:Lines*@ - private int? index { get; set; } = 1; - private int? sizeChangeValue { get; set; } = 75; - private bool icon = true; - private bool text = true; - private bool animation = true; - private bool animationCheckbox = true; + private int? _index { get; set; } = 1; + private int? _sizeChangeValue { get; set; } = 75; + private bool _icon = true; + private bool _text = true; + private bool _animation = true; + private bool _animationCheckbox = true; @*End:Hidden*@ - private DiagramSize symbolDragPreviewSize; - private SymbolExpandMode paletteExpandMode = SymbolExpandMode.Multiple; - private SymbolInfo SymbolInfo = new SymbolInfo(); - private SfDiagramComponent Diagram; - private SfSymbolPaletteComponent palette; - private DiagramObjectCollection palettes; - private double symbolHeight = 75; - private double symbolWidth = 75; - private DiagramObjectCollection basicShapes { get; set; } - private DiagramObjectCollection connectors { get; set; } - private DiagramObjectCollection flowShapes { get; set; } + + private DiagramSize _symbolDragPreviewSize; + private SymbolExpandMode _paletteExpandMode = SymbolExpandMode.Multiple; + private SymbolInfo _symbolInfo = new SymbolInfo(); + private SfDiagramComponent _diagram; + private SfSymbolPaletteComponent _palette; + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + private double _symbolHeight = 75; + private double _symbolWidth = 75; + private DiagramObjectCollection _basicShapes = new DiagramObjectCollection(); + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + private DiagramObjectCollection _flowShapes = new DiagramObjectCollection(); + // Defines interval values for GridLines - private double[] GridLineIntervals { get; set; } - //Defines Diagram's Nodes collection - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Defines Diagram's Connectors collection - private DiagramObjectCollection diagramConnectors = new DiagramObjectCollection(); + private double[] _gridLineIntervals { get; set; } + + // Defines Diagram's Nodes collection + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + // Defines Diagram's Connectors collection + private DiagramObjectCollection _diagramConnectors = new DiagramObjectCollection(); + [Inject] - protected IJSRuntime jsRuntime { get; set; } - @*Hidden:Lines*@ - @*End:Hidden*@ + protected IJSRuntime _jsRuntime { get; set; } protected override async Task OnAfterRenderAsync(bool firstRender) { await base.OnAfterRenderAsync(firstRender); - palette.Targets = new DiagramObjectCollection + _palette.Targets = new DiagramObjectCollection { - Diagram + _diagram }; } protected override void OnInitialized() { - - symbolDragPreviewSize = new DiagramSize(); - symbolDragPreviewSize.Width = 80; - symbolDragPreviewSize.Height = 80; - GridLineIntervals = new double[] { 1, 9, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75 }; - InitializePalatte(); + _symbolDragPreviewSize = new DiagramSize(); + _symbolDragPreviewSize.Width = 80; + _symbolDragPreviewSize.Height = 80; + + _gridLineIntervals = new double[] { 1, 9, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75, 0.25, 9.75 }; + InitializePalette(); } - private void InitializePalatte() + private void InitializePalette() { - palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); // palette which contains basic shape nodes - basicShapes = new DiagramObjectCollection + _basicShapes = new DiagramObjectCollection { - CreateBasicNode("Rectangle",NodeBasicShapes.Rectangle), - CreateBasicNode("Ellipse",NodeBasicShapes.Ellipse), - CreateBasicNode("Diamond",NodeBasicShapes.Diamond), - CreateBasicNode("Triangle",NodeBasicShapes.Triangle), - CreateBasicNode("Hexagon",NodeBasicShapes.Hexagon), - CreateBasicNode("Pentagon",NodeBasicShapes.Pentagon), - CreateBasicNode("Cylinder",NodeBasicShapes.Cylinder), - CreateBasicNode("Star",NodeBasicShapes.Star), - CreateBasicNode("Octagon",NodeBasicShapes.Octagon), - CreateBasicNode("Plus",NodeBasicShapes.Plus), - CreateBasicNode("Heptagon",NodeBasicShapes.Heptagon), + CreateBasicNode("Rectangle", NodeBasicShapes.Rectangle), + CreateBasicNode("Ellipse", NodeBasicShapes.Ellipse), + CreateBasicNode("Diamond", NodeBasicShapes.Diamond), + CreateBasicNode("Triangle", NodeBasicShapes.Triangle), + CreateBasicNode("Hexagon", NodeBasicShapes.Hexagon), + CreateBasicNode("Pentagon", NodeBasicShapes.Pentagon), + CreateBasicNode("Cylinder", NodeBasicShapes.Cylinder), + CreateBasicNode("Star", NodeBasicShapes.Star), + CreateBasicNode("Octagon", NodeBasicShapes.Octagon), + CreateBasicNode("Plus", NodeBasicShapes.Plus), + CreateBasicNode("Heptagon", NodeBasicShapes.Heptagon), }; // palette which contains connectors - connectors = new DiagramObjectCollection() + _connectors = new DiagramObjectCollection { - CreateConnector("link1",ConnectorSegmentType.Orthogonal,DecoratorShape.Arrow), - CreateConnector("link2",ConnectorSegmentType.Orthogonal,DecoratorShape.None), - CreateConnector("link3",ConnectorSegmentType.Straight,DecoratorShape.Arrow), - CreateConnector("link4",ConnectorSegmentType.Straight,DecoratorShape.None), - CreateConnector("link5",ConnectorSegmentType.Bezier,DecoratorShape.None), - CreateConnector("link6",ConnectorSegmentType.Bezier, DecoratorShape.Arrow) - + CreateConnector("link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow), + CreateConnector("link2", ConnectorSegmentType.Orthogonal, DecoratorShape.None), + CreateConnector("link3", ConnectorSegmentType.Straight, DecoratorShape.Arrow), + CreateConnector("link4", ConnectorSegmentType.Straight, DecoratorShape.None), + CreateConnector("link5", ConnectorSegmentType.Bezier, DecoratorShape.None), + CreateConnector("link6", ConnectorSegmentType.Bezier, DecoratorShape.Arrow) }; // palette which contains flow shape nodes - flowShapes = new DiagramObjectCollection() + _flowShapes = new DiagramObjectCollection { - CreateFlowNode("Terminator",NodeFlowShapes.Terminator), - CreateFlowNode("Process",NodeFlowShapes.Process), - CreateFlowNode("Sort",NodeFlowShapes.Sort), - CreateFlowNode("Document",NodeFlowShapes.Document), - CreateFlowNode("Display",NodeFlowShapes.Display), - CreateFlowNode("PaperTap",NodeFlowShapes.PaperTap), - CreateFlowNode("Delay",NodeFlowShapes.Delay), - CreateFlowNode("Data",NodeFlowShapes.Data), - CreateFlowNode("Card",NodeFlowShapes.Card), - CreateFlowNode("Collate",NodeFlowShapes.Collate), - CreateFlowNode("Decision",NodeFlowShapes.Decision), + CreateFlowNode("Terminator", NodeFlowShapes.Terminator), + CreateFlowNode("Process", NodeFlowShapes.Process), + CreateFlowNode("Sort", NodeFlowShapes.Sort), + CreateFlowNode("Document", NodeFlowShapes.Document), + CreateFlowNode("Display", NodeFlowShapes.Display), + CreateFlowNode("PaperTap", NodeFlowShapes.PaperTap), + CreateFlowNode("Delay", NodeFlowShapes.Delay), + CreateFlowNode("Data", NodeFlowShapes.Data), + CreateFlowNode("Card", NodeFlowShapes.Card), + CreateFlowNode("Collate", NodeFlowShapes.Collate), + CreateFlowNode("Decision", NodeFlowShapes.Decision), }; #pragma warning disable BL0005 - palettes.Add( - new Palette() - { - ID = "BasicShape", - IsExpanded = true, - Symbols = basicShapes, - Title = "Basic Shapes", - IconCss = "e-ddb-icons e-basic" - } - ); - palettes.Add( - new Palette() - { - ID = "FlowShape", - IsExpanded = true, - Symbols = flowShapes, - Title = "Flow Shapes", - IconCss = "e-ddb-icons e-flow" - } - ); - palettes.Add( - new Palette() - { - ID = "Connectors", - IsExpanded = true, - Symbols = connectors, - Title = "Connectors", - IconCss = "e-ddb-icons e-connector" - } - ); + _palettes.Add(new Palette() + { + ID = "BasicShape", + IsExpanded = true, + Symbols = _basicShapes, + Title = "Basic Shapes", + IconCss = "e-ddb-icons e-basic" + }); + + _palettes.Add(new Palette() + { + ID = "FlowShape", + IsExpanded = true, + Symbols = _flowShapes, + Title = "Flow Shapes", + IconCss = "e-ddb-icons e-flow" + }); + + _palettes.Add(new Palette() + { + ID = "Connectors", + IsExpanded = true, + Symbols = _connectors, + Title = "Connectors", + IconCss = "e-ddb-icons e-connector" + }); #pragma warning restore BL0005 } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { + SymbolInfo symbolInfo = new SymbolInfo(); string description = symbol is Node ? (symbol as Node).ID : (symbol as Connector).ID; - if (text) + + if (_text) { - SymbolInfo.Description = new SymbolDescription() + symbolInfo.Description = new SymbolDescription() { Text = description, - Style = new TextStyle() - { - TextOverflow = TextOverflow.Wrap - }, + Style = new TextStyle() { TextOverflow = TextOverflow.Wrap } }; } else { - SymbolInfo.Description = new SymbolDescription() - { - Text = "", - Style = new TextStyle() - { - TextOverflow = TextOverflow.Wrap - }, + symbolInfo.Description = new SymbolDescription() + { + Text = string.Empty, + Style = new TextStyle() { TextOverflow = TextOverflow.Wrap } }; } - return SymbolInfo; + + return symbolInfo; } // Method to create basic shape node @@ -403,14 +397,11 @@ Node node = new Node() { ID = id, - Shape = new BasicShape() - { - Type = shapes.Basic, - Shape = type - }, - SearchTags = new List() {"Basic" }, + Shape = new BasicShape() { Type = shapes.Basic, Shape = type }, + SearchTags = new List() { "Basic" }, Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }; + return node; } @@ -420,14 +411,11 @@ Node node = new Node() { ID = id, - Shape = new FlowShape() - { - Type = shapes.Flow, - Shape = type - }, - SearchTags = new List() {"flow" }, + Shape = new FlowShape() { Type = shapes.Flow, Shape = type }, + SearchTags = new List() { "flow" }, Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }; + return node; } @@ -438,16 +426,13 @@ { ID = id, Type = type, - SearchTags = new List() {"connector" }, + SearchTags = new List() { "connector" }, SourcePoint = new DiagramPoint() { X = 0, Y = 0 }, TargetPoint = new DiagramPoint() { X = 40, Y = 40 }, - TargetDecorator = new DecoratorSettings() - { - Shape = shape, - Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } - }, + TargetDecorator = new DecoratorSettings() { Shape = shape, Style = new ShapeStyle() { StrokeColor = "#757575", Fill = "#757575" } }, Style = new ShapeStyle() { StrokeWidth = 2, StrokeColor = "#757575" } }; + return connector; } -} \ No newline at end of file +} diff --git a/Diagram/Wasm/Pages/SymbolPalette/SearchTag.razor b/Diagram/Wasm/Pages/SymbolPalette/SearchTag.razor index b83dde41..a0903e8e 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SearchTag.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SearchTag.razor @@ -6,8 +6,8 @@
- +
@@ -15,18 +15,21 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin - { - Left = 15, - Right = 15, - Top = 15, - Bottom = 15 - }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private SymbolMargin _symbolMargin = new SymbolMargin + { + Left = 15, + Right = 15, + Top = 15, + Bottom = 15 + }; + + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -38,9 +41,10 @@ CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); CreatePaletteNode(NodeBasicShapes.Ellipse, "Ellipse"); CreatePaletteNode(NodeBasicShapes.Star, "Star"); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } @@ -53,6 +57,6 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + _paletteNodes.Add(node); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/SelectionChanged.razor b/Diagram/Wasm/Pages/SymbolPalette/SelectionChanged.razor index 07750397..3e36cd7f 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SelectionChanged.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SelectionChanged.razor @@ -7,8 +7,8 @@
- +
@@ -16,18 +16,23 @@ @code { - //Define symbolpreview - private DiagramSize SymbolPreview; - //Define symbolmargin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private double symbolwidth = 60; - private double symbolheight = 60; - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + private double _symbolWidth = 60; + private double _symbolHeight = 60; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -54,23 +59,24 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Diamond }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node1); - PaletteNodes.Add(node2); - PaletteNodes.Add(node3); + _paletteNodes.Add(node1); + _paletteNodes.Add(node2); + _paletteNodes.Add(node3); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } private void SelectionChangedMethod(PaletteSelectionChangedEventArgs args) { - if(args.OldValue.Contains("Rectangle")) + if (args.OldValue.Contains("Rectangle")) { // Actions to be performed } - if(args.NewValue.Contains("Ellipse")) + + if (args.NewValue.Contains("Ellipse")) { // Actions to be performed } diff --git a/Diagram/Wasm/Pages/SymbolPalette/ShowToolTip.razor b/Diagram/Wasm/Pages/SymbolPalette/ShowToolTip.razor index c85f14ca..a04d73ad 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/ShowToolTip.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/ShowToolTip.razor @@ -8,37 +8,39 @@
- +
- +
- +
@code { // Controls tooltip visibility for symbols at runtime. - private bool showTooltip = false; - private SfSymbolPaletteComponent? symbolPalette; - private SfDiagramComponent? diagram; - private SymbolMargin symbolMargin = new SymbolMargin() + private bool _showTooltip = false; + private SfSymbolPaletteComponent? _symbolPalette; + private SfDiagramComponent? _diagram; + + private SymbolMargin _symbolMargin = new SymbolMargin() { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private DiagramObjectCollection Palettes { get; set; } = new DiagramObjectCollection(); - private DiagramObjectCollection FlowShapesPalette { get; set; } = new DiagramObjectCollection(); - private DiagramObjectCollection BasicShapesPalette { get; set; } = new DiagramObjectCollection(); - private DiagramObjectCollection ConnectorsPalette { get; set; } = new DiagramObjectCollection(); + + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + private DiagramObjectCollection _flowShapesPalette = new DiagramObjectCollection(); + private DiagramObjectCollection _basicShapesPalette = new DiagramObjectCollection(); + private DiagramObjectCollection _connectorsPalette = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -48,10 +50,10 @@ protected override async Task OnAfterRenderAsync(bool firstRender) { - if (firstRender && symbolPalette != null && diagram != null) + if (firstRender && _symbolPalette != null && _diagram != null) { // Set diagram as drag-drop target for symbol palette. - symbolPalette.Targets = new DiagramObjectCollection { diagram }; + _symbolPalette.Targets = new DiagramObjectCollection { _diagram }; } } @@ -59,7 +61,7 @@ private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { // Enable/disable tooltip display based on user preference at runtime. - return new SymbolInfo { ShowTooltip = showTooltip }; + return new SymbolInfo { ShowTooltip = _showTooltip }; } private void InitPaletteModel() @@ -83,11 +85,11 @@ AddConnector("StraightOpp", ConnectorSegmentType.Straight, DecoratorShape.None, 3); // Create palette collection with all shape categories. - Palettes = new DiagramObjectCollection + _palettes = new DiagramObjectCollection { - new Palette { Symbols = FlowShapesPalette, Title = "Flow Shapes", ID = "FlowShapes", IsExpanded = true }, - new Palette { Symbols = BasicShapesPalette, Title = "Basic Shapes", ID = "BasicShapes", IsExpanded = true }, - new Palette { Symbols = ConnectorsPalette, Title = "Connectors", ID = "Connectors", IsExpanded = true } + new Palette { Symbols = _flowShapesPalette, Title = "Flow Shapes", ID = "FlowShapes", IsExpanded = true }, + new Palette { Symbols = _basicShapesPalette, Title = "Basic Shapes", ID = "BasicShapes", IsExpanded = true }, + new Palette { Symbols = _connectorsPalette, Title = "Connectors", ID = "Connectors", IsExpanded = true } }; } @@ -112,7 +114,7 @@ Position = Position.RightCenter }; } - FlowShapesPalette.Add(node); + _flowShapesPalette.Add(node); } private void AddBasicShape(NodeBasicShapes shapeType, string id, int index) @@ -141,7 +143,7 @@ Position = Position.RightCenter }; } - BasicShapesPalette.Add(node); + _basicShapesPalette.Add(node); } private void AddConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape, int index) @@ -170,6 +172,6 @@ ShowTipPointer = true }; } - ConnectorsPalette.Add(connector); + _connectorsPalette.Add(connector); } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/SymbolDescriptionSample.razor b/Diagram/Wasm/Pages/SymbolPalette/SymbolDescriptionSample.razor index 4e59aa04..67a1f004 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SymbolDescriptionSample.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SymbolDescriptionSample.razor @@ -6,8 +6,8 @@
- +
@@ -15,18 +15,21 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfSymbolPaletteComponent SymbolPalette; - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -50,15 +53,15 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { - SymbolInfo SymbolInfo = new SymbolInfo(); - string text = null; - text = (symbol as Node).ID; - SymbolInfo.Description = new SymbolDescription() { Text = text }; - return SymbolInfo; + SymbolInfo symbolInfo = new SymbolInfo(); + string text = (symbol as Node).ID; + symbolInfo.Description = new SymbolDescription() { Text = text }; + return symbolInfo; } } \ No newline at end of file diff --git a/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTemplate.razor b/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTemplate.razor index a1c7de8f..4be243cd 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTemplate.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTemplate.razor @@ -3,7 +3,7 @@ @using Syncfusion.Blazor.Diagram @using Syncfusion.Blazor.Diagram.SymbolPalette - + @@ -13,22 +13,24 @@ @code { - private DiagramObjectCollection Symbols = new DiagramObjectCollection(); - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + private DiagramObjectCollection _symbols = new DiagramObjectCollection(); + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); protected override void OnInitialized() { - Symbols = new DiagramObjectCollection(); + _symbols = new DiagramObjectCollection(); + Node node = new Node() { ID = "Nativenode", Shape = new Shape() { Type = NodeShapes.SVG }, }; - Symbols.Add(node as NodeBase); - Palettes = new DiagramObjectCollection() + _symbols.Add(node as NodeBase); + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =Symbols,Title="Template Shape" }, + new Palette() { Symbols = _symbols, Title = "Template Shape" }, }; } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTooltip.razor b/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTooltip.razor index 74b42196..1126d893 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTooltip.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SymbolPaletteTooltip.razor @@ -134,13 +134,13 @@
- +
- +
@@ -149,32 +149,40 @@ @code { - private SymbolMargin SymbolMargin = new SymbolMargin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - private SfDiagramComponent diagram; - private SfSymbolPaletteComponent SymbolPalette; - //Define nodes collection. - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - //Define connectors collection. - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palettes collection. - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + private SfDiagramComponent _diagram; + + private SfSymbolPaletteComponent _symbolPalette; + + // Define nodes collection. + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + + // Define connectors collection. + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection. + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection. - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); + // Defines palette's group collection. - private DiagramObjectCollection PaletteGroup = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteGroup = new DiagramObjectCollection(); + // Defines palette's connector collection. - private DiagramObjectCollection PaletteConnectors = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteConnectors = new DiagramObjectCollection(); protected override async Task OnAfterRenderAsync(bool firstRender) { - SymbolPalette.Targets = new DiagramObjectCollection() { }; - SymbolPalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } protected override void OnInitialized() @@ -187,11 +195,12 @@ CreatePaletteNode(NodeFlowShapes.Terminator, "Terminator"); CreatePaletteConnector("Link1", ConnectorSegmentType.Orthogonal, DecoratorShape.Arrow); CreatePaletteGroup(); - Palettes = new DiagramObjectCollection() + + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols = PaletteNodes,Title = "Flow Shapes", ID = "Flow Shapes" }, - new Palette(){Symbols = PaletteConnectors,Title = "Connectors", IsExpanded = true}, - new Palette(){Symbols = PaletteGroup,Title = "Group Shapes", IsExpanded = true} + new Palette() { Symbols = _paletteNodes, Title = "Flow Shapes", ID = "Flow Shapes" }, + new Palette() { Symbols = _paletteConnectors, Title = "Connectors", IsExpanded = true }, + new Palette() { Symbols = _paletteGroup, Title = "Group Shapes", IsExpanded = true } }; } @@ -210,7 +219,8 @@ }, Constraints = NodeConstraints.Default | NodeConstraints.Tooltip }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } private void CreatePaletteConnector(string id, ConnectorSegmentType type, DecoratorShape decoratorShape) @@ -235,7 +245,8 @@ }, Constraints = ConnectorConstraints.Default | ConnectorConstraints.Tooltip }; - PaletteConnectors.Add(connector); + + _paletteConnectors.Add(connector); } private void CreatePaletteGroup() @@ -250,6 +261,7 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Rectangle }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; + Node node2 = new Node() { ID = "node2", @@ -260,14 +272,17 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse }, Style = new ShapeStyle() { Fill = "#6495ed" }, }; - PaletteGroup.Add(node1); - PaletteGroup.Add(node2); + + _paletteGroup.Add(node1); + _paletteGroup.Add(node2); + NodeGroup group = new NodeGroup() { ID = "group1", Children = new string[] { "node1", "node2" } }; - PaletteGroup.Add(group); + + _paletteGroup.Add(group); } private void DragDrop(DropEventArgs args) diff --git a/Diagram/Wasm/Pages/SymbolPalette/SymbolPreview.razor b/Diagram/Wasm/Pages/SymbolPalette/SymbolPreview.razor index e2ce9fda..f414c93d 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SymbolPreview.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SymbolPreview.razor @@ -133,13 +133,13 @@
- +
- +
@@ -148,20 +148,27 @@ @code { - //Define symbolpreview - private DiagramSize Preview; - //Define SymbolMargin - private SymbolMargin SymbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the diagram - private SfDiagramComponent diagram; - //Reference the symbol palette - private SfSymbolPaletteComponent symbolpalette; - private DiagramObjectCollection nodes = new DiagramObjectCollection(); - private DiagramObjectCollection connectors = new DiagramObjectCollection(); - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + // Define symbol preview + private DiagramSize _preview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; + + // Reference the diagram + private SfDiagramComponent _diagram; + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + private DiagramObjectCollection _nodes = new DiagramObjectCollection(); + private DiagramObjectCollection _connectors = new DiagramObjectCollection(); + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -170,25 +177,25 @@ protected override async Task OnAfterRenderAsync(bool firstRender) { - symbolpalette.Targets = new DiagramObjectCollection() { }; - symbolpalette.Targets.Add(diagram); + _symbolPalette.Targets = new DiagramObjectCollection() { }; + _symbolPalette.Targets.Add(_diagram); } private void InitPaletteModel() { - Preview = new DiagramSize(); - Preview.Width = 100; - Preview.Height = 100; + _preview = new DiagramSize(); + _preview.Width = 100; + _preview.Height = 100; CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } - //Method to create palette node + // Method to create palette node private void CreatePaletteNode(NodeBasicShapes basicShape, string id) { Node node = new Node() @@ -197,7 +204,8 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } } diff --git a/Diagram/Wasm/Pages/SymbolPalette/SymbolStretch.razor b/Diagram/Wasm/Pages/SymbolPalette/SymbolStretch.razor index 36054cf0..b8e31417 100644 --- a/Diagram/Wasm/Pages/SymbolPalette/SymbolStretch.razor +++ b/Diagram/Wasm/Pages/SymbolPalette/SymbolStretch.razor @@ -13,24 +13,28 @@
-@code +@code { - //Define symbolpreview - private DiagramSize SymbolPreview; - //Define SymbolMargin - private SymbolMargin SymbolMargin = new SymbolMargin + // Define symbol preview + private DiagramSize _symbolPreview; + + // Define symbol margin + private SymbolMargin _symbolMargin = new SymbolMargin { Left = 15, Right = 15, Top = 15, Bottom = 15 }; - //Reference the symbolpalette - private SfSymbolPaletteComponent symbolpalette; - //Define palattes collection - private DiagramObjectCollection Palettes = new DiagramObjectCollection(); + + // Reference the symbol palette + private SfSymbolPaletteComponent _symbolPalette; + + // Define palettes collection + private DiagramObjectCollection _palettes = new DiagramObjectCollection(); + // Defines palette's flow-shape collection - private DiagramObjectCollection PaletteNodes = new DiagramObjectCollection(); + private DiagramObjectCollection _paletteNodes = new DiagramObjectCollection(); protected override void OnInitialized() { @@ -39,18 +43,18 @@ private void InitPaletteModel() { - Palettes = new DiagramObjectCollection(); + _palettes = new DiagramObjectCollection(); - PaletteNodes = new DiagramObjectCollection(); + _paletteNodes = new DiagramObjectCollection(); CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle"); - Palettes = new DiagramObjectCollection() + _palettes = new DiagramObjectCollection() { - new Palette(){Symbols =PaletteNodes,Title="Basic Shapes",ID="Basic Shapes" }, + new Palette() { Symbols = _paletteNodes, Title = "Basic Shapes", ID = "Basic Shapes" }, }; } - //Method to create palette node + // Method to create palette node private void CreatePaletteNode(NodeBasicShapes basicShape, string id) { Node node = new Node() @@ -59,17 +63,17 @@ Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = basicShape }, Style = new ShapeStyle() { Fill = "#6495ED", StrokeColor = "#6495ED" }, }; - PaletteNodes.Add(node); + + _paletteNodes.Add(node); } - //Method to getsymbolinfo + // Method to get symbol info private SymbolInfo GetSymbolInfo(IDiagramObject symbol) { - SymbolInfo SymbolInfo = new SymbolInfo(); - //SymbolInfo.Fit = true; - string text = null; - text = (symbol as Node).ID; - SymbolInfo.Description = new SymbolDescription() { Text = text }; - return SymbolInfo; + SymbolInfo symbolInfo = new SymbolInfo(); + // symbolInfo.Fit = true; + string text = (symbol as Node).ID; + symbolInfo.Description = new SymbolDescription() { Text = text }; + return symbolInfo; } }