Visual Layer Overview(1)--Role of the Visual Object

Visual object是Windows Presentation Foundation的核心对象，它的主要作用就是对渲染的支持。UI controls，例如：Button和TextBox 从Visual class继承，并使用Visual class保存它们的数据。Visual object提供了如下的支持:

Output display: 渲染永久化的，序列化的描画内容

Transformations: 在visual上执行变换

Clipping: 为visual提供裁减的支持.

Hit testing: 决定一个坐标或者几何图形时候是否包含在visual 的区域内.

Bounding box calculations: 决定visual的包围的矩形.

然而，Visual object没有提供非渲染得特性，例如：

事件处理: Handling system and user-input events.

布局: Positioning elements on containing surfaces.

样式: Applying common set of properties to set of elements.

数据绑定: Binding data to elements, such as grids and list boxes.

全球化: Adapting UI to different cultures.

Retained Mode Graphics

理解Visual object角色的关键是理解immediate mode 和retained mode图形系统之间的不同。标准的基于GDI 或者 GDI+的Win32应用程序使用immediate mode图形系统,也就是说应用程序负责重画客户区域的无效部分，由于window大小改变或者对象外观的改变等动作会造成客户区无效。



相反的是，Windows Presentation Foundation使用retained mode （保留模式）system，也就是说，应用程序的对象定义了一系列的描画数据来显示。一旦描画数据被定义，之后由系统在渲染应用对象时负责重画。甚至在运行时，可以修改或者创建应用对象，仍然由系统来负责重画请求。retained mode graphics system的强大之处在于描画数据序列化的保存在应用程序的状态中，但是渲染的责任留给了系统



Vector Graphics

Windows Presentation Foundation使用vector graphics作为它的渲染数据的格式。Vector graphics—包含Scalable Vector Graphics (SVG), Windows metafiles (.wmf), 和TrueType fonts

Controls as Composite Visual Objects
Windows Presentation Foundation 中的许多UI elements，例如：controls 可以扩张为一个visual objects的层次树
"XAML"
<Button Click="OnClick">OK</Button>
如果想枚举组成默认的 Button control 的visual objects，可以发现下图所示



Button 控件包含一个ClassicBorderDecorator 元素，ClassicBorderDecorator又包含一个ContentPresenter元素。ClassicBorderDecorator元素负责描画Button的border和background。ContentPresenter元素显示Button内容，在本例的情况下，因为我们要显示文本，ContentPresenter元素包含一个TextBlock元素。实际上Button控件使用ContentPresenter 意味着content可以被表示成其他元素，例如：Image 或者a geometry.

Control Templates

Control的展开成层次的控件的关键是ControlTemplate. ControlTemplate指定了一个控件的默认层次。当明确的引用一个控件时，实际上是在引用它的可视化层次。可以重写控件模版的默认值来创建一个自定义外观的控件。

Drawing Content in Visual Objects

Visual object 使用 vector graphics instruction list来保存它的渲染数据. instruction list中的每一项代表一个序列格式中的一个低级的图形数据，有四种类型的图形数据可以被包含在drawing content中：

Drawing content type	Description
Geometry	Draws a geometry using a specified Brush and Pen.
Image	Draws an image within a region defined by a Rect.
Glyph	Represents a drawing that renders a GlyphRun, which is a sequence of glyphs from a specified font resource. This is how text is represented.
Video	Represents a drawing that renders video.

一个UI元素例如 Button控件，包含一些vector graphics instruction lists来描述控件的全部渲染定义。

"XAML"
<Button Click="OnClick"> <Image Source="images/greenlight.jpg"></Image> </Button>

Button控件的层次对象如下图所示：



Button 控件包含一个ClassicBorderDecorator 元素, ClassicBorderDecorator又包含一个ContentPresenter 元素. The ClassicBorderDecorator 元素负责描画组成Button的border 和background的所有的离散的元素。ContentPresenter 元素负责显示Button的内容. 在这个例子中, 因为要显示的是一个图片, ContentPresenter 元素包含一个Image 元素.
还有一些关于显示对象的层级和vector graphics instruction lists相关的问题：

层次中的顺序表现了渲染顺序的信息。从根元素开始，遍历孩子元素，从上到下，从左到右。如果一个元素有可见的孩子元素，孩子元素将比兄弟元素先被访问。

层次中的非叶子节点元素，例如：ContentPresenter被用来包含孩子元素-他们不包含instruction lists。

如果一个可视化元素既包含vector graphics instruction list，又包含可视化的孩子节点，instruction list将在孩子节点之前被渲染。

vector graphics instruction list中的元素从左到右被渲染。