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.
理解Visual object角色的关键是理解immediate mode 和retained mode图形系统之间的不同。标准的基于GDI 或者 GDI+的Win32应用程序使用immediate mode图形系统,也就是说应用程序负责重画客户区域的无效部分,由于window大小改变或者对象外观的改变等动作会造成客户区无效。
相反的是,Windows Presentation Foundation使用retained mode (保留模式)system,也就是说,应用程序的对象定义了一系列的描画数据来显示。一旦描画数据被定义,之后由系统在渲染应用对象时负责重画。甚至在运行时,可以修改或者创建应用对象,仍然由系统来负责重画请求。retained mode graphics system的强大之处在于描画数据序列化的保存在应用程序的状态中,但是渲染的责任留给了系统
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的展开成层次的控件的关键是ControlTemplate. ControlTemplate指定了一个控件的默认层次。当明确的引用一个控件时,实际上是在引用它的可视化层次。可以重写控件模版的默认值来创建一个自定义外观的控件。
Drawing Content in Visual Objects
Visual object 使用 vector graphics instruction list来保存它的渲染数据. instruction list中的每一项代表一个序列格式中的一个低级的图形数据,有四种类型的图形数据可以被包含在drawing content中:
Drawing content type | Description |
Geometry | |
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中的元素从左到右被渲染。