添加项目文件。

AIStudio.Wpf.ADiagram/Demos/Flowchart/FlowchartService.cs

@@ -0,0 +1,47 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    public static class FlowchartService
+    {
+        static FlowchartService()
+        {
+            Users = new List<SelectOption>()
+            {
+                new SelectOption(){ value = "操作员1",text = "操作员1" },
+                new SelectOption(){ value = "操作员2",text = "操作员2" },
+                new SelectOption(){ value = "Admin",text = "Admin" },
+            };
+
+            Roles = new List<SelectOption>()
+            {
+                new SelectOption(){ value = "操作员",text = "操作员" },
+                new SelectOption(){ value = "管理员",text = "管理员" },
+            };
+        }
+
+        private static List<SelectOption> _users;
+        public static List<SelectOption> Users
+        {
+            get { return _users; }
+            set
+            {
+                _users = value;
+            }
+        }
+
+        private static List<SelectOption> _roles;
+        public static List<SelectOption> Roles
+        {
+            get { return _roles; }
+            set
+            {
+                _roles = value;
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Flowchart/FlowchartViewModel.cs

@@ -0,0 +1,102 @@
+using AIStudio.Wpf.ADiagram.ViewModels;
+using System;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Media;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    public class FlowchartViewModel : DiagramsViewModel
+    {
+        public FlowchartViewModel(MainWindowViewModel mainWindowViewModel, string title, string status, DiagramType diagramType) : base(mainWindowViewModel, title, status, diagramType)
+        {
+
+        }
+        public FlowchartViewModel(MainWindowViewModel mainWindowViewModel, string filename) : base(mainWindowViewModel, filename)
+        {
+
+        }
+
+        protected override void InitDiagramViewModel()
+        {
+            base.InitDiagramViewModel();
+
+            DiagramViewModel.ShowGrid = true;
+            DiagramViewModel.GridCellSize = new Size(100, 100);
+            DiagramViewModel.CellHorizontalAlignment = CellHorizontalAlignment.Center;
+            DiagramViewModel.CellVerticalAlignment = CellVerticalAlignment.Center;
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            DesignerItemViewModelBase start = new StartFlowNode() { Left = 100, Top = 0, Color = Colors.Green.ToString() };
+            DiagramViewModel.DirectAddItemCommand.Execute(start);
+
+            DesignerItemViewModelBase middle1 = new MiddleFlowNode() { Left = 100, Top = 100, Color = Colors.Yellow.ToString(), Text = "主管审批" };
+            DiagramViewModel.DirectAddItemCommand.Execute(middle1);
+
+            DesignerItemViewModelBase decide = new DecideFlowNode() { Left = 100, Top = 200, Color = Colors.Yellow.ToString(), Text = "条件" };
+            DiagramViewModel.DirectAddItemCommand.Execute(decide);
+
+            DesignerItemViewModelBase middle2 = new MiddleFlowNode() { Left = 200, Top = 300, Color = Colors.Yellow.ToString(), Text = "分管领导" };
+            DiagramViewModel.DirectAddItemCommand.Execute(middle2);
+
+            DesignerItemViewModelBase cobegin = new COBeginFlowNode() { Left = 100, Top = 400, Color = Colors.Yellow.ToString() };
+            DiagramViewModel.DirectAddItemCommand.Execute(cobegin);
+
+            DesignerItemViewModelBase middle3 = new MiddleFlowNode() { Left = 100, Top = 500, Color = Colors.Yellow.ToString(), Text = "财务审批" };
+            DiagramViewModel.DirectAddItemCommand.Execute(middle3);
+
+            DesignerItemViewModelBase middle4 = new MiddleFlowNode() { Left = 200, Top = 500, Color = Colors.Yellow.ToString(), Text = "人力审批" };
+            DiagramViewModel.DirectAddItemCommand.Execute(middle4);
+
+            DesignerItemViewModelBase coend = new COEndFlowNode() { Left = 100, Top = 600, Color = Colors.Yellow.ToString() };
+            DiagramViewModel.DirectAddItemCommand.Execute(coend);
+
+            DesignerItemViewModelBase end = new EndFlowNode() { Left = 100, Top = 700, Color = Colors.Yellow.ToString() };
+            DiagramViewModel.DirectAddItemCommand.Execute(end);
+
+            ConnectorViewModel connector1 = new ConnectorViewModel(start.BottomConnector, middle1.TopConnector);     
+            DiagramViewModel.DirectAddItemCommand.Execute(connector1);
+
+            ConnectorViewModel connector2 = new ConnectorViewModel(middle1.BottomConnector, decide.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector2);
+
+            ConnectorViewModel connector3 = new ConnectorViewModel(decide.RightConnector, middle2.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector3);
+            connector3.AddText(">=3");
+
+            ConnectorViewModel connector4 = new ConnectorViewModel(middle2.BottomConnector, cobegin.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector4);
+
+            ConnectorViewModel connector5 = new ConnectorViewModel(decide.BottomConnector, cobegin.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector5);
+            connector5.AddText("<3");
+
+            ConnectorViewModel connector6 = new ConnectorViewModel(cobegin.BottomConnector, middle3.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector6);
+
+            ConnectorViewModel connector7 = new ConnectorViewModel(cobegin.BottomConnector, middle4.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector7);
+
+            ConnectorViewModel connector8 = new ConnectorViewModel(middle3.BottomConnector, coend.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector8);
+
+            ConnectorViewModel connector9 = new ConnectorViewModel(middle4.BottomConnector, coend.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector9);
+
+            ConnectorViewModel connector10 = new ConnectorViewModel(coend.BottomConnector, end.TopConnector);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector10);
+
+            DiagramViewModel.ClearSelectedItems();
+        }
+
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Flowchart/Models/FlowNodeDesignerItem.cs

@@ -0,0 +1,50 @@
+using Newtonsoft.Json;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Media;
+using System.Xml.Serialization;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    public class FlowNodeDesignerItem : DesignerItemBase
+    {
+        public FlowNodeDesignerItem()
+        {
+
+        }
+        public FlowNodeDesignerItem(FlowNode item) : base(item)
+        {
+            if (item is MiddleFlowNode middleFlow)
+            {
+                UserIds = middleFlow.UserIds;
+                RoleIds = middleFlow.RoleIds;
+                ActType = middleFlow.ActType;
+            }
+            Color = item.Color;
+            Kind = item.Kind;
+            StateImage = item.StateImage;
+        }
+
+        [XmlArray]
+        public List<string> UserIds { get; set; }
+
+        [XmlArray]
+        public List<string> RoleIds { get; set; }
+
+        [XmlAttribute]
+        public string ActType { get; set; }
+
+        [XmlAttribute]
+        public string Color { get; set; }
+
+        [XmlAttribute]
+        public NodeKinds Kind { get; set; }
+
+        [XmlAttribute]
+        public string StateImage { get; set; }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Flowchart/NodeKinds.cs

@@ -0,0 +1,27 @@
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    public enum NodeKinds
+    {
+        [Description("节点")]
+        Normal = 0,
+        [Description("开始")]
+        Start = 1,
+        [Description("结束")]
+        End = 2,
+        [Description("中间节点")]
+        Middle = 3,
+        [Description("条件节点")]
+        Decide = 4,
+        [Description("并行开始")]
+        COBegin = 5,
+        [Description("并行结束")]
+        COEnd = 6,
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Flowchart/SelectOption.cs

@@ -0,0 +1,22 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    /// <summary>
+    /// 前端SelectOption
+    /// </summary>
+    public class SelectOption
+    {
+        public string value { get; set; }
+        public string text { get; set; }
+
+        public override string ToString()
+        {
+            return text;
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Flowchart/ViewModels/FlowNode.cs

@@ -0,0 +1,136 @@
+using AIStudio.Wpf.ADiagram.Helpers;
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    public class FlowNode : DesignerItemViewModelBase
+    {
+        public FlowNode(NodeKinds kind) : base()
+        {
+            Kind = kind;
+            Text = Kind.GetDescription();
+            ShowText = true;
+            ItemWidth = 80;
+            ItemHeight = 40;
+
+        }
+
+        public FlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            ShowRotate = false;
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            FlowNodeDesignerItem designer = designerbase as FlowNodeDesignerItem;
+            this.Color = designer.Color;
+            this.Kind = designer.Kind;
+            this.StateImage = designer.StateImage;
+
+            if (this is MiddleFlowNode middle)
+            {
+                middle.UserIds = designer.UserIds;
+                middle.RoleIds = designer.RoleIds;
+                middle.ActType = designer.ActType;
+            }
+        }
+
+        private string _color;
+        [Browsable(true)]
+        public string Color
+        {
+            get { return _color; }
+            set
+            {
+                SetProperty(ref _color, value);
+            }
+        }
+
+        [Browsable(false)]
+        public NodeKinds Kind { get; set; }
+
+        [Browsable(false)]
+        public string StateImage { get; set; }
+    }
+
+    public class StartFlowNode : FlowNode
+    {
+        public StartFlowNode() : base(NodeKinds.Start)
+        {
+
+        }
+
+        public StartFlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class EndFlowNode : FlowNode
+    {
+        public EndFlowNode() : base(NodeKinds.End)
+        {
+
+        }
+
+        public EndFlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class DecideFlowNode : FlowNode
+    {
+        public DecideFlowNode() : base(NodeKinds.Decide)
+        {
+
+        }
+
+        public DecideFlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class COBeginFlowNode : FlowNode
+    {
+        public COBeginFlowNode() : base(NodeKinds.COBegin)
+        {
+
+        }
+
+        public COBeginFlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class COEndFlowNode : FlowNode
+    {
+        public COEndFlowNode() : base(NodeKinds.COEnd)
+        {
+
+        }
+
+        public COEndFlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Flowchart/ViewModels/FlowNode.xaml

@@ -0,0 +1,129 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Models"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:demo="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Flowchart"
+                    xmlns:converter="clr-namespace:AIStudio.Wpf.ADiagram.Converters">
+    <converter:HtmlColorConverter x:Key="HtmlColorConverter"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter"/>
+
+    <ControlTemplate x:Key="NormalNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Border BorderThickness="1" BorderBrush="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Background="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}">
+                <Grid>
+                    <Border HorizontalAlignment="Left" Width="3" Background="{Binding Color}"/>
+                </Grid>
+            </Border>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTemplate x:Key="StartNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Border CornerRadius="3" BorderThickness="1" BorderBrush="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Background="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}">
+                <Grid>
+                    <Border HorizontalAlignment="Left" CornerRadius="3,0,0,3" Width="3" Background="{Binding Color}"/>
+                </Grid>
+            </Border>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTemplate x:Key="EndNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Border CornerRadius="3" BorderThickness="1" BorderBrush="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Background="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}">
+                <Grid>
+                    <Border HorizontalAlignment="Left" CornerRadius="3,0,0,3" Width="3" Background="{Binding Color}"/>
+                </Grid>
+            </Border>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTemplate x:Key="MiddleNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Border BorderThickness="1" BorderBrush="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Background="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}">
+                <Grid>
+                    <Border HorizontalAlignment="Left" Width="3" Background="{Binding Color}"/>
+                </Grid>
+            </Border>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTemplate x:Key="DecideNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Path Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}" StrokeThickness="1" Stretch="Fill" Data="M 0,0.25 L 0.5 0 L 1,0.25 L 0.5,0.5 Z"></Path>
+        </Grid>
+    </ControlTemplate>
+
+
+    <ControlTemplate x:Key="COBeginNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Border BorderThickness="1" BorderBrush="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Background="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}">
+                <Grid>
+                    <Border HorizontalAlignment="Left" Width="3" Background="{Binding Color}"/>
+                </Grid>
+            </Border>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTemplate x:Key="COEndNodeStyle" TargetType="{x:Type ContentControl}">
+        <Grid>
+            <Border BorderThickness="1" BorderBrush="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" Background="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}">
+                <Grid>
+                    <Border HorizontalAlignment="Left" Width="3" Background="{Binding Color}"/>
+                </Grid>
+            </Border>
+        </Grid>
+    </ControlTemplate>
+
+    <Style x:Key="CustomFlowNodeStyle" TargetType="{x:Type ContentControl}">
+        <Setter Property="Template" Value="{StaticResource NormalNodeStyle}" />
+        <Style.Triggers>
+            <DataTrigger Binding="{Binding Kind}" Value="Start">
+                <Setter Property="Template" Value="{StaticResource StartNodeStyle}" />
+            </DataTrigger>
+            <DataTrigger Binding="{Binding Kind}" Value="End">
+                <Setter Property="Template" Value="{StaticResource EndNodeStyle}" />
+            </DataTrigger>
+            <DataTrigger Binding="{Binding Kind}" Value="Middle">
+                <Setter Property="Template" Value="{StaticResource MiddleNodeStyle}" />
+            </DataTrigger>
+            <DataTrigger Binding="{Binding Kind}" Value="Decide">
+                <Setter Property="Template" Value="{StaticResource DecideNodeStyle}" />
+            </DataTrigger>
+            <DataTrigger Binding="{Binding Kind}" Value="COBegin">
+                <Setter Property="Template" Value="{StaticResource COBeginNodeStyle}" />
+            </DataTrigger>
+            <DataTrigger Binding="{Binding Kind}" Value="COEnd">
+                <Setter Property="Template" Value="{StaticResource COEndNodeStyle}" />
+            </DataTrigger>
+        </Style.Triggers>
+    </Style>
+
+
+    <DataTemplate DataType="{x:Type model:FlowchartToolBoxData}">
+        <Grid Width="{Binding Width}" Height="{Binding Height}">
+            <Rectangle Name="Border"
+                                   StrokeThickness="1"
+                                   StrokeDashArray="2"
+                                   Fill="Transparent"
+                                   SnapsToDevicePixels="true"/>
+            <Viewbox Stretch="Fill">
+                <Grid>
+                    <ContentControl Style="{StaticResource CustomFlowNodeStyle}" Margin="2"/>
+                    <TextBlock Text="{Binding Text}" Margin="5" Foreground="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" VerticalAlignment="Center" HorizontalAlignment="Center" />
+                </Grid>
+            </Viewbox>
+        </Grid>
+        <DataTemplate.Triggers>
+            <Trigger Property="IsMouseOver" Value="true">
+                <Setter TargetName="Border" Property="Stroke" Value="Gray"/>
+            </Trigger>
+        </DataTemplate.Triggers>
+    </DataTemplate>
+
+    <DataTemplate DataType="{x:Type demo:FlowNode}">
+        <Grid IsHitTestVisible="False">
+            <ContentControl Style="{StaticResource CustomFlowNodeStyle}"/>
+        </Grid>
+    </DataTemplate>
+
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Flowchart/ViewModels/MiddleFlowNode.cs

@@ -0,0 +1,60 @@
+using AIStudio.Wpf.ADiagram.Controls;
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Flowchart
+{
+    public class MiddleFlowNode : FlowNode
+    {
+        public MiddleFlowNode() : base(NodeKinds.Middle)
+        {
+
+        }
+
+        public MiddleFlowNode(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        private List<string> _userIds = new List<string>();
+        [Browsable(true)]
+        [StyleName("UserIdsStyle")]
+        public List<string> UserIds
+        {
+            get { return _userIds; }
+            set
+            {
+                SetProperty(ref _userIds, value);
+            }
+        }
+
+        private List<string> _roleIds = new List<string>();
+        [Browsable(true)]
+        [StyleName("RoleIdsStyle")]
+        public List<string> RoleIds
+        {
+            get { return _roleIds; }
+            set
+            {
+                SetProperty(ref _roleIds, value);
+            }
+        }
+
+        private string _actType;
+        [Browsable(true)]
+        [StyleName("ActTypeStyle")]
+        public string ActType
+        {
+            get { return _actType; }
+            set
+            {
+                SetProperty(ref _actType, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/LinkPoint.cs

@@ -0,0 +1,25 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    public class LinkPoint: BindableBase
+    {
+        public Guid Id { get; set; }
+        public string Name { get; set; }
+
+        private double _value;
+        public double Value
+        {
+            get { return _value; }
+            set
+            {
+                SetProperty(ref _value, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/LogicalService.cs

@@ -0,0 +1,23 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    public static class LogicalService
+    {
+        public static List<LinkPoint> LinkPoint { get; set; }
+
+        static LogicalService()
+        {
+            LinkPoint = new List<LinkPoint>();
+            for (int i = 0; i < 10; i++)
+            {
+                LinkPoint.Add(new Logical.LinkPoint { Id = Guid.NewGuid(), Name = $"测点{i}", Value = i });
+            }
+
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/LogicalViewModel.cs

@@ -0,0 +1,416 @@
+using AIStudio.Wpf.ADiagram.ViewModels;
+using System;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Media;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    public class LogicalViewModel : DiagramsViewModel
+    {
+        public LogicalViewModel(MainWindowViewModel mainWindowViewModel, string title, string status, DiagramType diagramType) : base(mainWindowViewModel, title, status, diagramType)
+        {
+
+        }
+        public LogicalViewModel(MainWindowViewModel mainWindowViewModel, string filename) : base(mainWindowViewModel, filename)
+        {
+
+        }
+
+        protected override void InitDiagramViewModel()
+        {
+            base.InitDiagramViewModel();
+
+            DiagramViewModel.ShowGrid = true;
+            DiagramViewModel.GridCellSize = new Size(150, 100);
+            DiagramViewModel.PageSizeOrientation = PageSizeOrientation.Horizontal;
+            DiagramViewModel.CellHorizontalAlignment = CellHorizontalAlignment.Left;
+            DiagramViewModel.CellVerticalAlignment = CellVerticalAlignment.None;
+
+            DiagramViewModel.Items.CollectionChanged += Items_CollectionChanged;
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            TimerDesignerItemViewModel timer = new TimerDesignerItemViewModel() { Left = 0, Top = 10 };
+            timer.Value = 0.5;
+            DiagramViewModel.DirectAddItemCommand.Execute(timer);
+
+            InputItemViewModel in1 = new InputItemViewModel() { Left = 0, Top = 50 };
+            in1.LinkPoint = LogicalService.LinkPoint[0];
+            DiagramViewModel.DirectAddItemCommand.Execute(in1);
+
+            InputItemViewModel in2 = new InputItemViewModel() { Left = 0, Top = 80 };
+            in2.LinkPoint = LogicalService.LinkPoint[1];
+            DiagramViewModel.DirectAddItemCommand.Execute(in2);
+
+            AddGateItemViewModel item1 = new AddGateItemViewModel() { Left = 150, Top = 50 };
+            DiagramViewModel.DirectAddItemCommand.Execute(item1);
+
+            ConstantDesignerItemViewModel constant = new ConstantDesignerItemViewModel() { Left = 150, Top = 118 };
+            DiagramViewModel.DirectAddItemCommand.Execute(constant);
+
+            GTGateItemViewModel gTGate = new GTGateItemViewModel() { Left = 300, Top = 50 };
+            DiagramViewModel.DirectAddItemCommand.Execute(gTGate);
+
+            InputItemViewModel in3 = new InputItemViewModel() { Left = 300, Top = 118 };
+            in3.LinkPoint = LogicalService.LinkPoint[2];
+            DiagramViewModel.DirectAddItemCommand.Execute(in3);
+
+            InputItemViewModel in4 = new InputItemViewModel() { Left = 300, Top = 148 };
+            in4.LinkPoint = LogicalService.LinkPoint[3];
+            DiagramViewModel.DirectAddItemCommand.Execute(in4);
+
+            SELGateItemViewModel sELGate = new SELGateItemViewModel() { Left = 450, Top = 50 };
+            DiagramViewModel.DirectAddItemCommand.Execute(sELGate);
+
+            OutputItemViewModel out1 = new OutputItemViewModel() { Left = 600, Top = 50 };
+            out1.LinkPoint = LogicalService.LinkPoint[4];
+            DiagramViewModel.DirectAddItemCommand.Execute(out1);
+
+            ConnectorViewModel connector1 = new ConnectorViewModel(in1.Output[0], item1.Input[0]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector1);
+
+            ConnectorViewModel connector2 = new ConnectorViewModel(in2.Output[0], item1.Input[1]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector2);
+
+            ConnectorViewModel connector3 = new ConnectorViewModel(item1.Output[0], gTGate.Input[0]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector3);
+
+            ConnectorViewModel connector4 = new ConnectorViewModel(constant.Output[0], gTGate.Input[1]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector4);
+
+            ConnectorViewModel connector5 = new ConnectorViewModel(gTGate.Output[0], sELGate.Input[0]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector5);
+
+            ConnectorViewModel connector6 = new ConnectorViewModel(in3.Output[0], sELGate.Input[1]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector6);
+
+            ConnectorViewModel connector7 = new ConnectorViewModel(in4.Output[0], sELGate.Input[2]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector7);
+
+            ConnectorViewModel connector8 = new ConnectorViewModel(sELGate.Output[0], out1.Input[0]);
+            DiagramViewModel.DirectAddItemCommand.Execute(connector8);
+        }
+
+        private void Items_CollectionChanged(object sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
+        {
+            if (e.OldItems != null)
+            {
+                foreach (var item in e.OldItems.OfType<TimerDesignerItemViewModel>())
+                {
+                    item.Do -= Do;
+                }
+            }
+            if (e.NewItems != null)
+            {
+                foreach (var item in e.NewItems.OfType<TimerDesignerItemViewModel>())
+                {
+                    item.Do += Do;
+                }
+            }
+
+            RaisePropertyChanged("Items");
+        }
+
+        protected override bool AddVerify(SelectableDesignerItemViewModelBase arg)
+        {
+            if (base.AddVerify(arg) == false)
+                return false;
+
+            if (arg is ConnectorViewModel connector)
+            {
+                if (connector.SinkConnectorInfo is FullyCreatedConnectorInfo fully)
+                {
+                    if (DiagramViewModel.Items.OfType<ConnectorViewModel>().Any(p => p.SinkConnectorInfo == fully))
+                    {
+                        return false;
+                    }
+                }
+            }
+
+            return true;
+        }
+
+        private void Do()
+        {
+            foreach (var item in DiagramViewModel.Items.OfType<ConstantDesignerItemViewModel>())
+            {
+                foreach (var output in item.Output)
+                {
+                    output.Value.ConnectorValue = item.Value;
+                    output.Value.ColorViewModel.FillColor.Color = Colors.Green;
+                }
+            }
+
+            foreach (var item in DiagramViewModel.Items.OfType<InputItemViewModel>())
+            {
+                if (item.LinkPoint != null)
+                {
+                    foreach (var output in item.Output)
+                    {
+                        output.Value.ConnectorValue = item.LinkPoint.Value;
+                        output.Value.ColorViewModel.FillColor.Color = Colors.Green;
+                    }
+                }
+            }
+
+            foreach (var item in DiagramViewModel.Items.OfType<LogicalGateItemViewModelBase>().OrderBy(p => p.OrderNumber))
+            {
+                if (item.LogicalType != LogicalType.None)
+                {
+                    foreach (var input in item.Input)
+                    {
+                        var connector = GetSourceItem(input.Value);
+                        if (connector == null)
+                        {
+                            continue;
+                        }
+
+                        if (connector.SourceConnectorInfo.DataItem is LogicalGateItemViewModelBase)
+                        {
+                            input.Value.ConnectorValue = connector.SourceConnectorInfo.ConnectorValue;
+
+                            input.Value.ColorViewModel.FillColor.Color = connector.SourceConnectorInfo.ColorViewModel.FillColor.Color;
+                            connector.ColorViewModel.LineColor.Color = connector.SourceConnectorInfo.ColorViewModel.FillColor.Color;
+
+                            if (item.LogicalType == LogicalType.Output)
+                            {
+                                input.Value.ValueTypePoint = connector.SourceConnectorInfo.ValueTypePoint;
+                            }
+                            else if (item.LogicalType == LogicalType.NOT)
+                            {
+                                input.Value.ValueTypePoint = (connector.SourceConnectorInfo.ValueTypePoint == ValueTypePoint.Bool) ? ValueTypePoint.Bool : ValueTypePoint.Int;
+                            }
+                        }
+                    }
+
+                    foreach (var output in item.Output)
+                    {
+                        if (item.LogicalType == LogicalType.Output)
+                        {
+                            var first = item.Input.Values.FirstOrDefault();
+                            output.Value.ConnectorValue = first.ConnectorValue;
+                            output.Value.ValueTypePoint = first.ValueTypePoint;
+                            (item as OutputItemViewModel).Value = first.ConnectorValue;
+                            (item as OutputItemViewModel).LinkPoint.Value = first.ConnectorValue;
+                        }
+                        else if (item.LogicalType == LogicalType.ADD)
+                        {
+                            output.Value.ConnectorValue = item.Input.Values.Select(p => p.ConnectorValue).Sum();
+                        }
+                        else if (item.LogicalType == LogicalType.SUB)
+                        {
+                            var first = item.Input.Values.Select(p => p.ConnectorValue).FirstOrDefault();
+                            var second = item.Input.Values.Where((value, index) => index != 0).Select(p => p.ConnectorValue).Sum();
+                            output.Value.ConnectorValue = first - second;
+                        }
+                        else if (item.LogicalType == LogicalType.MUL)
+                        {
+                            double result = 0;
+                            foreach (var input in item.Input.Values)
+                            {
+                                if (result == 0)
+                                {
+                                    result = 1;
+                                }
+                                result *= input.ConnectorValue;
+                            }
+                            output.Value.ConnectorValue = result;
+                        }
+                        else if (item.LogicalType == LogicalType.DIV)
+                        {
+                            double result = item.Input.Values.Select(p => p.ConnectorValue).FirstOrDefault();
+                            foreach (var input in item.Input.Values.Where((value, index) => index != 0))
+                            {
+                                result /= input.ConnectorValue;
+                            }
+                            output.Value.ConnectorValue = result;
+                        }
+                        else if (item.LogicalType == LogicalType.AVE)
+                        {
+                            output.Value.ConnectorValue = item.Input.Values.Select(p => p.ConnectorValue).Average();
+                        }
+                        else if (item.LogicalType == LogicalType.MOD)
+                        {
+                            output.Value.ConnectorValue = item.Input[0].ConnectorValue % item.Input[1].ConnectorValue;
+                        }
+                        else if (item.LogicalType == LogicalType.AND)
+                        {
+                            output.Value.ConnectorValue = Convert.ToInt32(item.Input[0].ConnectorValue) & Convert.ToInt32(item.Input[1].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.OR)
+                        {
+                            output.Value.ConnectorValue = Convert.ToInt32(item.Input[0].ConnectorValue) | Convert.ToInt32(item.Input[1].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.XOR)
+                        {
+                            output.Value.ConnectorValue = Convert.ToInt32(Convert.ToInt32(item.Input[0].ConnectorValue) ^ Convert.ToInt32(item.Input[1].ConnectorValue));
+                        }
+                        else if (item.LogicalType == LogicalType.NOT)
+                        {
+                            if (item.Input[0].ValueTypePoint == ValueTypePoint.Bool)
+                            {
+                                output.Value.ConnectorValue = Convert.ToInt32(!Convert.ToBoolean(item.Input[0].ConnectorValue));
+                                output.Value.ValueTypePoint = ValueTypePoint.Bool;
+                            }
+                            else
+                            {
+                                output.Value.ConnectorValue = ~Convert.ToInt32(item.Input[0].ConnectorValue);
+                                output.Value.ValueTypePoint = ValueTypePoint.Int;
+                            }
+
+                        }
+                        else if (item.LogicalType == LogicalType.SHL)
+                        {
+                            output.Value.ConnectorValue = Convert.ToInt32(item.Input[0].ConnectorValue) << Convert.ToInt32(item.Input[1].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.SHR)
+                        {
+                            output.Value.ConnectorValue = Convert.ToInt32(item.Input[0].ConnectorValue) >> Convert.ToInt32(item.Input[1].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.ROL)
+                        {
+                            output.Value.ConnectorValue = (Convert.ToInt32(item.Input[0].ConnectorValue) << Convert.ToInt32(item.Input[1].ConnectorValue)) | (Convert.ToInt32(item.Input[0].ConnectorValue) >> 32 - Convert.ToInt32(item.Input[1].ConnectorValue));
+                        }
+                        else if (item.LogicalType == LogicalType.ROR)
+                        {
+                            output.Value.ConnectorValue = (Convert.ToInt32(item.Input[0].ConnectorValue) >> Convert.ToInt32(item.Input[1].ConnectorValue)) | (Convert.ToInt32(item.Input[0].ConnectorValue) << 32 - Convert.ToInt32(item.Input[1].ConnectorValue));
+                        }
+                        else if (item.LogicalType == LogicalType.SEL)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue == output.Key) ? item.Input[1].ConnectorValue : item.Input[2].ConnectorValue;
+                        }
+                        else if (item.LogicalType == LogicalType.MAX)
+                        {
+                            output.Value.ConnectorValue = item.Input.Values.Select(p => p.ConnectorValue).Max();
+                        }
+                        else if (item.LogicalType == LogicalType.MIN)
+                        {
+                            output.Value.ConnectorValue = item.Input.Values.Select(p => p.ConnectorValue).Min();
+                        }
+                        else if (item.LogicalType == LogicalType.LIMIT)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue > item.Input[1].ConnectorValue) ? item.Input[1].ConnectorValue : item.Input[0].ConnectorValue;
+                        }
+                        else if (item.LogicalType == LogicalType.GT)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue > item.Input[1].ConnectorValue) ? 1 : 0;
+                        }
+                        else if (item.LogicalType == LogicalType.LT)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue < item.Input[1].ConnectorValue) ? 1 : 0;
+                        }
+                        else if (item.LogicalType == LogicalType.GE)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue >= item.Input[1].ConnectorValue) ? 1 : 0;
+                        }
+                        else if (item.LogicalType == LogicalType.LE)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue <= item.Input[1].ConnectorValue) ? 1 : 0;
+                        }
+                        else if (item.LogicalType == LogicalType.EQ)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue == item.Input[1].ConnectorValue) ? 1 : 0;
+                        }
+                        else if (item.LogicalType == LogicalType.NE)
+                        {
+                            output.Value.ConnectorValue = (item.Input[0].ConnectorValue != item.Input[1].ConnectorValue) ? 1 : 0;
+                        }
+                        else if (item.LogicalType == LogicalType.ABS)
+                        {
+                            output.Value.ConnectorValue = Math.Abs(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.SQRT)
+                        {
+                            output.Value.ConnectorValue = Math.Sqrt(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.LN)
+                        {
+                            output.Value.ConnectorValue = Math.Log10(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.LOG)
+                        {
+                            output.Value.ConnectorValue = Math.Log(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.EXP)
+                        {
+                            output.Value.ConnectorValue = Math.Exp(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.SIN)
+                        {
+                            output.Value.ConnectorValue = Math.Sin(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.COS)
+                        {
+                            output.Value.ConnectorValue = Math.Cos(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.TAN)
+                        {
+                            output.Value.ConnectorValue = Math.Tan(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.ASIN)
+                        {
+                            output.Value.ConnectorValue = Math.Asin(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.ACOS)
+                        {
+                            output.Value.ConnectorValue = Math.Acos(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.ATAN)
+                        {
+                            output.Value.ConnectorValue = Math.Atan(item.Input[0].ConnectorValue);
+                        }
+                        else if (item.LogicalType == LogicalType.EXPT)
+                        {
+                            output.Value.ConnectorValue = Math.Exp(item.Input[0].ConnectorValue);
+                        }
+
+                        if (output.Value.ValueTypePoint == ValueTypePoint.Bool)
+                        {
+                            if (output.Value.ConnectorValue == 0)
+                            {
+                                output.Value.ColorViewModel.FillColor.Color = Colors.Red;
+                                if (item.LogicalType == LogicalType.Output)
+                                {
+                                    item.ColorViewModel.FillColor.Color = Colors.Red;
+                                }
+                            }
+                            else
+                            {
+                                output.Value.ColorViewModel.FillColor.Color = Colors.Green;
+                                if (item.LogicalType == LogicalType.Output)
+                                {
+                                    item.ColorViewModel.FillColor.Color = Colors.Green;
+                                }
+                            }
+                        }
+                        else
+                        {
+                            output.Value.ColorViewModel.FillColor.Color = Colors.Green;
+                        }
+                    }
+                }
+            }
+        }
+
+        private ConnectorViewModel GetSourceItem(FullyCreatedConnectorInfo sinkConnector)
+        {
+            foreach (var connector in DiagramViewModel.Items.OfType<ConnectorViewModel>())
+            {
+                if (connector.SinkConnectorInfo == sinkConnector)
+                {
+                    return connector;
+                }
+            }
+            return null;
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/Models/LogicalGateItem.cs

@@ -0,0 +1,25 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Xml.Serialization;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    public class LogicalGateItem : LogicalGateDesignerItemBase
+    {
+        public LogicalGateItem()
+        {
+
+        }
+        public LogicalGateItem(LogicalGateItemViewModel item) : base(item)
+        {
+
+        }     
+
+
+
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/ViewModels/LinkPointDesignerItemData.cs

@@ -0,0 +1,32 @@
+using AIStudio.Wpf.ADiagram.Models;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    /// <summary>
+    /// This is passed to the PopupWindow.xaml window, where a DataTemplate is used to provide the
+    /// ContentControl with the look for this data. This class is also used to allow
+    /// the popup to be cancelled without applying any changes to the calling ViewModel
+    /// whos data will be updated if the PopupWindow.xaml window is closed successfully
+    /// </summary>
+    public class LinkPointDesignerItemData : TitleBindableBase
+    {
+        public LinkPointDesignerItemData(LinkPoint linkPoint)
+        {
+            this.LinkPoint = linkPoint;           
+        }
+
+        private LinkPoint _linkPoint;
+        public LinkPoint LinkPoint
+        {
+            get
+            {
+                return _linkPoint;
+            }
+            set
+            {
+                SetProperty(ref _linkPoint, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/ViewModels/LogicalGateItemData.cs

@@ -0,0 +1,34 @@
+using Util.DiagramDesigner;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using AIStudio.Wpf.ADiagram.Models;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    /// <summary>
+    /// This is passed to the PopupWindow.xaml window, where a DataTemplate is used to provide the
+    /// ContentControl with the look for this data. This class is also used to allow
+    /// the popup to be cancelled without applying any changes to the calling ViewModel
+    /// whos data will be updated if the PopupWindow.xaml window is closed successfully
+    /// </summary>
+    public class LogicalGateItemData : TitleBindableBase
+    {
+        public LogicalGateItemData(IEnumerable<FullyCreatedConnectorInfo> inputvalues)
+        {
+            this.InputValues = new ObservableCollection<FullyCreatedConnectorInfo>(inputvalues);           
+        }
+
+        private ObservableCollection<FullyCreatedConnectorInfo> _inputValues;
+        public ObservableCollection<FullyCreatedConnectorInfo> InputValues
+        {
+            get
+            {
+                return _inputValues;
+            }
+            set
+            {
+                SetProperty(ref _inputValues, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/ViewModels/LogicalGateItemViewModel.cs

@@ -0,0 +1,745 @@
+using AIStudio.Wpf.ADiagram.Services;
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Collections.ObjectModel;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    public class LogicalGateItemViewModel : LogicalGateItemViewModelBase
+    {
+        protected IUIVisualizerService visualiserService;
+        public LogicalGateItemViewModel(LogicalType logicalType) : base(logicalType)
+        {
+            ColorViewModel.FillColor.Color = Colors.Orange;
+        }
+
+        public LogicalGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            visualiserService = ApplicationServicesProvider.Instance.Provider.VisualizerService;
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            LogicalGateDesignerItemBase designer = designerbase as LogicalGateDesignerItemBase;
+            this.Value = designer.Value;
+        }
+
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            if (LogicalType == LogicalType.Constant)
+            {
+                ValueDesignerItemData data = new ValueDesignerItemData(Value);
+                if (visualiserService.ShowDialog(data) == true)
+                {
+                    this.Value = data.Value;
+                }
+            }
+            else
+            {
+                LogicalGateItemData data = new LogicalGateItemData(Input.Values);
+                if (visualiserService.ShowDialog(data) == true)
+                {
+
+                }
+            }
+        }
+    }
+
+    public class AddGateItemViewModel : LogicalGateItemViewModel
+    {
+        public AddGateItemViewModel() : base(LogicalType.ADD)
+        {
+        }
+
+        public AddGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+        }
+    }
+
+    public class SubtractGateItemViewModel : LogicalGateItemViewModel
+    {
+        public SubtractGateItemViewModel() : base(LogicalType.SUB)
+        {
+        }
+
+        public SubtractGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+        }
+    }
+
+    public class MultiplyGateItemViewModel : LogicalGateItemViewModel
+    {
+        public MultiplyGateItemViewModel() : base(LogicalType.MUL)
+        {
+        }
+
+        public MultiplyGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+        }
+    }
+
+    public class DivideGateItemViewModel : LogicalGateItemViewModel
+    {
+
+        public DivideGateItemViewModel() : base(LogicalType.DIV)
+        {
+        }
+
+        public DivideGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+        }
+    }
+
+    public class AverageGateItemViewModel : LogicalGateItemViewModel
+    {
+        public AverageGateItemViewModel() : base(LogicalType.AVE)
+        {
+
+        }
+
+        public AverageGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class MODGateItemViewModel : LogicalGateItemViewModel
+    {
+        public MODGateItemViewModel() : base(LogicalType.MOD)
+        {
+
+        }
+
+        public MODGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ANDGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ANDGateItemViewModel() : base(LogicalType.AND)
+        {
+
+        }
+
+        public ANDGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ORGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ORGateItemViewModel() : base(LogicalType.OR)
+        {
+
+        }
+
+        public ORGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class XORGateItemViewModel : LogicalGateItemViewModel
+    {
+        public XORGateItemViewModel() : base(LogicalType.XOR)
+        {
+
+        }
+
+        public XORGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class NOTGateItemViewModel : LogicalGateItemViewModel
+    {
+        public NOTGateItemViewModel() : base(LogicalType.NOT)
+        {
+
+        }
+
+        public NOTGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class SHLGateItemViewModel : LogicalGateItemViewModel
+    {
+        public SHLGateItemViewModel() : base(LogicalType.SHL)
+        {
+
+        }
+
+        public SHLGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class SHRGateItemViewModel : LogicalGateItemViewModel
+    {
+        public SHRGateItemViewModel() : base(LogicalType.SHR)
+        {
+
+        }
+
+        public SHRGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ROLGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ROLGateItemViewModel() : base(LogicalType.ROL)
+        {
+
+        }
+
+        public ROLGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class RORGateItemViewModel : LogicalGateItemViewModel
+    {
+        public RORGateItemViewModel() : base(LogicalType.ROR)
+        {
+
+        }
+
+        public RORGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class SELGateItemViewModel : LogicalGateItemViewModel
+    {
+        public SELGateItemViewModel() : base(LogicalType.SEL)
+        {
+      
+        }
+
+        public SELGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class MAXGateItemViewModel : LogicalGateItemViewModel
+    {
+        public MAXGateItemViewModel() : base(LogicalType.MAX)
+        {
+
+        }
+
+        public MAXGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class MINGateItemViewModel : LogicalGateItemViewModel
+    {
+        public MINGateItemViewModel() : base(LogicalType.MIN)
+        {
+
+        }
+
+        public MINGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class LIMITGateItemViewModel : LogicalGateItemViewModel
+    {
+        public LIMITGateItemViewModel() : base(LogicalType.LIMIT)
+        {
+
+        }
+
+        public LIMITGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class GTGateItemViewModel : LogicalGateItemViewModel
+    {
+        public GTGateItemViewModel() : base(LogicalType.GT)
+        {
+
+        }
+
+        public GTGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class LTGateItemViewModel : LogicalGateItemViewModel
+    {
+        public LTGateItemViewModel() : base(LogicalType.GT)
+        {
+
+        }
+
+        public LTGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class GEGateItemViewModel : LogicalGateItemViewModel
+    {
+        public GEGateItemViewModel() : base(LogicalType.GE)
+        {
+
+        }
+
+        public GEGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class LEGateItemViewModel : LogicalGateItemViewModel
+    {
+        public LEGateItemViewModel() : base(LogicalType.LE)
+        {
+
+        }
+
+        public LEGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class EQGateItemViewModel : LogicalGateItemViewModel
+    {
+        public EQGateItemViewModel() : base(LogicalType.LE)
+        {
+
+        }
+
+        public EQGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class NEGateItemViewModel : LogicalGateItemViewModel
+    {
+        public NEGateItemViewModel() : base(LogicalType.NE)
+        {
+
+        }
+
+        public NEGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ABSGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ABSGateItemViewModel() : base(LogicalType.ABS)
+        {
+
+        }
+
+        public ABSGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class SQRTGateItemViewModel : LogicalGateItemViewModel
+    {
+        public SQRTGateItemViewModel() : base(LogicalType.SQRT)
+        {
+
+        }
+
+        public SQRTGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class LNGateItemViewModel : LogicalGateItemViewModel
+    {
+        public LNGateItemViewModel() : base(LogicalType.LN)
+        {
+
+        }
+
+        public LNGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class LOGGateItemViewModel : LogicalGateItemViewModel
+    {
+        public LOGGateItemViewModel() : base(LogicalType.LOG)
+        {
+
+        }
+
+        public LOGGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class EXPGateItemViewModel : LogicalGateItemViewModel
+    {
+        public EXPGateItemViewModel() : base(LogicalType.EXP)
+        {
+
+        }
+
+        public EXPGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class SINGateItemViewModel : LogicalGateItemViewModel
+    {
+        public SINGateItemViewModel() : base(LogicalType.SIN)
+        {
+
+        }
+
+        public SINGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class COSGateItemViewModel : LogicalGateItemViewModel
+    {
+        public COSGateItemViewModel() : base(LogicalType.COS)
+        {
+
+        }
+
+        public COSGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class TANGateItemViewModel : LogicalGateItemViewModel
+    {
+        public TANGateItemViewModel() : base(LogicalType.TAN)
+        {
+
+        }
+
+        public TANGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ASINGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ASINGateItemViewModel() : base(LogicalType.ASIN)
+        {
+
+        }
+
+        public ASINGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ACOSGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ACOSGateItemViewModel() : base(LogicalType.ACOS)
+        {
+
+        }
+
+        public ACOSGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ATANGateItemViewModel : LogicalGateItemViewModel
+    {
+        public ATANGateItemViewModel() : base(LogicalType.ATAN)
+        {
+
+        }
+
+        public ATANGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class EXPTGateItemViewModel : LogicalGateItemViewModel
+    {
+        public EXPTGateItemViewModel() : base(LogicalType.EXPT)
+        {
+
+        }
+
+        public EXPTGateItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+    }
+
+    public class ConstantDesignerItemViewModel : LogicalGateItemViewModel
+    {
+        public ConstantDesignerItemViewModel() : base(LogicalType.Constant)
+        {
+            ItemHeight = 28;
+        }
+
+        public ConstantDesignerItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+    }
+
+    public class InputItemViewModel : LogicalGateItemViewModel
+    {
+        public InputItemViewModel() : base(LogicalType.Input)
+        {
+            ItemHeight = 28;
+        }
+
+        public InputItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            LogicalGateDesignerItemBase designer = designerbase as LogicalGateDesignerItemBase;
+            this.Value = designer.Value;
+            LinkPoint = LogicalService.LinkPoint.FirstOrDefault(p => p.Id.ToString() == designer.Icon);  //不想新增字段了，就用这个Icon保存自定义测点的Id吧。
+            if (LinkPoint != null)
+            {
+                LinkPoint.Value = designer.Value;
+            }
+        }
+
+        private LinkPoint _linkPoint;
+        public LinkPoint LinkPoint
+        {
+            get { return _linkPoint; }
+            set
+            {
+                if (SetProperty(ref _linkPoint, value))
+                {
+                    Icon = _linkPoint?.Id.ToString();//不想新增字段了，就用这个Icon保存自定义测点的Id吧。
+                    Text = _linkPoint?.Name;
+                }
+            }
+        }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            LinkPointDesignerItemData data = new LinkPointDesignerItemData(LinkPoint);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                this.LinkPoint = data.LinkPoint;
+            }
+        }
+    }
+
+    public class OutputItemViewModel : LogicalGateItemViewModel
+    {
+        public OutputItemViewModel() : base(LogicalType.Output)
+        {
+            ItemHeight = 28;
+        }
+
+        public OutputItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            LogicalGateDesignerItemBase designer = designerbase as LogicalGateDesignerItemBase;
+            this.Value = designer.Value;
+            LinkPoint = LogicalService.LinkPoint.FirstOrDefault(p => p.Id.ToString() == designer.Icon);  //不想新增字段了，就用这个Icon保存自定义测点的Id吧。
+            if (LinkPoint != null)
+            {
+                LinkPoint.Value = designer.Value;
+            }
+        }
+
+        private LinkPoint _linkPoint;
+        public LinkPoint LinkPoint
+        {
+            get { return _linkPoint; }
+            set
+            {
+                if (SetProperty(ref _linkPoint, value))
+                {
+                    Icon = _linkPoint?.Id.ToString();//不想新增字段了，就用这个Icon保存自定义测点的Id吧。
+                    Text = _linkPoint?.Name;
+                }
+            }
+        }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            LinkPointDesignerItemData data = new LinkPointDesignerItemData(LinkPoint);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                this.LinkPoint = data.LinkPoint;
+            }
+        }
+    }
+
+    public class TimerDesignerItemViewModel : LogicalGateItemViewModel
+    {
+        private System.Timers.Timer readDataTimer = new System.Timers.Timer();
+        public Action Do;
+
+        public TimerDesignerItemViewModel() : base(LogicalType.Time)
+        {
+            ItemHeight = 32;
+            ItemWidth = 32;
+            Value = 1;
+            Start();
+            BuildMenuOptions();
+        }
+
+        public TimerDesignerItemViewModel(IDiagramViewModel parent, LogicalGateDesignerItemBase designer) : base(parent, designer)
+        {
+            BuildMenuOptions();
+        }
+
+        protected override void Init()
+        {
+            MenuItemCommand = new SimpleCommand(ExecuteMenuItemCommand);
+            base.Init();
+
+            readDataTimer.Elapsed += timeCycle;
+            readDataTimer.Interval = 1000;
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            if (IsEnabled)
+            {
+                Start();
+            }
+            else
+            {
+                Stop();
+            }
+        }
+
+        private void Start()
+        {
+            IsEnabled = true;
+            Output[0].ColorViewModel.FillColor.Color = Colors.Green;
+            readDataTimer.Start();
+        }
+
+        private void Stop()
+        {
+            IsEnabled = false;
+            Output[0].ColorViewModel.FillColor.Color = Colors.Red;
+            readDataTimer.Stop();
+        }
+
+        private void ExecuteMenuItemCommand(object obj)
+        {
+            if ((obj as CinchMenuItem).IsChecked == true)
+            {
+                Start();
+            }
+            else
+            {
+                Stop();
+            }
+        }
+
+        public SimpleCommand MenuItemCommand { get; private set; }
+        private void BuildMenuOptions()
+        {
+            menuOptions = new ObservableCollection<CinchMenuItem>();
+            CinchMenuItem menuItem = new CinchMenuItem();
+            menuItem.Text = "启动";
+            menuItem.IsCheckable = true;
+            menuItem.IsChecked = IsEnabled;
+            menuItem.Command = MenuItemCommand;
+            menuItem.CommandParameter = menuItem;
+            menuOptions.Add(menuItem);
+        }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            ValueDesignerItemData data = new ValueDesignerItemData(Value);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                this.Value = data.Value;
+                readDataTimer.Interval = this.Value * 1000;
+            }
+        }
+
+        private void timeCycle(object sender, EventArgs e)
+        {
+            Output.FirstOrDefault().Value.ConnectorValue += Value;
+            if (Do != null)
+            {
+                Do();
+            }
+        }
+
+        public override void Dispose()
+        {
+            base.Dispose();
+
+            readDataTimer.Dispose();
+        }
+
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Logical/ViewModels/LogicalGateItemViewModel.xaml

@@ -0,0 +1,101 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Logical" 
+                    xmlns:gif="http://wpfanimatedgif.codeplex.com" 
+                    xmlns:converter="clr-namespace:AIStudio.Wpf.ADiagram.Converters"
+                    xmlns:controls="clr-namespace:AIStudio.Wpf.ADiagram.Controls"
+                    xmlns:dd="https://astudio.github.io/diagram"
+                    xmlns:Fluent="urn:fluent-ribbon"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:i="http://schemas.microsoft.com/xaml/behaviors">
+
+    <converter:BoolVisibilityConverter x:Key="BoolVisibilityConverter"/>
+    <converter:DoubleToThickness x:Key="DoubleToThickness"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter"/>
+
+    <DataTemplate DataType="{x:Type model:LogicalGateItemViewModel}">
+        <Grid IsHitTestVisible="False">
+            <Rectangle StrokeThickness="1" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}" Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" />
+            <TextBlock Text="{Binding LogicalType}" Foreground="{Binding FontViewModel.FontColor,Converter={StaticResource ColorBrushConverter}}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
+            <TextBlock Text="{Binding OrderNumber,StringFormat={}{0}#}" Foreground="Blue" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="2"/>
+        </Grid>
+    </DataTemplate>
+
+    <DataTemplate DataType="{x:Type model:LogicalGateItemData}">
+        <Grid Background="{DynamicResource Fluent.Ribbon.Brushes.AccentBaseColorBrush}">
+            <ListBox ItemsSource="{Binding InputValues}" AlternationCount="{Binding InputValues.Count}" Background="{DynamicResource Fluent.Ribbon.Brushes.AccentBaseColorBrush}">
+                <ListBox.ItemTemplate>
+                    <DataTemplate>
+                        <StackPanel Orientation="Horizontal">
+                            <TextBlock Text="输入" VerticalAlignment="Center"/>
+                            <TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplatedParent.(ItemsControl.AlternationIndex)}" VerticalAlignment="Center" Margin="0,0,5,0"/>
+                            <TextBox Width="100" Text="{Binding ConnectorValue,Mode=TwoWay}"></TextBox>
+                        </StackPanel>
+                    </DataTemplate>
+                </ListBox.ItemTemplate>
+            </ListBox>
+        </Grid>
+    </DataTemplate>
+
+    <DataTemplate DataType="{x:Type model:ConstantDesignerItemViewModel}">
+        <Grid IsHitTestVisible="False">
+            <Rectangle StrokeThickness="1" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}" Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" />
+            <TextBlock Text="{Binding Value}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
+        </Grid>
+    </DataTemplate>
+
+    <DataTemplate DataType="{x:Type model:ValueDesignerItemData}">
+        <Grid Background="{DynamicResource Fluent.Ribbon.Brushes.AccentBaseColorBrush}">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+            <Label Grid.Column="0"
+                   Content="Value"
+                   Margin="5" />
+            <TextBox Grid.Column="1"
+                    Text="{Binding Value}" VerticalAlignment="Center"
+                    Margin="5" 
+                    FontSize="12"/>
+        </Grid>
+    </DataTemplate>
+
+    <DataTemplate DataType="{x:Type model:LinkPointDesignerItemData}">
+        <Grid Background="{DynamicResource Fluent.Ribbon.Brushes.AccentBaseColorBrush}">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+            <Label Grid.Column="0"
+                   Content="LinkPoint"
+                   Margin="5" />
+            <ComboBox Grid.Column="1"
+                    SelectedItem="{Binding LinkPoint}" ItemsSource="{x:Static model:LogicalService.LinkPoint}" VerticalAlignment="Center" DisplayMemberPath="Name"
+                    Margin="5" 
+                    FontSize="12"/>
+        </Grid>
+    </DataTemplate>
+
+
+    <DataTemplate DataType="{x:Type model:InputItemViewModel}">
+        <Grid IsHitTestVisible="False">
+            <Rectangle StrokeThickness="1" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}" Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" />
+            <TextBlock Text="{Binding Text,TargetNullValue='[Null]'}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
+        </Grid>
+    </DataTemplate>    
+   
+    <DataTemplate DataType="{x:Type model:OutputItemViewModel}">
+        <Grid IsHitTestVisible="False">
+            <Rectangle StrokeThickness="1" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}" Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" />
+            <TextBlock Text="{Binding Text,TargetNullValue='[Null]'}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
+        </Grid>
+    </DataTemplate>
+
+    <DataTemplate DataType="{x:Type model:TimerDesignerItemViewModel}">
+        <Grid IsHitTestVisible="False">
+            <Ellipse StrokeThickness="1" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}" Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" /> 
+            <TextBlock Text="{Binding Value,StringFormat={}{0}s}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5"/>
+        </Grid>
+    </DataTemplate>
+
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Logical/ViewModels/ValueDesignerItemData.cs

@@ -0,0 +1,32 @@
+using AIStudio.Wpf.ADiagram.Models;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Logical
+{
+    /// <summary>
+    /// This is passed to the PopupWindow.xaml window, where a DataTemplate is used to provide the
+    /// ContentControl with the look for this data. This class is also used to allow
+    /// the popup to be cancelled without applying any changes to the calling ViewModel
+    /// whos data will be updated if the PopupWindow.xaml window is closed successfully
+    /// </summary>
+    public class ValueDesignerItemData : TitleBindableBase
+    {
+        public ValueDesignerItemData(double value)
+        {
+            this.Value = value;           
+        }
+
+        private double _value;
+        public double Value
+        {
+            get
+            {
+                return _value;
+            }
+            set
+            {
+                SetProperty(ref _value, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/Models/PathDesignerItem.cs

@@ -0,0 +1,19 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class PathDesignerItem : DesignerItemBase
+    {
+        public PathDesignerItem()
+        {
+
+        }
+
+        public PathDesignerItem(DesignerItemViewModelBase item) : base(item) { }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/Models/PersistDesignerItem.cs

@@ -0,0 +1,25 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Xml.Serialization;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class PersistDesignerItem : DesignerItemBase
+    {       
+        public PersistDesignerItem()
+        {
+
+        }
+        public PersistDesignerItem(PersistDesignerItemViewModel item) : base(item)
+        {
+            this.HostUrl = item.HostUrl;
+        }
+
+        [XmlAttribute]
+        public string HostUrl { get; set; }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/Models/SettingsDesignerItem.cs

@@ -0,0 +1,23 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+     public class SettingsDesignerItem : DesignerItemBase
+    {
+        public SettingsDesignerItem()
+        {
+
+        }
+        public SettingsDesignerItem(SettingsDesignerItemViewModel item) : base(item)
+        {
+            this.Setting = item.Setting;
+        }
+
+        public string Setting { get; set; }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/BarcodeDesignerItemData.cs

@@ -0,0 +1,93 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Xml.Serialization;
+using AIStudio.Wpf.ADiagram.Commands;
+using System.Windows.Input;
+using AIStudio.Wpf.ADiagram.Models;
+using ZXing;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class BarcodeDesignerItemData : TitleBindableBase
+    {
+        public BarcodeDesignerItemData()
+        {
+
+        }
+        public BarcodeDesignerItemData(BarcodeDesignerItemViewModel item)
+        {
+            this.Title = "二维码";
+            this.Text = item.Text;
+            this.Icon = item.Icon;
+            this.Margin = item.Margin;
+            this.Format = item.Format;
+        }
+
+        public BarcodeFormat Format { get; set; }
+
+        private string _text;
+        public string Text
+        {
+            get
+            {
+                return _text;
+            }
+            set
+            {
+                SetProperty(ref _text, value);
+            }
+        }
+
+        private double _margin;
+
+        public double Margin
+        {
+            get
+            {
+                return _margin;
+            }
+            set
+            {
+                SetProperty(ref _margin, value);
+            }
+        }
+
+        private string _icon;
+        public string Icon
+        {
+            get
+            {
+                return _icon;
+            }
+            set
+            {
+                SetProperty(ref _icon, value);
+            }
+        }
+
+        
+        private ICommand _iploadCommand;
+        public ICommand UploadCommand
+        {
+            get
+            {
+                return this._iploadCommand ?? (this._iploadCommand = new DelegateCommand(() => this.Upload()));
+            }
+        }
+
+        private void Upload()
+        {
+            Microsoft.Win32.OpenFileDialog openFile = new Microsoft.Win32.OpenFileDialog();
+            openFile.Filter = "图片|*.bmp;*.jpg;*.jpeg;*.gif;*.png";
+
+            if (openFile.ShowDialog() == true)
+            {
+                Icon = openFile.FileName;
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/BarcodeDesignerItemViewModel.cs

@@ -0,0 +1,87 @@
+using AIStudio.Wpf.ADiagram.Services;
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Windows;
+using System.Globalization;
+using ZXing;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class BarcodeDesignerItemViewModel : DesignerItemViewModelBase
+    {
+        private IUIVisualizerService visualiserService;
+
+        public BarcodeDesignerItemViewModel() : base()
+        {
+
+        }
+
+        public BarcodeDesignerItemViewModel(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+            visualiserService = ApplicationServicesProvider.Instance.Provider.VisualizerService;
+
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            Format = (BarcodeFormat)Enum.Parse(typeof(BarcodeFormat), (designerbase as DesignerItemBase).Reserve.ToString());
+            ShowText = false;
+        }
+
+        public void AutoSize()
+        {
+            ItemWidth = 140;
+            ItemHeight = 140;
+        }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            EditData();
+        }
+
+        public override bool InitData()
+        {
+            if (string.IsNullOrEmpty(Icon))
+                return EditData();
+            return true;
+        }
+
+        public BarcodeFormat Format { get; set; } = BarcodeFormat.QR_CODE;
+
+        public override bool EditData()
+        {
+            if (IsReadOnly == true) return false;
+
+            BarcodeDesignerItemData data = new BarcodeDesignerItemData(this);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                bool needauto = Text == null;
+                Text = data.Text;
+                ShowText = false;
+                Icon = data.Icon;
+                Margin = data.Margin;
+                if (needauto)
+                {
+                    AutoSize();
+                }
+                return true;
+            }
+
+            return false;
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/BarcodeDesignerItemViewModel.xaml

@@ -0,0 +1,50 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Others" 
+                    xmlns:gif="http://wpfanimatedgif.codeplex.com" 
+                    xmlns:converter="clr-namespace:AIStudio.Wpf.ADiagram.Converters"
+                    xmlns:controls="clr-namespace:AIStudio.Wpf.ADiagram.Controls"
+                    xmlns:dd="https://astudio.github.io/diagram"
+                    xmlns:Fluent="urn:fluent-ribbon"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:i="http://schemas.microsoft.com/xaml/behaviors">
+
+    <converter:BoolVisibilityConverter x:Key="BoolVisibilityConverter"/>
+    <converter:DoubleToThickness x:Key="DoubleToThickness"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter"/>
+
+
+    <DataTemplate DataType="{x:Type model:BarcodeDesignerItemViewModel}">
+        <Viewbox Stretch="Fill" IsHitTestVisible="False">
+            <controls:Barcode Width="{Binding ItemWidth}" Height="{Binding ItemHeight}" Padding="{Binding Margin,Converter={StaticResource DoubleToThickness}}" Text="{Binding Text}" Icon="{Binding Icon}" Format="{Binding Format}"/>
+        </Viewbox>
+    </DataTemplate>
+
+    <!-- DataTemplate for Popup look and feel -->
+    <DataTemplate DataType="{x:Type model:BarcodeDesignerItemData}">
+        <Grid Width="550">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="*" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="20" />
+            </Grid.RowDefinitions>
+            <Label Grid.Row="0"
+                   Content="网页链接"
+                   Margin="5" />
+            <DockPanel Grid.Row="1" >
+                <Border BorderThickness="1" BorderBrush="Black" Margin="5" DockPanel.Dock="Right">
+                    <controls:Barcode Text="{Binding Text}" Icon="{Binding Icon}" Format="{Binding Format}" Width="140" Height="140" Padding="{Binding Margin,Converter={StaticResource DoubleToThickness}}" />
+                </Border>
+                <TextBox  Text="{Binding Text,UpdateSourceTrigger=PropertyChanged}" TextWrapping="Wrap" DockPanel.Dock="Left" Margin="5"/>
+            </DockPanel>
+            <StackPanel Grid.Row="2" Orientation="Horizontal">
+                <TextBlock Text="边界：" Margin="5" HorizontalAlignment="Center"/>
+                <Fluent:Spinner Margin="5" DockPanel.Dock="Right" Width="60" Size="Small" Value="{Binding Margin}" Maximum="25" Minimum="0" Format="0 px" />
+            </StackPanel>
+            <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right">
+                <Button Margin="5,5,50,5" Content="上传Logo" Command="{Binding UploadCommand}" />
+            </StackPanel>
+        </Grid>
+    </DataTemplate>
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/OutLineTextDesignerItemData.cs

@@ -0,0 +1,54 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Xml.Serialization;
+using AIStudio.Wpf.ADiagram.Models;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class OutLineTextDesignerItemData : TitleBindableBase
+    {
+        public OutLineTextDesignerItemData()
+        {
+
+        }
+        public OutLineTextDesignerItemData(OutLineTextDesignerItemViewModel item)
+        {
+            this.Title = "矢量文本";
+            this.Text = item.Text;
+            this.FontViewModel = CopyHelper.Mapper<FontViewModel, IFontViewModel>(item.FontViewModel);
+        }
+
+        private IFontViewModel _fontViewModel;
+        public IFontViewModel FontViewModel
+        {
+            get
+            {
+                return _fontViewModel;
+            }
+            set
+            {
+                SetProperty(ref _fontViewModel, value);
+            }
+        }
+
+        private string _text;
+        public string Text
+        {
+            get
+            {
+                return _text;
+            }
+            set
+            {
+                SetProperty(ref _text, value);
+            }
+        }
+
+        
+
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/OutLineTextDesignerItemViewModel.cs

@@ -0,0 +1,87 @@
+using AIStudio.Wpf.ADiagram.Services;
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Windows;
+using System.Globalization;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class OutLineTextDesignerItemViewModel : TextDesignerItemViewModel
+    {
+        private IUIVisualizerService visualiserService;
+
+        public OutLineTextDesignerItemViewModel(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+
+        }
+
+        public OutLineTextDesignerItemViewModel() : base()
+        {
+
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            visualiserService = ApplicationServicesProvider.Instance.Provider.VisualizerService;
+
+            FontViewModel.FontFamily = "Arial";
+            FontViewModel.FontSize = 36;
+        }
+
+        public void AutoSize()
+        {
+            var size = MeasureString();
+            ItemWidth = size.Width;
+            ItemHeight = size.Height;
+        }
+
+        private Size MeasureString()
+        {
+            var formattedText = new FormattedText(
+                Text,
+                CultureInfo.CurrentUICulture,
+                FlowDirection.LeftToRight,
+                new Typeface(new FontFamily(FontViewModel.FontFamily), FontViewModel.FontStyle, FontViewModel.FontWeight, FontViewModel.FontStretch),
+                FontViewModel.FontSize,
+                Brushes.Black);
+
+            return new Size(formattedText.Width, formattedText.Height);
+        }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            EditData();
+        }
+
+        public override bool InitData()
+        {
+            if (string.IsNullOrEmpty(Text))
+                return EditData();
+            return true;
+        }
+
+        public override bool EditData()
+        {
+            if (IsReadOnly == true) return false;
+
+            OutLineTextDesignerItemData data = new OutLineTextDesignerItemData(this);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                Text = data.Text;
+                FontViewModel = CopyHelper.Mapper<FontViewModel, IFontViewModel>(data.FontViewModel);
+                AutoSize();
+                return true;
+            }
+
+            return false;
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/OutLineTextDesignerItemViewModel.xaml

@@ -0,0 +1,113 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Others" 
+                    xmlns:gif="http://wpfanimatedgif.codeplex.com" 
+                    xmlns:converter="clr-namespace:AIStudio.Wpf.ADiagram.Converters"
+                    xmlns:controls="clr-namespace:AIStudio.Wpf.ADiagram.Controls"
+                    xmlns:dd="https://astudio.github.io/diagram"
+                    xmlns:Fluent="urn:fluent-ribbon"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:i="http://schemas.microsoft.com/xaml/behaviors">
+
+    <converter:BoolVisibilityConverter x:Key="BoolVisibilityConverter"/>
+    <converter:DoubleToThickness x:Key="DoubleToThickness"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter"/>
+   
+    <DataTemplate DataType="{x:Type model:OutLineTextDesignerItemViewModel}">
+        <Viewbox Stretch="Fill" IsHitTestVisible="False">
+            <controls:OutlineText StrokePosition="Outside"
+                         Text="{Binding Text}"
+                         FontSize="{Binding FontViewModel.FontSize}" 
+                         FontFamily="{Binding FontViewModel.FontFamily}"  
+                         FontWeight="{Binding FontViewModel.FontWeight}"
+                         FontStyle="{Binding FontViewModel.FontStyle}"                         
+                         FontStretch="{Binding FontViewModel.FontStretch}"
+                         TextDecorations="{Binding FontViewModel.TextDecorations}"
+                         Stroke="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}" 
+                         StrokeThickness="{Binding ColorViewModel.LineWidth}"
+                         Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}"/>
+        </Viewbox>
+    </DataTemplate>
+
+    <!-- DataTemplate for Popup look and feel -->
+    <DataTemplate DataType="{x:Type model:OutLineTextDesignerItemData}">
+        <Grid>
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="*" />
+                <RowDefinition Height="Auto" />
+            </Grid.RowDefinitions>
+            <Label Grid.Row="0"
+                   Content="添加文本"
+                   Margin="5" />
+            <TextBox Grid.Row="1"
+                    Text="{Binding Text}"
+                    FontSize="{Binding ElementName=comboBoxFontSize,Path=SelectedItem}" 
+                    FontFamily="{Binding ElementName=comboBoxFontName,Path=SelectedItem}"  
+                    FontWeight="{Binding ElementName=buttonBold,Path=IsChecked,Converter={converter:ConverterBoolToValueMap Parameter='Regular'}, ConverterParameter='Bold'}"
+                    FontStyle="{Binding ElementName=buttonItalic,Path=IsChecked,Converter={converter:ConverterBoolToValueMap Parameter='Normal'}, ConverterParameter='Italic'}"  
+                    TextDecorations="{Binding ElementName=buttonUnderline,Path=IsChecked,Converter={converter:ConverterBoolToValueMap Parameter='None'}, ConverterParameter='Underline'}"
+                     Height="100"
+                    Margin="5" 
+                    TextWrapping="Wrap"/>
+
+            <StackPanel Grid.Row="2" Orientation="Horizontal">
+                <Fluent:ComboBox x:Name="comboBoxFontName"
+                                         Margin="5"
+                                         MinWidth="49"
+                                         Height="22"
+                                         BorderBrush="Gainsboro"
+                                         IsTextSearchEnabled="True"
+                                         ResizeMode="Vertical"
+                                         KeyTip="FF"
+                                         SizeDefinition="Small"
+                                         ScrollViewer.CanContentScroll="False"
+                                         ItemsSource="{x:Static dd:FontViewModel.FontFamilys}"
+                                         SelectedItem="{Binding FontViewModel.FontFamily}">
+                    <Fluent:ComboBox.ItemTemplate>
+                        <DataTemplate>
+                            <TextBlock Text="{Binding}"
+                                           FontFamily="{Binding}" />
+                        </DataTemplate>
+                    </Fluent:ComboBox.ItemTemplate>
+                </Fluent:ComboBox>
+                <Fluent:ComboBox x:Name="comboBoxFontSize"
+                                         Margin="5"
+                                         Width="49"
+                                         HorizontalAlignment="Left"
+                                         Height="22"
+                                         BorderBrush="Gainsboro"
+                                         IsEditable="True"
+                                         SizeDefinition="Small"
+                                         ResizeMode="Vertical"
+                                         KeyTip="FS"
+                                         ItemsSource="{x:Static dd:FontViewModel.FontSizes}"
+                                         SelectedItem="{Binding FontViewModel.FontSize}">
+                    <Fluent:ComboBox.ItemTemplate>
+                        <DataTemplate>
+                            <TextBlock Text="{Binding}"/>
+                        </DataTemplate>
+                    </Fluent:ComboBox.ItemTemplate>
+                </Fluent:ComboBox>
+                <Fluent:ToggleButton KeyTip="B"
+                                             x:Name="buttonBold"
+                                             Icon="pack://application:,,,/AIStudio.Wpf.ADiagram;component/Images/Bold.png"
+                                             HorizontalAlignment="Left"
+                                             SizeDefinition="Small" 
+                                             IsChecked="{Binding FontViewModel.FontWeight,Converter={converter:ConverterValueMapToBool Parameter='Regular'}, ConverterParameter='Bold'}"/>
+                <Fluent:ToggleButton x:Name="buttonItalic"
+                                             KeyTip="I"
+                                             Icon="pack://application:,,,/AIStudio.Wpf.ADiagram;component/Images/Italic.png"
+                                             HorizontalAlignment="Left"
+                                             SizeDefinition="Small" 
+                                             IsChecked="{Binding FontViewModel.FontStyle,Converter={converter:ConverterValueMapToBool Parameter='Normal'}, ConverterParameter='Italic'}"/>
+                <Fluent:ToggleButton x:Name="buttonUnderline"
+                                             KeyTip="U"
+                                             Icon="pack://application:,,,/AIStudio.Wpf.ADiagram;component/Images/Underline.png"
+                                             HorizontalAlignment="Left"
+                                             SizeDefinition="Small" 
+                                             IsChecked="{Binding FontViewModel.Underline}"/>
+            </StackPanel>
+        </Grid>
+    </DataTemplate>
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/PathItemViewModel.cs

@@ -0,0 +1,30 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Media;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class PathItemViewModel : DesignerItemViewModelBase
+    {
+        public PathItemViewModel() : base()
+        {
+
+        }
+
+        public PathItemViewModel(IDiagramViewModel parent, DesignerItemBase designer) : base(parent, designer)
+        {
+           
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            this.ShowConnectors = false;
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/PathItemViewModel.xaml

@@ -0,0 +1,34 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Others"
+                    xmlns:convent="clr-namespace:AIStudio.Wpf.ADiagram.Converters">
+    <convent:StringPathConverter x:Key="stringPathConverter"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter" />
+    <Brush x:Key="ItemStroke">#FFD69436</Brush>
+    <LinearGradientBrush x:Key="ItemBrush" StartPoint="0,0" EndPoint="0,1">
+        <LinearGradientBrush.GradientStops>
+            <GradientStop Color="#FAFBE9" Offset="0" />
+            <GradientStop Color="Orange" Offset="1" />
+        </LinearGradientBrush.GradientStops>
+    </LinearGradientBrush>
+    <Style x:Key="PathItemStyle" TargetType="Path">
+        <!--<Setter Property="Fill" Value="{StaticResource ItemBrush}"/>
+        <Setter Property="Stroke" Value="{StaticResource ItemStroke}"/>-->
+        <Setter Property="Fill" Value="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}"/>
+        <Setter Property="Stroke" Value="{Binding ColorViewModel.LineColor,Converter={StaticResource ColorBrushConverter}}"/>
+        <Setter Property="StrokeThickness" Value="1"/>
+        <Setter Property="StrokeLineJoin" Value="Round"/>
+        <Setter Property="Stretch" Value="Fill"/>
+        <Setter Property="IsHitTestVisible" Value="True"/>
+        <Setter Property="SnapsToDevicePixels" Value="True"/>
+        <Setter Property="Data" Value="{Binding Icon,Converter={StaticResource stringPathConverter}}"/>
+    </Style>   
+
+    <DataTemplate DataType="{x:Type model:PathItemViewModel}">
+        <Grid>
+            <Path Tag="Process" IsHitTestVisible="False" Style="{StaticResource PathItemStyle}"/>
+        </Grid>
+    </DataTemplate>
+    
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/PersistDesignerItemData.cs

@@ -0,0 +1,39 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using AIStudio.Wpf.ADiagram.Models;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    /// <summary>
+    /// This is passed to the PopupWindow.xaml window, where a DataTemplate is used to provide the
+    /// ContentControl with the look for this data. This class is also used to allow
+    /// the popup to be cancelled without applying any changes to the calling ViewModel
+    /// whos data will be updated if the PopupWindow.xaml window is closed successfully
+    /// </summary>
+    public class PersistDesignerItemData : TitleBindableBase
+    {
+     
+
+        public PersistDesignerItemData(string currentHostUrl)
+        {
+            HostUrl = currentHostUrl;
+        }
+
+        private string _hostUrl = "";
+        public string HostUrl
+        {
+            get
+            {
+                return _hostUrl;
+            }
+            set
+            {
+                SetProperty(ref _hostUrl, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/PersistDesignerItemViewModel.cs

@@ -0,0 +1,58 @@
+using AIStudio.Wpf.ADiagram.Services;
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Input;
+using System.Windows.Media;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class PersistDesignerItemViewModel : DesignerItemViewModelBase
+    {
+        private IUIVisualizerService visualiserService;
+
+        public PersistDesignerItemViewModel(IDiagramViewModel parent, PersistDesignerItem designer) : base(parent, designer)
+        {
+
+        }
+
+        public PersistDesignerItemViewModel() : base()
+        {
+
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            visualiserService = ApplicationServicesProvider.Instance.Provider.VisualizerService;
+            this.ShowConnectors = false;
+        }
+
+        protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            PersistDesignerItem designer = designerbase as PersistDesignerItem;
+            this.HostUrl = designer.HostUrl;
+        }
+
+
+        public string HostUrl { get; set; }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            PersistDesignerItemData data = new PersistDesignerItemData(HostUrl);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                this.HostUrl = data.HostUrl;
+            }
+        }
+
+
+
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/PersistDesignerItemViewModel.xaml

@@ -0,0 +1,80 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Others" 
+                    xmlns:gif="http://wpfanimatedgif.codeplex.com" 
+                    xmlns:converter="clr-namespace:AIStudio.Wpf.ADiagram.Converters"
+                    xmlns:controls="clr-namespace:AIStudio.Wpf.ADiagram.Controls"
+                    xmlns:dd="https://astudio.github.io/diagram"
+                    xmlns:Fluent="urn:fluent-ribbon"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:i="http://schemas.microsoft.com/xaml/behaviors">
+
+    <converter:BoolVisibilityConverter x:Key="BoolVisibilityConverter"/>
+    <converter:DoubleToThickness x:Key="DoubleToThickness"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter"/>
+
+    <ControlTemplate x:Key="infoButtonTemplate" TargetType="Button">
+        <Grid x:Name="grid" Opacity="0.1">
+            <Ellipse Width="16"
+                     Height="16"
+                     Stroke="Black"
+                     StrokeThickness="2"
+                     HorizontalAlignment="Center"
+                     VerticalAlignment="Center"
+                     Fill="White"/>
+            <Label Content="i"
+                   FontWeight="Bold"
+                   FontStyle="Italic"
+                   HorizontalAlignment="Center"
+                   HorizontalContentAlignment="Center"
+                   VerticalAlignment="Center"
+                   VerticalContentAlignment="Center"
+                   FontSize="12" />
+        </Grid>
+
+        <ControlTemplate.Triggers>
+            <Trigger Property="IsMouseOver"
+                     Value="True">
+                <Setter TargetName="grid"
+                        Property="Opacity"
+                        Value="1.0" />
+            </Trigger>
+        </ControlTemplate.Triggers>
+
+    </ControlTemplate>  
+
+    <!-- DataTemplate for DesignerCanvas look and feel -->
+    <DataTemplate DataType="{x:Type model:PersistDesignerItemViewModel}">
+        <Grid>
+            <Image IsHitTestVisible="False"
+                    Stretch="Fill"
+                    Source="/AIStudio.Wpf.ADiagram;component/Images/Persist.png"
+                    Tag="setting" />
+            <Button x:Name="btnSetting" HorizontalAlignment="Right"
+                    VerticalAlignment="Bottom"
+                    Margin="5"
+                    Template="{StaticResource infoButtonTemplate}" 
+                    Command="{Binding EditCommand}" />
+        </Grid>
+    </DataTemplate>
+
+    <!-- DataTemplate for Popup look and feel -->
+    <DataTemplate DataType="{x:Type model:PersistDesignerItemData}">
+        <Grid Background="{DynamicResource Fluent.Ribbon.Brushes.AccentBaseColorBrush}">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+            </Grid.RowDefinitions>
+
+            <Label Grid.Row="0"
+                   Content="HostUrl"
+                   Margin="5" />
+            <TextBox Grid.Row="1"
+                    HorizontalAlignment="Left"
+                    Text="{Binding HostUrl}"
+                    Width="150"
+                    Margin="5" />
+        </Grid>
+    </DataTemplate> 
+
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/SettingsDesignerItemData.cs

@@ -0,0 +1,39 @@
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using AIStudio.Wpf.ADiagram.Models;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    /// <summary>
+    /// This is passed to the PopupWindow.xaml window, where a DataTemplate is used to provide the
+    /// ContentControl with the look for this data. This class is also used to allow
+    /// the popup to be cancelled without applying any changes to the calling ViewModel
+    /// whos data will be updated if the PopupWindow.xaml window is closed successfully
+    /// </summary>
+    public class SettingsDesignerItemData : TitleBindableBase
+    {
+       
+
+        public SettingsDesignerItemData(string currentSetting1)
+        {
+            Setting1 = currentSetting1;
+        }
+
+        private string _setting1 = "";
+        public string Setting1
+        {
+            get
+            {
+                return _setting1;
+            }
+            set
+            {
+                SetProperty(ref _setting1, value);
+            }
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/SettingsDesignerItemViewModel.cs

@@ -0,0 +1,56 @@
+using AIStudio.Wpf.ADiagram.Services;
+using Util.DiagramDesigner;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows.Input;
+using System.Windows.Media;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class SettingsDesignerItemViewModel : DesignerItemViewModelBase
+    {
+        private IUIVisualizerService visualiserService;
+
+        public SettingsDesignerItemViewModel(IDiagramViewModel parent, SettingsDesignerItem designer) : base(parent, designer)
+        {
+           
+        }
+
+        public SettingsDesignerItemViewModel() : base()
+        {
+
+        }
+
+        protected override void Init()
+        {
+            base.Init();
+
+            visualiserService = ApplicationServicesProvider.Instance.Provider.VisualizerService;
+            this.ShowConnectors = false;
+        }
+
+       protected override void LoadDesignerItemViewModel(IDiagramViewModel parent, SelectableDesignerItemBase designerbase)
+        {
+            base.LoadDesignerItemViewModel(parent, designerbase);
+
+            SettingsDesignerItem designer = designerbase as SettingsDesignerItem;
+            this.Setting = designer.Setting;
+        }
+
+        public String Setting{ get; set; }
+
+        protected override void ExecuteEditCommand(object parameter)
+        {
+            SettingsDesignerItemData data = new SettingsDesignerItemData(Setting);
+            if (visualiserService.ShowDialog(data) == true)
+            {
+                this.Setting = data.Setting1;
+            }
+        }
+
+
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/SettingsDesignerItemViewModel.xaml

@@ -0,0 +1,80 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Others" 
+                    xmlns:gif="http://wpfanimatedgif.codeplex.com" 
+                    xmlns:converter="clr-namespace:AIStudio.Wpf.ADiagram.Converters"
+                    xmlns:controls="clr-namespace:AIStudio.Wpf.ADiagram.Controls"
+                    xmlns:dd="https://astudio.github.io/diagram"
+                    xmlns:Fluent="urn:fluent-ribbon"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:i="http://schemas.microsoft.com/xaml/behaviors">
+
+    <converter:BoolVisibilityConverter x:Key="BoolVisibilityConverter"/>
+    <converter:DoubleToThickness x:Key="DoubleToThickness"/>
+    <s:ColorBrushConverter x:Key="ColorBrushConverter"/>
+
+    <ControlTemplate x:Key="infoButtonTemplate" TargetType="Button">
+        <Grid x:Name="grid" Opacity="0.1">
+            <Ellipse Width="16"
+                     Height="16"
+                     Stroke="Black"
+                     StrokeThickness="2"
+                     HorizontalAlignment="Center"
+                     VerticalAlignment="Center"
+                     Fill="White"/>
+            <Label Content="i"
+                   FontWeight="Bold"
+                   FontStyle="Italic"
+                   HorizontalAlignment="Center"
+                   HorizontalContentAlignment="Center"
+                   VerticalAlignment="Center"
+                   VerticalContentAlignment="Center"
+                   FontSize="12" />
+        </Grid>
+
+        <ControlTemplate.Triggers>
+            <Trigger Property="IsMouseOver"
+                     Value="True">
+                <Setter TargetName="grid"
+                        Property="Opacity"
+                        Value="1.0" />
+            </Trigger>
+        </ControlTemplate.Triggers>
+
+    </ControlTemplate>
+
+    <!-- DataTemplate for DesignerCanvas look and feel -->
+    <DataTemplate DataType="{x:Type model:SettingsDesignerItemViewModel}">
+        <Grid>
+            <Image IsHitTestVisible="False"
+                    Stretch="Fill"
+                    Source="/AIStudio.Wpf.ADiagram;component/Images/Setting.png"
+                    Tag="setting" />
+            <Button HorizontalAlignment="Right"
+                    VerticalAlignment="Bottom"
+                    Margin="5"
+                    Template="{StaticResource infoButtonTemplate}"
+                    Command="{Binding EditCommand}" />
+        </Grid>
+    </DataTemplate>
+
+    <!-- DataTemplate for Popup look and feel -->
+    <DataTemplate DataType="{x:Type model:SettingsDesignerItemData}">
+        <Grid>
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+            </Grid.RowDefinitions>
+
+            <Label Grid.Row="0"
+                    Content="Setting1"
+                    Margin="5" />
+            <TextBox Grid.Row="1"
+                        HorizontalAlignment="Left"
+                        Text="{Binding Setting}"
+                        Width="150"
+                        Margin="5" />
+        </Grid>
+    </DataTemplate>
+  
+</ResourceDictionary>

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/SvgDesignerItemViewModel.cs

@@ -0,0 +1,23 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Util.DiagramDesigner;
+
+namespace AIStudio.Wpf.ADiagram.Demos.Others
+{
+    public class SvgDesignerItemViewModel: MediaItemViewModel
+    {
+        protected override string Filter { get; set; } = "Svg|*.svg";
+
+        public SvgDesignerItemViewModel() : base()
+        {
+        }
+
+        public SvgDesignerItemViewModel(IDiagramViewModel parent, MediaDesignerItem designer) : base(parent, designer)
+        {
+
+        }
+    }
+}

AIStudio.Wpf.ADiagram/Demos/Others/ViewModels/SvgDesignerItemViewModel.xaml

@@ -0,0 +1,13 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:s="clr-namespace:Util.DiagramDesigner;assembly=Util.DiagramDesigner"
+                    xmlns:model="clr-namespace:AIStudio.Wpf.ADiagram.Demos.Others" 
+                    xmlns:svg="clr-namespace:Svg2XamlTestExtension;assembly=Svg2XamlTestExtension">
+    <s:ColorBrushConverter x:Key="ColorBrushConverter" />
+    
+    <DataTemplate DataType="{x:Type model:SvgDesignerItemViewModel}">
+        <Grid IsHitTestVisible="False">
+            <svg:PackSvg Width="Auto" Height="Auto" Path="{Binding Icon}" Fill="{Binding ColorViewModel.FillColor,Converter={StaticResource ColorBrushConverter}}"/>
+        </Grid>
+    </DataTemplate>
+</ResourceDictionary>