首页 > 其他分享 >用Wpf做一个思维导图(续3-Diagram画板)

用Wpf做一个思维导图(续3-Diagram画板)

时间:2023-04-05 09:00:11浏览次数:55  
标签:DesiredPosition mindNode 导图 child Height Diagram DesiredSize Offset Wpf

先上一张简易效果图,本次更新主要仿照百度脑图。

同样老规矩,先上源码地址:https://gitee.com/akwkevin/aistudio.-wpf.-diagram

本次扩展主要内容:

1.思维导图、目录组织图、鱼骨头图、逻辑结构图、组织结构图,入口在文件新建下。

2.思维导图工具栏(只有思维导图模式下可见)

2.1插入链接

2.2插入图片

2.3插入备注

2.4插入优先级

2.5插入进度

2.6切换类型

2.7切换主题

2.8还要展开节点,全选,居中,适应窗体大小等功能,不在介绍。

3 添加搜索功能(不仅仅思维导图可以使用)

4接下来介绍下核心源代码(布局设置)

思维导图、目录组织图、鱼骨头图、逻辑结构图、组织结构图的布局都继承了以下接口:

  public interface IMindLayout
    {
        /// <summary>
        ///  默认节点样式设置
        /// </summary>
        /// <param name="mindNode"></param>
        void Appearance(MindNode mindNode);

        /// <summary>
        ///  节点样式设置
        /// </summary>
        /// <param name="mindNode"></param>
        /// <param name="mindTheme"></param>
        /// <param name="initAppearance"></param>
        void Appearance(MindNode mindNode, MindTheme mindTheme, bool initAppearance);

        /// <summary>
        /// 连线类型设置
        /// </summary>
        /// <param name="source"></param>
        /// <param name="sink"></param>
        /// <param name="connector"></param>
        /// <returns></returns>
        ConnectionViewModel GetOrSetConnectionViewModel(MindNode source, MindNode sink, ConnectionViewModel connector = null);

        /// <summary>
        /// 更新布局
        /// </summary>
        /// <param name="mindNode"></param>
        void UpdatedLayout(MindNode mindNode);        
    }

