原文:WPF的逻辑树和视觉树

这部分的内容来自于即将出版的新书《WPF Unleashed》的第三章样章。关于什么是逻辑树,我们先看下面的一个伪XAML代码的例子:

<Window ......>
     <StackPanel>
      <Label>LabelText</Lable>
     </StackPanel>
</Window>

在这样一个简单UI中,Window是一个根结点,它有一个子结点StackPanel。而StackPanel有一个子结点Label。注意Label下还有一个子结点string(LabelText),它同时也是一个叶子结点。这就构成了窗口的一个逻辑树。逻辑树始终存在于WPF的UI中,不管UI是用XAML编写还是用代码编写。WPF的每个方面(属性、事件、资源等等)都是依赖于逻辑树的。

视觉树基本上是逻辑树的一种扩展。逻辑树的每个结点都被分解为它们的核心视觉组件。逻辑树的结点对我们而言基本是一个黑盒。而视觉树不同,它暴露了视觉的实现细节。下面是Visual Tree结构就表示了上面四行XAML代码的视觉树结构:



并不是所有的逻辑树结点都可以扩展为视觉树结点。只有从System.Windows.Media.Visual和System.Windows.Media.Visual3D继承的元素才能被视觉树包含。其他的元素不能包含是因为它们本身没有自己的提交(Rendering)行为。

在Windows Vista SDK Tools当中的XamlPad提供查看Visual Tree的功能。需要注意的是XamlPad目前只能查看以Page为根元素,并且去掉了SizeToContent属性的XAML文档。如下图所示:



注意图中工具栏特别标记的地方。我们可以看到Visual Tree确实比较复杂,其中还包含有很多的不可见元素,比如ContentPresenter。Visual Tree虽然复杂,但是在一般情况下,我们不需要过多地关注它。我们在从根本上改变控件的风格、外观时,需要注意Visual Tree的使用,因为在这种情况下我们通常会改变控件的视觉逻辑。

WPF中还提供了遍历逻辑树和视觉树的辅助类:System.Windows.LogicalTreeHelper和System.Windows.Media.VisualTreeHelper。注意遍历的位置,逻辑树可以在类的构造函数中遍历。但是,视觉树必须在经过至少一次的布局后才能形成。所以它不能在构造函数遍历。通常是在OnContentRendered进行,这个函数为在布局发生后被调用。

其实每个Tree结点元素本身也包含了遍历的方法。比如,Visual类包含了三个保护成员方法VisualParent、VisualChildrenCount、GetVisualChild。通过它们可以访问Visual的父元素和子元素。而对于FrameworkElement,它通常定义了一个公共的Parent属性表示其逻辑父元素。特定的FrameworkElement子类用不同的方式暴露了它的逻辑子元素。比如部分子元素是Children Collection,有是有时Content属性,Content属性强制元素只能有一个逻辑子元素。 

