2000条你应知的WPF小姿势 基础篇<45-50 Visual Tree&Logic Tree 附带两个小工具>

  在正文开始之前需要介绍一个人:Sean Sexton. 来自明尼苏达双城的软件工程师。最为出色的是他维护了两个博客:2,000Things You Should Know About C#  和 2,000 Things You Should Know About WPF 。他以类似微博式的150字简短语言来每天更新一条WPF和C#重要又容易被遗忘的知识。Follow他的博客也有一段日子了,很希望能够分享给大家。

  本系列我不仅会翻译他的每一个tip,也会加入自己开发之中的看法和见解。本系列我希望自己也能和他一样坚持下来,每天的进步才能促成伟大。

  在这里郑重说明.该系列是基于Sean Sexton先生的英文博客, Sean Sexton拥有全部版权和撤销权利。

 

  前文:<1-7> , <8-14>,<15-21>,<22-27>, <28-33>,<34-39>,<40-44>

 

  [小九的学堂,致力于以平凡的语言描述不平凡的技术。如要转载,请注明来源:小九的学堂cnblogs.com/xfuture]


  #45 Logical Tree 逻辑树

  WPF逻辑树是用户界面元素的层次结构关系的树状图。如果你的UI是在Xaml里定义的,逻辑树就是Xaml中元素整合为具有父子关系的树的模型。它描述了在运行时这些元素之间的关系。逻辑树可以帮助我们理解:

  1. Resource lookup 资源查找

  2. Property inheritance 属性继承

  3. Event routing 路由事件。

  下面有个例子:

  

<Window x:Class="WpfApplication4.MainWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="A window.." Height="350" Width="525">
    <StackPanel>
        <Button Content="Click Me" Height="23" HorizontalAlignment="Left" Width="75" Click="button1_Click" />
        <TextBox />
        <ListBox>
            <ListBoxItem Content="Barley"/>
            <ListBoxItem Content="Oats"/>
        </ListBox>
    </StackPanel>
</Window>

  逻辑树的模型是:

  

  

  

  #46 代码中寻找逻辑树

  你可以使用LogicalTreeHelper.GetChildren方法来遍历逻辑树并列出所有在逻辑树上的对象。

  在逻辑树上(LogicTree)上所有的元素都是DependencyObject, 你可以通过调用GetChildren方法获得上层对象的所有子对象,并返回其集合。

  

// Enumerate each immediate child of main window.  (Does NOT descend down tree)
foreach (Object obj in LogicalTreeHelper.GetChildren(mainWindow as DependencyObject))
    Debug.WriteLine(obj.ToString());

  你可以通过嵌套循环来列出所有的子元素。

 

  #47 查看逻辑树小工具

  下面介绍一个可以查看逻辑树的小工具。

  用法:将.XAML文件拖入窗口即可展示其逻辑树。它内部机制是调用LogicalTreeHelper.GetChildren来获得子元素并展示在一个treeview的控件上。

  

  下载地址:DisplayWpfTrees.zip 源代码:WPFLogicalTree project

  该工具更详细的介绍:An Application to Let You View WPF Logical Trees

 

  #48 视觉树(Visual tree)

  WPF视觉树打破了逻辑树的框,深入到内部,展示了更低level的元素。在逻辑树中的元素是XAML中一般的控件,而视觉树中会显示所有基本的视觉元素。所有在视觉树上显示的元素都继承自Visual or Visual3D。

  例子:

  

<Window x:Class="WpfApplication4.MainWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml>
    <StackPanel>
        <Button Content="Click Me" />
        <TextBox />
        <ListBox>
            <ListBoxItem Content="Barley"/>
            <ListBoxItem Content="Oats"/>
        </ListBox>
    </StackPanel>
</Window>

  其视觉树:

  

Window
    Border
        AdornerDecorator
            ContentPresenter
                StackPanel
                    Button
                        ButtonChrome
                            ContentPresenter
                                TextBlock
                    TextBox
                        ListBoxChrome
                            ScrollViewer
                                Grid
                                    Rectangle
                                    ScrollContentPresenter
                                        TextBoxView
                                            TextBoxLineDrawingVisual
                                        AdornerLayer
                                    Scrollbar
                                    Scrollbar
                    ListBox
                        Border
                            ScrollViewer
                                Grid
                                    Rectangle
                                    ScrollContentPresenter
                                        ItemsPresenter
                                            VirtualizingStackPanel
                                                ListBoxItem
                                                    Border
                                                        ContentPresenter
                                                            TextBlock
                                                ListBoxItem
                                                    Border
                                                        ContentPresenter
                                                            TextBlock
                                        AdornerLayer
                                    ScrollBar
                                    Scrollbar
            AdornerLayer

  

  #49 代码中寻找视觉树

  你可以使用VisualTreeHelper.GetChildrenCountGetChild方法来遍历视觉树并列出所有在视觉树上的对象。

  你可以使用循环来获得所有的视觉树上的元素:

  

for (int i = 0; i < VisualTreeHelper.GetChildrenCount(obj); i++)
    Debug.WriteLine(VisualTreeHelper.GetChild(obj, i));

  

  #50 查看视觉树小工具

  下面介绍一个可以查看视觉树的小工具。

  用法:将.XAML文件拖入窗口即可展示其视觉树。它内部机制是调用VisualTreeHelper.GetChildren来获得子元素并展示在一个treeview的控件上。

   

  下载地址:DisplayWpfTrees.zip 源代码:WPFVisualTree project   

  更多信息:An Application to Let You View WPF Visual/Logical Trees

 

  

  后篇会对WPF内部机制继续做探索,敬请关注!

  如果觉得有帮助,右下角赞一下吧~ (* *)

 

posted @ 2014-06-24 18:09  techlead_krischang  阅读(2241)  评论(7编辑  收藏  举报