其中:UpdatedLayout包括布局丈量MeasureOverride和摆放元素ArrangeOverride,是不是感觉和重新Panel差不多,先计算每个节点占的大小,然后开始布局。下面为思维导图的源代码,其它导图的,如有兴趣请下载源代码查看。

     public SizeBase MeasureOverride(MindNode mindNode, bool isExpanded = true)
        {
            var sizewithSpacing = mindNode.SizeWithSpacing;
            if (mindNode.Children?.Count > 0)
            {
                if (mindNode.NodeLevel == 0)
                {
                    var rights = mindNode.Children.Where((p, index) => index % 2 == 0).ToList();
                    rights.ForEach(p => p.ConnectorOrientation = ConnectorOrientation.Left);
                    var rightsizes = rights.Select(p => MeasureOverride(p, mindNode.IsExpanded && isExpanded)).ToArray();
                    var lefts = mindNode.Children.Where((p, index) => index % 2 == 1).ToList();
                    lefts.ForEach(p => p.ConnectorOrientation = ConnectorOrientation.Right);
                    var leftsizes = lefts.Select(p => MeasureOverride(p, mindNode.IsExpanded && isExpanded)).ToArray();
                    sizewithSpacing = new SizeBase(sizewithSpacing.Width + rightsizes.MaxOrDefault(p => p.Width) + +leftsizes.MaxOrDefault(p => p.Width), Math.Max(sizewithSpacing.Height, Math.Max(rightsizes.SumOrDefault(p => p.Height), leftsizes.SumOrDefault(p => p.Height))));
                }
                else
                {
                    var childrensizes = mindNode.Children.Select(p => MeasureOverride(p, mindNode.IsExpanded && isExpanded)).ToArray();
                    sizewithSpacing = new SizeBase(sizewithSpacing.Width + childrensizes.MaxOrDefault(p => p.Width), Math.Max(sizewithSpacing.Height, childrensizes.SumOrDefault(p => p.Height)));
                }
            }
            mindNode.DesiredSize = isExpanded ? sizewithSpacing : new SizeBase(0, 0);
            mindNode.Visible = isExpanded;

            return mindNode.DesiredSize;
        }

        public void ArrangeOverride(MindNode mindNode)
        {
            if (mindNode.NodeLevel == 0)
            {
                mindNode.DesiredPosition = mindNode.Position;

                if (mindNode.Children?.Count > 0)
                {
                    var rights = mindNode.Children.Where(p => p.ConnectorOrientation == ConnectorOrientation.Left).ToList();
                    double left = mindNode.DesiredPosition.X + mindNode.ItemWidth  + mindNode.Spacing.Width;
                    double lefttop = mindNode.DesiredPosition.Y + mindNode.ItemHeight / 2 - Math.Min(mindNode.DesiredSize.Height, rights.SumOrDefault(p => p.DesiredSize.Height)) / 2;
                    foreach (var child in rights)
                    {
                        child.Offset = new PointBase(child.Offset.X - child.RootNode.Offset.X, child.Offset.Y - child.RootNode.Offset.Y);
                        
                        child.DesiredPosition = new PointBase(left + child.Spacing.Width, lefttop + child.DesiredSize.Height / 2 - child.ItemHeight / 2);
                        child.Left = child.DesiredPosition.X + child.Offset.X;
                        child.Top = child.DesiredPosition.Y + child.Offset.Y;
                        lefttop += child.DesiredSize.Height;

                        ArrangeOverride(child);

                        var connector = mindNode.Root?.Items.OfType<ConnectionViewModel>().FirstOrDefault(p => p.SourceConnectorInfo?.DataItem == mindNode && p.SinkConnectorInfoFully?.DataItem == child);
                        connector?.SetSourcePort(mindNode.FirstConnector);
                        connector?.SetSinkPort(child.LeftConnector);
                        connector?.SetVisible(child.Visible);
                    }

                    var lefts = mindNode.Children.Where(p => p.ConnectorOrientation == ConnectorOrientation.Right).ToList();
                    double right = mindNode.DesiredPosition.X - mindNode.Spacing.Width;
                    double righttop = mindNode.DesiredPosition.Y + mindNode.ItemHeight / 2 - Math.Min(mindNode.DesiredSize.Height, lefts.SumOrDefault(p => p.DesiredSize.Height)) / 2;
                    foreach (var child in lefts)
                    {
                        child.Offset = new PointBase(child.Offset.X - child.RootNode.Offset.X, child.Offset.Y - child.RootNode.Offset.Y);
                        child.DesiredPosition = new PointBase(right - child.Spacing.Width - child.ItemWidth, righttop + child.DesiredSize.Height / 2 - child.ItemHeight / 2);
                        child.Left = child.DesiredPosition.X + child.Offset.X;
                        child.Top = child.DesiredPosition.Y + child.Offset.Y;
                        righttop += child.DesiredSize.Height;

                        ArrangeOverride(child);

                        var connector = mindNode.Root?.Items.OfType<ConnectionViewModel>().FirstOrDefault(p => p.SourceConnectorInfo?.DataItem == mindNode && p.SinkConnectorInfoFully?.DataItem == child);
                        connector?.SetSourcePort(mindNode.FirstConnector);
                        connector?.SetSinkPort(child.RightConnector);
                        connector?.SetVisible(child.Visible);
                    }
                }
                
                mindNode.Offset = new PointBase();//修正后归0
            }
            else
            {
                if (mindNode.GetLevel1Node().ConnectorOrientation == ConnectorOrientation.Left)
                {
                    double left = mindNode.DesiredPosition.X + mindNode.ItemWidth + mindNode.Spacing.Width;
                    double top = mindNode.DesiredPosition.Y + mindNode.ItemHeight / 2 - Math.Min(mindNode.DesiredSize.Height, mindNode.Children.SumOrDefault(p => p.DesiredSize.Height)) / 2;
                    if (mindNode.Children?.Count > 0)
                    {
                        foreach (var child in mindNode.Children)
                        {
                            child.Offset = new PointBase(child.Offset.X - child.RootNode.Offset.X, child.Offset.Y - child.RootNode.Offset.Y);
                            child.DesiredPosition = new PointBase(left + child.Spacing.Width, top + child.DesiredSize.Height / 2 - child.ItemHeight / 2);
                            child.Left = child.DesiredPosition.X + child.Offset.X;
                            child.Top = child.DesiredPosition.Y + child.Offset.Y;
                            top += child.DesiredSize.Height;

                            ArrangeOverride(child);

                            var connector = mindNode.Root?.Items.OfType<ConnectionViewModel>().FirstOrDefault(p => p.SourceConnectorInfo?.DataItem == mindNode && p.SinkConnectorInfoFully?.DataItem == child);
                            connector?.SetSourcePort(mindNode.RightConnector);
                            connector?.SetSinkPort(child.LeftConnector);
                            connector?.SetVisible(child.Visible);
                        }
                    }
                }
                else
                {
                    double right = mindNode.DesiredPosition.X  - mindNode.Spacing.Width;
                    double top = mindNode.DesiredPosition.Y + mindNode.ItemHeight / 2 - Math.Min(mindNode.DesiredSize.Height, mindNode.Children.SumOrDefault(p => p.DesiredSize.Height)) / 2;
                    if (mindNode.Children?.Count > 0)
                    {
                        foreach (var child in mindNode.Children)
                        {
                            child.Offset = new PointBase(child.Offset.X - child.RootNode.Offset.X, child.Offset.Y - child.RootNode.Offset.Y);
                            child.DesiredPosition = new PointBase(right - child.Spacing.Width - child.ItemWidth, top + child.DesiredSize.Height / 2 - child.ItemHeight / 2);
                            child.Left = child.DesiredPosition.X + child.Offset.X;
                            child.Top = child.DesiredPosition.Y + child.Offset.Y;
                            top += child.DesiredSize.Height;

                            ArrangeOverride(child);

                            var connector = mindNode.Root?.Items.OfType<ConnectionViewModel>().FirstOrDefault(p => p.SourceConnectorInfo?.DataItem == mindNode && p.SinkConnectorInfoFully?.DataItem == child);
                            connector?.SetSourcePort(mindNode.LeftConnector);
                            connector?.SetSinkPort(child.RightConnector);
                            connector?.SetVisible(child.Visible);
                        }
                    }
                }
            }


        }

