First Look at Silverlight 2--Part4：使用CSS风元素封装页面外观风格

Part4：使用CSS风元素封装页面外观风格

使用风格元素封装外观

WPF和Silverlight支持风格机制（允许我们封装控件的属性值作为可重用的资源），我们可以在不同的文件中存储这些风格定义信息，可以在多个控件，多个页面，多个程序用公用。在客户话定制的情况下，这个概念与HTML文件的CSS的使用非常类似。
注意：除了定义基本的风格定义（例如：颜色，字体，尺寸，边距等），在WPF中的风格化定义亦可以用来定义控件模板（非常华丽的皮肤和匹配控件结构的风格），我们将在Part7讨论控件模板。
我们的Digg程序，我们将定义我们的风格定义在App。Xaml文件中，可以被程序的页面和控件使用。



图1
我们首先封装<Border>控件和我们在搜索标题所使用的<TextBlock>。


图2


图3
在App.Xaml文件中创建两个风格元素封装<Border><TextBlock>，我们之前在行内做了标记。封装后代码如下：


图4
我们给每一个风格元素一个唯一的“Key”，我们程序可以使用这些“Key”去更新我们的<Border> 、<TextBlock>控件。我们将使用XAML的扩展标示特性"markup extensions"来完成这些。标示扩展也可用在非文本值的风格设置，例如：我们时候用数据绑定表达式中。


图5
在Page.xaml文件中我们将使用风格定义去更新其它的控件风格，代码如下：


图6
通过封装风格设置，我们可以让开发者更好的关注与程序的应用场景，并且可以在页面和控件中进行重用。

下一步

现在我们已经通过风格化的应用整理了我们的Page.xaml文件。下一步我们将进一步定义我们数据的展现。