惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Y
Y Combinator Blog
D
Docker
有赞技术团队
有赞技术团队
D
DataBreaches.Net
The GitHub Blog
The GitHub Blog
爱范儿
爱范儿
H
Help Net Security
美团技术团队
MyScale Blog
MyScale Blog
B
Blog RSS Feed
C
Check Point Blog
Microsoft Security Blog
Microsoft Security Blog
阮一峰的网络日志
阮一峰的网络日志
A
About on SuperTechFans
小众软件
小众软件
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
GbyAI
GbyAI
G
Google Developers Blog
月光博客
月光博客
Google DeepMind News
Google DeepMind News
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Blog — PlanetScale
Blog — PlanetScale
MongoDB | Blog
MongoDB | Blog
F
Fortinet All Blogs

博客园 - guozili

分享12306抢票心得-终极秒杀思路篇 分享12306抢票心得-最终篇 分享12306全自动验证码识别提交,春运抢票准备时 分享“12306 P2P平台”创业Idea 分享12306秒票杀手锏源码 分享12306秒票心得及杀手锏 分享基于EF+MVC+Bootstrap的通用后台管理系统及架构 分享基于EF+WCF的通用三层架构及解析 基于Silverlight的快速开发框架RapidSL新特性解析 分享基于silverlight的仿“百度文库”的文档控件 基于 Silverlight的快速开发框架RapidSL新版改进源码 基于 Silverlight的快速开发框架RapidSL之MVVM解析 基于Silverlight的快速开发框架RapidSL之开源 分享基于silverlight的一个大文件上传控件 抢火车票利器:分享一个抓取火车票转让信息的小程序 基于 Silverlight的精简框架之版本升级及使用 基于 Silverlight的精简框架之版本和控件更新 Silverlight project demos for MSRA in 2009,to look forward to silverlight's furture 异步编程练习
分享基于silverlight的一个“树形结构图”控件
guozili · 2012-07-08 · via 博客园 - guozili

传统的树形菜单只适用于展示,本控件提供了一个可视化的组织图展示,并实现了一个对树形图的CRUD拖拽操作,可用于OA的人员维护或是部门关系图

1. 使用此控件只需要定义根节点的模板:

<localControls:BranchNode Grid.Column="0" x:Name="unAllocateBranchNode" Margin="30">
            <localControls:BranchNode.Template>
                <ControlTemplate TargetType="localControls:BranchNode">
                    <Grid x:Name="rootPanel" VerticalAlignment="Top" Height="{TemplateBinding Height}">
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" DataContext="{TemplateBinding Branch}">
                            <Border x:Name="titlePanel" HorizontalAlignment="Stretch"  Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="3" BorderThickness="1">
                                <Border.Resources>
                                    <SolidColorBrush x:Key="normalBorder" Color="#9fa8b7"/>
                                    <SolidColorBrush x:Key="hightlightBorder" Color="Red"/>
                                </Border.Resources>
                                <StackPanel>
                                    <StackPanel Orientation="Horizontal">
                                        <ContentPresenter Content="{Binding Name}" VerticalAlignment="Center" Margin="5"/>                        
                                    </StackPanel>

                                    <ItemsControl ItemsSource="{Binding Embranchment}">
                                        <ItemsControl.ItemsPanel>
                                            <ItemsPanelTemplate>
                                                <StackPanel/>
                                            </ItemsPanelTemplate>
                                        </ItemsControl.ItemsPanel>
                                        <ItemsControl.ItemTemplate>
                                            <DataTemplate>
                                                <localControls:BranchNode Branch="{Binding}" Margin="3"/>
                                            </DataTemplate>
                                        </ItemsControl.ItemTemplate>
                                    </ItemsControl>

                                </StackPanel>

                            </Border>
                        </StackPanel>
                    </Grid>
                </ControlTemplate>
            </localControls:BranchNode.Template>
        </localControls:BranchNode>

2. 然后绑定数据源

            Branch branch = new Branch();
            branch.Name = "财务部";

            branch.Embranchment = new ObservableCollection<Branch>()
            {
                new Branch(){Name="财务部1"},
                new Branch(){Name="财务部2"},
                new Branch(){Name="财务部3"}
            };

            
            branch.AppendBranch += new Action<Branch>(branch_AppendBranch);
            this.unAllocateBranchNode.Branch = branch;

3. 核心使用了通用的推拽原型

        private void BindDragEvent()
        {
            bool isDragging = false;
            Point lastPosition = new Point(00);

            Popup rootPopup = new Popup();
            BranchNode ghostContainer = null;

            Branch parentBranch = null;
            Border lastTitlePanel = null;

            ...
            this.titlePanel.MouseLeftButtonDown += (source, eventArgs) =>
            {
                this.IsHitTestVisible = false;

                isDragging = true;
                lastPosition = eventArgs.GetPosition(null);
                ...
                ghostContainer.MouseLeftButtonUp += (s, e) =>
                {   
                    rootPopup.Child = null;
                    ...
                    isDragging = false;
                    this.ReleaseMouseCapture();
                    this.IsHitTestVisible = true;
                };

                ghostContainer.MouseMove += (s, e) =>
                {
                    if (!isDragging)
                        return;

                    ...
                    MatrixTransform mt = new MatrixTransform();
                    mt.Matrix = rt.Value;

                    ghostContainer.RenderTransform = mt;

                };
            };
        }

 4. 源代码下载

 https://199.47.216.171/u/10032723/EasyOA.rar

5. 预览