WPF的逻辑树和视觉树的更多相关文章

  1. WPF的逻辑树与视觉树(3)Visual呈现

    原文:WPF的逻辑树与视觉树(3)Visual呈现 这篇就点到为止,挑重点讲 绘图方式有两种 1.继承UIElement,重写OnRender方法 public partial class Windo ...

  2. WPF的逻辑树与视觉树(1)基本概念

    原文:WPF的逻辑树与视觉树(1)基本概念     一.摘要 逻辑树与视觉树属于WPF的基本概念,学过WPF或者Silverlight的朋友一定会对其有所耳闻,这篇文章将来探讨逻辑树与视觉树的特质以及 ...

  3. WPF的逻辑树与视觉树(2)Visual容器

    原文:WPF的逻辑树与视觉树(2)Visual容器   一.摘要 虽然我们平时几乎不会从该类派生,但要想了解视觉树就必须要了解Visual,Visual是一个基本抽象类,继承自DependencyOb ...

  4. 【WPF】逻辑树和视觉树

    WPF中提供了遍历逻辑树和视觉树的辅助类:System.Windows.LogicalTreeHelper和 System.Windows.Media.VisualTreeHelper. 注意遍历的位 ...

  5. 理解WPF中的视觉树和逻辑树

    轉載地址:http://blog.csdn.net/changtianshuiyue/article/details/26981797 理解WPF中的视觉树和逻辑树  Understanding th ...

  6. WPF中的逻辑树和可视化树

    WPF中的逻辑树是指XAML元素级别的嵌套关系,逻辑树中的节点对应着XAML中的元素. 为了方便地自定义控件模板,WPF在逻辑树的基础上进一步细化,形成了一个“可视化树(Visual Tree)”,树 ...

  7. 2000条你应知的WPF小姿势 基础篇<40-44 启动关闭,Xaml,逻辑树>

    在正文开始之前需要介绍一个人:Sean Sexton. 来自明尼苏达双城的软件工程师.最为出色的是他维护了两个博客:2,000Things You Should Know About C# 和 2,0 ...

  8. wpf 逻辑树与可视化树

    XAML天生就是用来呈现用户界面的,这是由于它具有层次化的特性.在WPF中,用户界面由一个对象树构建而成,这棵树叫作逻辑树.逻辑树的概念很直观,但是为什么要关注它呢?因为几乎WPF的每一方面(属性.事 ...

  9. WPF学习(4)逻辑树和可视树

    前面几节说了一些WPF的基础,包括XAML和布局等.在接下来的几节,我们来说说WPF的核心概念,包括逻辑树和可视树.依赖对象和依赖属性.路由事件.命令这几个部分.本节介绍下逻辑树(Logical Tr ...

随机推荐

  1. C# WebAPI中DateTime类型字段在使用微软自带的方法转json格式后默认含T的解决办法

    原文:C# WebAPI中DateTime类型字段在使用微软自带的方法转json格式后默认含T的解决办法 本人新手,在.Net中写WebAPI的时候,当接口返回的json数据含有日期时间类型的字段时, ...

  2. [Django] Auth django app with rest api

    First, start the env: . bin/activate Then cd to our module cd djangular Create a new app: python man ...

  3. Uncaught SyntaxError: Invalid regular expression flags(看页面源代码)

    Uncaught SyntaxError: Invalid regular expression flags(看页面源代码) 一.总结 js或者jquery方面的错误看页面源代码,一下子错误就很清晰了 ...

  4. [RxJSv& Javascript] forkJoin (reactive Promise.all) & Map

    forkJoin: When all observables complete emit the last value from each. productMap: Map<number, IP ...

  5. 微信小程序从零开始开发步骤(三)

    上一章节,我们分享了如何创建一个新的页面和设置页面的标题,这一章我们来聊聊底部导航栏是如何实现的.即点击底部的导航,会实现不同对应页面之间的切换. 我们先来看个我们要实现的底部导航栏的效果图:(三个导 ...

  6. 小强的HTML5移动开发之路(40)——jqMobi中实践header定义的几种方式

    一.定义全局的header 这个header是所有panel默认的header,需要在<div id="afui">内部,也就是和<div id="co ...

  7. C#反射应用

    考虑这个是因为返回的是对象集合,需要把对象集合绑定到datagridview上,绑定datagridview需要数据源,组装数据的话,用datatable添加列很麻烦,所以用反射来实现,估计可能会有多 ...

  8. 学习鸟哥的Linux私房菜笔记(10)——bash2

    七.命令行表达式 命令行输出--" " 将一串字符当成一个字符串来对待,如果字符串中包含特殊含义的字符,则转义. 双引号不能将 \ $ ` ! 符号的特殊功能禁止 命令行输出--' ...

  9. Windows获取时间函数(使用GetLocalTime,GetSystemTime,SystemTimeToTzSpecificLocalTime,GetFileTime API函数

    获取本地时间 typedef struct _SYSTEMTIME { WORD wYear; WORD wMonth; WORD wDayOfWeek; WORD wDay; WORD wHour; ...

  10. cordova 打包出错 Android SDK not found Android target: not installed

    原文:cordova 打包出错 Android SDK not found Android target: not installed 今天用cordova打包的时候报Android SDK not ...