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

2022-12-01 17:26:08

　　在正文开始之前需要介绍一个人：Sean Sexton. 来自明尼苏达双城的软件工程师。最为出色的是他维护了两个博客：2,000 Things 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.GetChildrenCount和GetChild方法来遍历视觉树并列出所有在视觉树上的对象。

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

for (int i = 0; i < VisualTreeHelper.GetChildrenCount(obj); i++)

    Debug.WriteLine(VisualTreeHelper.GetChild(obj, i));

　　＃50 查看视觉树小工具

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

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

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

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

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

码农公寓

相关文章