Expression Blend Example Chinese Tutorial (12)-Quick start to styles and templates Style,template

In the previous article, we introduced the Visual state Manager Visual Status Manager, which involved the control's style (style) and template (Template). This article details the application of styles (style) and templates (Template) in Silverlight projects, and describes how to use blend design styles (style) and templates (Template).

In the development of LOB (Line-of-business) enterprise application projects, in order to diversify the visual effects of the project, not only animation effects are used, but also the style (style) and template (Template) of some controls are often required. In the Silverlight control pack, Microsoft has defined default control styles and templates that developers can modify and tweak on these default codes to meet project requirements. However, because the default control style and template code is too lengthy, manual modification is relatively complex and cumbersome, in this, Microsoft has encapsulated some new features in the blend, to facilitate the developers and designers to control the template and style. Before you learn blend control styles (style) and templates (Template), get a quick look at styles and templates (Template).

Style, a friend of the HTML development base is not unfamiliar with the traditional CSS style sheet, HTML brings together all the common property codes into CSS files, uses CSS to control the background of the page, controls the width of the table, controls the distance of the control, and so on. The same styles (style) and CSS in Silverlight allow designers and developers to define the common properties of the control in a resource file, allowing the same property control to be invoked freely, which not only increases the reusability of the code, but also guarantees the consistency of the control's appearance in the project.

Templates (Template), the concept of templates has been introduced in traditional Web page development, and early Dreamweaver has attracted a lot of web developers for supporting the creation of Web Template designs. The concept of a template is also introduced in Silverlight. In Silverlight, controls that inherit from System.Windows.Controls named controls have a default template that designers and developers can modify based on the default template to create a custom template.

Definitions of styles (style) and templates (Template)

In Silverlight, the style and template definitions are simple, because many of the properties have been encapsulated, do not need to create themselves, only need to call on it. Simple Demo Code:

Style:

1 <UserControl.Resources>
2   <style x:key= "TextboxStyle" targettype= "TextBox" >
3     This defines the specific style attributes
4   </Style>
5 </UserControl.Resources>

Template:

1 <UserControl.Resources>
2   <controltemplate x:key= "textboxtemplate" targettype= "TextBox" >
3     <border borderbrush= "Orange" borderthickness= "3" cornerradius= "4"      background= "Red" >
5           define specific templates
6     </Border>
7   </ControlTemplate>
8 </ Usercontrol.resources>

Use of styles (style) and templates (Template)

In Silverlight, styles (style) and templates (Template) belong to control resources, that is, both can be defined in the resource file, and on the project page, just use the style and Template property calls.

Style:

1 <textbox style={"StaticResource TextboxStyle"} text= "style test"/>

Template: This method is also supported by blend, let's take a look at the examples to understand further.

1 <textbox template={"StaticResource textboxtemplate"} text= "template Test"/>