WPF实现动态换肤功能（一）

转自：xsi640的WPF实现动态换肤功能（一）

大家都使用过QQ的皮肤功能吧，今天，我们来讲一下如何使用WPF实现换肤效果。

如何实现换肤呢，对于复杂的换肤操作，如，更换按钮样式、窗口样式等，我们需要写多个资源字典来表示不同的皮肤，通过动态加载不同的资源字典来实现换肤的效果；对于简单的换肤操作，如更改背景颜色、设置窗体透明度，这种换肤操作，我们就不能使用上面的方法了，这个时候，我们只要在一个全局对象中添加几个属性，如背景颜色、前景颜色、窗体透明度等，然后，再绑定这几个属性就能达到我们想要的效果。

本文，会介绍第一种换肤方式，即使用资源字典换肤，首先，看我们实现的效果：

效果是不是很酷吖？看代码：

MainWindow.xaml

查看源代码

打印 帮助

01	<Window x:Class="WpfSkin1.MainWindow"

02	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

03	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

04	Title="MainWindow" Height="233" Width="457">

05

<Grid>

06	<Button Content="打开新窗口" Height="23" HorizontalAlignment="Left" Margin="347,157,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="button1_Click">

07	<Button.ContextMenu>

08	<ContextMenu>

09	<MenuItem x:Name="menuAero" Header="Aero" Click="menuAero_Click"/>

10	<MenuItem x:Name="menuRoyale" Header="Royale" Click="menuRoyale_Click"/>

11	<MenuItem x:Name="menuLuna" Header="Luna" Click="menuLuna_Click"/>

12	</ContextMenu>

13	</Button.ContextMenu>

14

</Button>

15	<TextBox Height="23" HorizontalAlignment="Left" Margin="12,12,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" />

16	<Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="148,12,0,0" Name="button2" VerticalAlignment="Top" Width="75" />

17	<ListBox Height="100" HorizontalAlignment="Left" Margin="12,41,0,0" Name="listBox1" VerticalAlignment="Top" Width="120">

18	<ListBoxItem Content="123" />

19	<ListBoxItem Content="123" />

20	<ListBoxItem Content="123" />

21	</ListBox>

22	<ComboBox Height="22" HorizontalAlignment="Left" Margin="148,41,0,0" Name="comboBox1" VerticalAlignment="Top" Width="183">

23	<ComboBoxItem Content="123" />

24	<ComboBoxItem Content="123" />

25	<ComboBoxItem Content="123" />

26	</ComboBox>

27	<CheckBox Content="CheckBox" Height="16" HorizontalAlignment="Left" Margin="241,15,0,0" Name="checkBox1" VerticalAlignment="Top" />

28	<RadioButton Content="RadioButton" Height="16" HorizontalAlignment="Left" Margin="310,15,0,0" Name="radioButton1" VerticalAlignment="Top" />

29	<ProgressBar Height="12" HorizontalAlignment="Left" Margin="148,90,0,0" Name="progressBar1" VerticalAlignment="Top" Width="183" />

30	<Slider Height="21" HorizontalAlignment="Left" Margin="148,120,0,0" Name="slider1" VerticalAlignment="Top" Width="183" />

31

</Grid>

32

</Window>

MainWindow.xaml.cs

查看源代码

打印 帮助

01	public partial class MainWindow : Window

02

{

03	public MainWindow()

04

{

05	InitializeComponent();

06

}

07

08	private void button1_Click(object sender, RoutedEventArgs e)

09

{

10	MainWindow win = new MainWindow();

11	win.Show();

12

}

13

14	private void menuAero_Click(object sender, RoutedEventArgs e)

15

{

16	Application.Current.Resources.MergedDictionaries.Clear();   //清除现有资源

17

18	//获取要应用的资源字典

19	ResourceDictionary resource =

20	(ResourceDictionary)Application.LoadComponent(

21	new Uri("/PresentationFramework.Aero, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35;component/themes/aero.normalcolor.xaml", UriKind.Relative));

22	//将资源字典合并到当前资源中

23	Application.Current.Resources.MergedDictionaries.Add(resource);

24

}

25

26	private void menuRoyale_Click(object sender, RoutedEventArgs e)

27

{

28	Application.Current.Resources.MergedDictionaries.Clear();

29

30	ResourceDictionary resource =

31	(ResourceDictionary)Application.LoadComponent(

32	new Uri("/PresentationFramework.Royale, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35;component/themes/royale.normalcolor.xaml", UriKind.Relative));

33	Application.Current.Resources.MergedDictionaries.Add(resource);

34

}

35

36	private void menuLuna_Click(object sender, RoutedEventArgs e)

37

{

38	Application.Current.Resources.MergedDictionaries.Clear();

39

40	ResourceDictionary resource =

41	(ResourceDictionary)Application.LoadComponent(

42	new Uri("/PresentationFramework.Luna, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35;component/themes/luna.normalcolor.xaml", UriKind.Relative));

43	Application.Current.Resources.MergedDictionaries.Add(resource);

44

}

45

}

代码很简单，清除现有资源，获取要应用的资源字典即写好的样式文件，将当前的资源字典加入到当前的资源下，WPF会自动应用，界面就变成我们想要的了。后面，我会介绍第二种换肤方式，动态绑定的方式，第二种方式，主要用于，皮肤的颜色、透明度由用户自定义，这种灵活多变的换肤效果。

注：这里我使用的是微软给我们提供的几个内嵌资源，由于我的系统是2003，如果是win7或者vista会有更炫的效果。如果是您自己写的资源字典，只要将uri路径改成您自己的资源文件即可。

代码下载

Greased Lightbox

 

→ ← + - ↻

 

读取图片

按任意键来取消

图片不可读