5 最后为了方便大家使用,我封装了一个思维脑图的控件MindEditor,可以直接绑定json格式的数据,数据改变,可以直接加载应用。(见AIStudio.Wpf.DiagramDesigner.Demo)

 

近期会持续更新,欢迎大家光临艾竹 (akwkevin) - Gitee.com,支持的朋友们,点个小星星,你们的支持能燃烧我开源的力量。

标签:DesiredPosition,mindNode,导图,child,Height,Diagram,DesiredSize,Offset,Wpf
From: https://www.cnblogs.com/akwkevin/p/17288814.html

相关文章

  • Midjourney? 文心一格? 一张思维导图带你了解图片生成AI
    (“马爸爸开心回国图”,图片使用Midjourney生成) 最近和ChatGPT大语言模型一样大火的还有图片生成AI(Text-To-Image),大家耳熟能详的Midjourney、StableDiffusion、Dalle2、Imagen等等都是图片生成AI,尤其是百度的文心一格上线后,网上的讨论(调侃)更加火热。 图片生成普遍采用Di......
  • 02142数据结构导论-考试大纲思维导图
    第一章第二章第三章第四章第五章第六章第七章思维导图下载地址(MindMaster绘制):链接:https://pan.baidu.com/s/1kaoT394M-EG3w05sdC9eqQ?pwd=6060提取码:6060......
  • 【WPF】ContextMenu 控件
    ContextMenu无论定义在.cs或.xaml文件中,都不继承父级的DataContext,所以如果要绑定父级的DataContext,直接DataContext=“{Binding}”是行不通的不能绑父级,但是能绑资源 第一步:定义一个中间类用来做资源对象publicclassBindingProxy:Freezable{#regionOver......
  • 界面组件DevExpress WPF v22.2 - 工具栏、日程组件全新升级
    DevExpressWPF拥有120+个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpressWPF能创建有着强大互动功能的XAML基础应用程序,这些应用程序专注于当代客户的需求和构建未来新一代支持触摸的解决方案。无论是Office办公软件的衍伸产品,还是以数据为中心......
  • 记录-开发WPF项目中的一个疑惑
    背景项目技术栈:C#,WPF当前我想要实现点击某个按钮就可以跳转到某个界面,翻阅了项目中的代码,看到了//按钮事件privatevoidBtn_Click(objectsender,RoutedEventArgse)......
  • DevExpress WPF的电子表格组件,让您更快获得Excel体验(二)
    DevExpress WPF的Spreadsheet控件拥有读取、写入、转换XLSx、XLS、CSV和TXT文件的功能,并且为终端用户提供了当今最流行的办公生产力套件才能获得的UI体验。它包括与Ribbon......
  • .NET6 WPF 获取显示屏全尺寸
    使用System.Windows.SystemParameters无法获取屏幕最大尺寸。解决问题办法:1.需要在WPF工程中引用Forms框架。项目右击》》》属性》》》选中为该项目启用windows窗......
  • OpenScenario场景仿真结构思维导图, OpenScenario是 自动驾驶仿真软件carla推出来的场
    OpenScenario场景仿真结构思维导图,OpenScenario是自动驾驶仿真软件carla推出来的场景仿真标准,可配合carla一起完成整套自动驾驶的闭环仿真过程,将场景搭建变成可编程化的......
  • WPF TreeView控件根据数据内容跳转到指定节点
    1、问题描述一般,当我们需要展开TreeView控件的某一节点时,可以在TreeView控件的TreeViewItem所绑定的数据结构上增加一个bool属性,然后与TreeViewItem的IsExpand属性相绑定,......
  • WPF重写Window标题栏
    <Windowx:Class="License.UI.DetailsInterface"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://sche......