【WPF学习】第五十九章 理解控件模板
最近工作比较忙,未能及时更新内容,敬请了解!!!
对于可视化树的分析引出了几个有趣问题。例如,控件如何从逻辑树表示扩张成可视化树表示?
每个控件都有一个内置的方法,用于确定如何渲染控件(作为一组更基础的元素)。该方法称为控件模板(control template),是用xaml标记块定义的。
下面是普通button类的模板的简化版本。该版本省略了xml明朝空间声明、为嵌套的元素设置属性的特性,以及当按钮被禁用、取得焦点或单击时确定按钮行为的触发器:
<controltemplate ...> <mwt:buttonchrome name="chrome" ...> <contentpresenter content="{templatebinding contentcontrol.content}" ... /> <mwt:buttonchrome> <controltemplate.triggers> ... </controltemplate.triggers> </controltemplate>
尽管尚未研究buttonchrome和contentpresenter类,但很容易就能联想到:控件模板提供了在可视化树中看到的扩展内容。buttonchrome类定义按钮的标准可视化外观,而contentpresenter类存储了提供的所有内容。如果希望构建全新按钮,只需要创建新的控件模板。除buttonchrome类之外,还使用其他一些内容——可能是自定义元素,也能使在前面介绍的某个绘制形状的元素。
当按钮获得焦点、被单击以及被禁用时,触发器控制按钮如何进行变化。对于这些触发器,实际上没有什么特别需要介绍的内容。针对获取焦点和单击的触发器并不会修改按钮本身,只是修改为按钮提供可视化外观的buttonchrome类的属性:
<trigger property="uielement.iskeyboardfocused“> <setter property="mwt:buttonchrome.renderdefaulted targetname="chrome"> <setter.value> <s:boolean>true</s:boolean> </setter.value> </setter> <trigger.value> <s:boolean>true</s:boolean> </trigger.value> </trigger> <trigger property="uielement.ischecked“> <setter property="mwt:buttonchrome.renderdefaulted targetname="chrome"> <setter.value> <s:boolean>true</s:boolean> </setter.value> </setter> <trigger.value> <s:boolean>true</s:boolean> </trigger.value> </trigger>
第一个触发器确保当按钮接受到焦点时,renderdefaulted属性设置为true。第二个触发器确保当按钮被单击时,renderdefaulted属性被设置为true。对于每种情况,buttonchrome类都会相应地调整自身。由于发生的图形变化过于复杂,因此无法只通过几个属性设置器语句来表示这些变化。
该例中的两个setter对象都通过使用targetname属性作用于控件模板的特定部分。只有当使用控件模板时,才恩能够使用这种技术。换句话说,不能编写样式触发器以使用targetname属性访问buttonchrome对象,因为名称chrome超出了样式范围。这种技术只是模板提供的比单独使用样式功能更强大的方法之一。
触发器未必需要使用targetname属性。例如,针对isenabled属性的触发器仅调整按钮中任何文本内容的前景色。该触发器通过设置textelement.foreground附加属性就能工作,而未必借助于buttonchrome类:
<trigger property="uielement.isenabled"> <setter property="textelement.foreground"> <setter.value> <solidcolorbrush>#ffadadad</solidcolorbrush> </setter.value> </setter> <trigger.value> <s:boolean>false</s:boolean> </trigger.value> </trigger>
当构建自己的控件模板时将看到同样的职责分离。如果足够幸运,可直接使用触发器完成所有工作,可能不需要创建自己定义类并添加代码。另一方面,如果需啊哟提供更复杂的可视化设计,可能需要继承自定义的修饰类,buttonchrome类本身不提供定制功能——该类专门用于渲染标准按钮的特定主题外观。
一、修饰类
buttonchrome类是在microsoft.windows.themes名称空间中定义的,在该名称空间中包含了一些较少的彼此相似的类,这些类用来渲染基本的windows细节。除buttonchrome外,这些类还包括bulletchrome(用于复选框和单选按钮)、scrollchrome(用于滚动条)、listboxchrome以及systemdropshadowchrome。这是最低级别的公有控件api。在少高级别上,会发现system.windows.controls.primitives名称空间中包含大量可以独立使用的基本元素,但他们通常被封装到更有用的控件中。这些元素包括scrollbar、resizegrip(用于改变窗口的尺寸)、thumb(滚动条上的拖动按钮)、tickbar(滚动条上可选的刻度设置)等。在本质上,system.windows.controls.primitives名称空间提供了可用在各种控件中的基本要素,本身的作用不大,而microsoft.windows.themes名称空间包含了用于渲染这些细节的基本绘图逻辑。
还有一点区别。与大多数wpf类型一样,system.windows.controls.primitives名称空间中的类型都是在presentationframework.dll程序集中定义的。然而,microsoft.windows.themes名称控件中的类型是在三个不同的程序集中定义的:presentationframework.aero.dll、presentationframework.luna.dll和presentationframework.royale.dll。每个程序集都包含自己的buttonchrome类(以及其他修饰类)版本,这些版本的渲染逻辑稍有不同。wpf使用那个程序集取决于操作系统和主题设置。
尽管控件模板经常使用修饰类进行绘图,但并非总需要这样。例如,resizegrip元素(该元素用于在可以改变尺寸的窗口的右下角创建点网格)非常简单,它的模板可使用在前面介绍的绘图类,如path、drawingbrush以及lineargradientbrush。下面是其使用的标记(有些复杂):
<controltemplate targettype="{x:type resizegrip}" ...> <grid background="{templatebinding panel.background}" snapstodevicepixels="true"> <path margin="0,0,2,2" data="m9,0l11,0 11,11 0,11 0,9 3,9 3,6 6,6 6,3 9,3z" horizontalalignment="right" verticalalignment="bottom"> <path.fill> <drawingbrush viewboxunits="absolute" tilemode="tile" viewbox="0,0,3,3" viewport="0,0,3,3" viewportunits="absolute"> <drawingbrush.drawing> <drawinggroup> <drawinggroup.children> <geometrydrawing geometry="m0,0l2,0 2,2 0,2z"> <geometrydrawing.brush> <lineargradientbrush endpoint="1,0.75" startpoint="0,0.25"> <lineargradientbrush.gradientstops> <gradientstop offset="0.3" color="#ffffffff"/> <gradientstop offset="0.75" color="#ffbbc5d7" /> <gradientstop offset="1" color="#ff6d83a9" /> </lineargradientbrush.gradientstops> </lineargradientbrush> <geometrydrawing.brush> </geometrydrawing> </drawinggroup.children> </drawinggroup> </drawingbrush.drawing> </drawingbrush> </path.fill> </path> </grid> </controltemplate>
二、剖析控件
当创建控件模板时,新建的模板完全替代了原有的模板,这样可以得到更大的灵活性,但更复杂些。大多数情况下,在创建满足自己需要的模板之前,需要查看控件使用的标准模板。某些情况下,自定义的控件模板可镜像标准模板,并只进行很少的修改。
wpf文档没有列出标准控件模板的xaml。然而, 可通过编程获取所需的信息。基本思想是从tmeplate属性(该属性在control类中定义)获取控件的模板,然后使用xamlwriter类,将该模板串行化到xaml文件中。下图显示了一个示例程序,该程序列出了所有wpf控件,并允许查看每个控件的模板。
构建该应用程序的诀窍是使用反射(reflection),反射是用于检查类型的.net api。当第一次加载应用程序的住窗口时,扫描presentationframework.dll核心程序集(在该程序集中定义了控件类)中的所有类型,然后将这些类型添加到一个集合中,根据类型名称进行排序,此后将该集合绑定到一个列表。
private void window_loaded(object sender, routedeventargs e) { type controltype = typeof(control); list<type> derivedtypes = new list<type>(); // search all the types in the assembly where the control class is defined. assembly assembly = assembly.getassembly(typeof(control)); foreach (type type in assembly.gettypes()) { // only add a type of the list if it's a control, a concrete class, and public. if (type.issubclassof(controltype) && !type.isabstract && type.ispublic) { derivedtypes.add(type); } } // sort the types by type name. derivedtypes.sort(new typecomparer()); // show the list of types. lsttype.itemssource = derivedtypes; }
无论何时从列表中选择控件,相应的控件模板都会显示在右边的文本框中。完成这一步需要做更多的工作。第一个挑战是,在窗口中实际显示控件之前,控件的模板为空。通过使用反射,代码视图创建控件的一个实例,并将它添加到当前窗口中(但可将visibility设置为collapse,使控件不可见)。第二个挑战是,将现存的controltemplate对象转换为大家熟悉的xaml标记。xamlwriter.save()静态方法负责完成该任务,但代码使用xamlwriter和xamlwritersetting对象以确保xaml缩进合理,便于阅读。所有这些代码都被封装在异常处理块中,异常处理块监视不能被创建或不能添加到grid网格(如另一个windows或page)中的控件产生的问题:
private void lsttypes_selectionchanged(object sender, selectionchangedeventargs e) { try { // get the selected type. type type = (type)lsttype.selecteditem; // instantiate the type. constructorinfo info = type.getconstructor(system.type.emptytypes); control control = (control)info.invoke(null); window win = control as window; if (win != null) { // create the window (but keep it minimized). win.windowstate = system.windows.windowstate.minimized; win.showintaskbar = false; win.show(); } else { // add it to the grid (but keep it hidden). control.visibility = visibility.collapsed; grid.children.add(control); } // get the template. controltemplate template = control.template; // get the xaml for the template. xmlwritersettings settings = new xmlwritersettings(); settings.indent = true; stringbuilder sb = new stringbuilder(); xmlwriter writer = xmlwriter.create(sb, settings); system.windows.markup.xamlwriter.save(template, writer); // display the template. txttemplate.text = sb.tostring(); // remove the control from the grid. if (win != null) { win.close(); } else { grid.children.remove(control); } } catch (exception err) { txttemplate.text = "<< error generating template:" + err.message + ">>"; ; } }
扩展该应用程序,从而在文本框中编辑模板,使用xamlreader将模板转换回controltemplate对象,然后指定给某个控件并观察效果,这并不是很困难。然而,通过将模板放置到真实窗口中进行实际操作,测试和改进他们更加会容易。下一章节将介绍如何创建控件模板。
本章涉及的程序可通过下面的链接进行下载: