无论从Runtime还是Tools都给我们带来了很多
惊喜如支持框架语言Visual Basic, Visual C#, IronRuby, Ironpython对JSON、Web Service、WCF以及Sockets支持等
系列新特性
步步学Silverlight 2系列
文章带您快速进入Silverlight 2开发本文为系列文章第 8篇
主要介绍在Silverlight中使用Style元素封装Control控件观感Silverlight 支持
种 Style 机制它允许我们把Control控件属性值封装成可重用资源我们可以把这些样式声明保存在独立于页面其他文件中然后就可以在个应用
中跨Control控件和页面重用(甚至跨多个应用重用)在做些基本定制场景下概念上类似于在 HTML 中重用 CSS内联样式 内联样式这个概念其实跟我们在HTML中指定元素
样式样在XAML中通过属性来设置如下面这段XAML我们添加了两个按钮并在其中设置字体样式:<Canvas Background="#46461F">
<Button Width="200" Height="60" Background="Red"
Canvas.Top="90" Canvas.Left="30" Content="提 交"
FontFamily="微软雅黑"
FontSize="24"
FontWeight="Bold"
Foreground="Green"/>
<Button Width="200" Height="60" Background="Red"
Canvas.Top="90" Canvas.Left="260" Content="取 消"
FontFamily="微软雅黑"
FontSize="24"
FontWeight="Bold"
Foreground="Red"/>
</Canvas> 运行后显示效果如下:
使用内联样式不是
种很好做法样式不可重用页面XAML代码混乱等这些缺点其实类似于在HTML中直接设置元素样式种推荐方式是应该使用全局样式全局样式 为了更好使样式能够重用
并且减少XAML中代码推荐使用全局样式在App.xaml中定义两个样式<Application.Resources>
<Style x:Key="button1" TargetType="Button">
<Setter Property="FontFamily" Value="微软雅黑"></Setter>
<Setter Property="FontSize" Value="24"></Setter>
<Setter Property="Foreground" Value="Green"></Setter>
<Setter Property="Background" Value="Red"></Setter>
</Style>
<Style x:Key="button2" TargetType="Button">
<Setter Property="FontFamily" Value="微软雅黑"></Setter>
<Setter Property="FontSize" Value="24"></Setter>
<Setter Property="Foreground" Value="Red"></Setter>
<Setter Property="Background" Value="Red"></Setter>
</Style>
</Application.Resources> 通过Style元素指定需要设置唯个Key类似于CSS中类名或者ASP.NET 2.0中Skin功能并且通过TargetType指定该样式将使用在哪类Control控件上每个属性都用Setter来指定在XAML中通过StaticResource标记句法来指定具体样式:<Canvas Background="#46461F">
<Button Width="200" Height="60"
Canvas.Top="90" Canvas.Left="30" Content="提 交"
Style="{StaticResource button1}"/>
<Button Width="200" Height="60"
Canvas.Top="90" Canvas.Left="260" Content="取 消"
Style="{StaticResource button2}"/>
</Canvas> 相比较上面XAML文件现在代码已经干净多了这使得我们可以只专注于应用业务而无需考虑它外观(在Beta1中似乎有些属性设置后会报错)运行后效果如下:
样式重写 定义了全局样式的后
样式能够被重写即内联样式优先级高于全局样式如上面举例中我们在XAML中通过属性Foreground指定第个按钮前景色为蓝色:<Canvas Background="#46461F">
<Button Width="200" Height="60"
Canvas.Top="90" Canvas.Left="30" Content="提 交"
Style="{StaticResource button1}"
Foreground="Blue"
/>
<Button Width="200" Height="60"
Canvas.Top="90" Canvas.Left="260" Content="取 消"
Style="{StaticResource button2}"/>
</Canvas> 尽管我们在全局样式中指定第个按钮前景色为绿色通过内联样式重写后它显示为蓝色:
结束语 本文简单
介绍了Silverlight 2中使用样式来封装Control控件观感对任何Control控件都可以使用全局样式进行封装
最新评论