Fun with Silverlight2.0系列之三 -- Skinnable动态换肤效果

前段时间国外的大牛为Silverlight2定义了四套皮肤,效果让人称奇,美中不足的是四个皮肤不能动态切换,
所以我借花献佛将这四套皮肤放在一起实现了动态切换也就是换肤的效果。
开发平台:VS2008 + Silverlight2

Live Demo

效果图:

选择Bubbly皮肤


选择Flat皮肤


选择Red皮肤


选择Rough皮肤


实现技术主要是利用两个小技巧,
首先是ResourceDictionary,ResourceDictionary中文译做资源字典,顾名思义,就是一个用来存放资源的集合。
ResourceDictionary元素中可以直接嵌入资源,在资源文件里定义
ControlTemplate,因为所有的皮肤其实呈现的都是同样的控件,
所以将所有的控件写在里面便于实现元素的重用,然后所有控件的Style属性都和相应的Style动态绑定。

资源文件

保存这个资源文件为generic.xaml并设置为嵌入式资源。通过删除Custom Tool属性值并设置Build Action为Resource。
这样就可以动态的定义样式和资源文件里的控件模板绑定了。

下面说一说动态定义样式的小技巧,那就是依赖属性(DependencyProperty),它其实是WPF的核心技术点之一,和DependencyObject配合,
提供了WPF中基本的数据存储、访问和通知的机制,具体可参见MSDN上的解说DependencyProperty
这篇博客也说的不错WPF中如何实现数据与表示分离。


属性绑定