使用Silverlight Toolkit中的主题(Theme)-阿里云开发者社区

使用Silverlight Toolkit中的主题(Theme)

2017-11-22 1299

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

在Silverlight Tookit 中提供了大约十种主题，大家可以根据自己的喜好，很容易就在项目中实现动态换肤效果。当然其官方还推荐了几个制作主题的插件，使用这些 Blend插件可以很方便的生成各种风格颜色的主题。

      好了，下面开始今天的正文。

     首先我们要下载该Tookit并将其中的相应DLL文件:Microsoft.Windows.Controls.Theming.dll加载到当前的示例中，另外就是相关的theme文件了，我已将10种主题文件放在了这个DEMO的themes 文件夹下：

并以“内容”方式作为"生成操作"的选项，如下：

我们可以直接在XAML文件中声明使用主题的元素，比如：

< UserControl

..
xmlns:theming ="clr-namespace:Microsoft.Windows.Controls.Theming;assembly=Microsoft.Windows.Controls.Theming"

>


< StackPanel Width ="100"
  theming:ImplicitStyleManager.ApplyMode ="Auto"
  theming:ImplicitStyleManager.ResourceDictionaryUri ="themes/.Light.xaml" >
         < Button Content ="Button" />
         < CheckBox Content ="CheckBox" />
         < RadioButton Content ="RadioButton" />
         < Slider />
         < ListBox />
         < ProgressBar Height ="15" Value ="30" />
         < controls:Expander ExpandDirection ="Down" />
     </ StackPanel >

</ UserControl >

这样在该StackPanel下的所有控件样式均应用了.Light主题。另外我们也可以在CS文件中对指定的控件设置相应的主题，比如本DEMO中所写的代码：

public Page()
{
    InitializeComponent();
     this .ThemeList.SelectionChanged += new SelectionChangedEventHandler(ThemeList_SelectionChanged);
     this .Loaded += new RoutedEventHandler(Page_Loaded);
}

void Page_Loaded( object sender, RoutedEventArgs e)
{
    ThemeList.Items.Add( new ComboBoxItem() { Name = " .Dark " , Content = " .Dark " , DataContext = " themes/.Dark.xaml " , IsEnabled = true });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " .Light " , Content = " .Light " , DataContext = " themes/.Light.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " RainierOrange " , Content = " RainierOrange " , DataContext = " themes/RainierOrange.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " RainierPurple " , Content = " RainierPurple " , DataContext = " themes/RainierPurple.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " RainierRadialBlue " , Content = " RainierRadialBlue " , DataContext = " themes/RainierRadialBlue.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " ShinyBlue " , Content = " ShinyBlue " , DataContext = " themes/ShinyBlue.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " ShinyDarkGreen " , Content = " ShinyDarkGreen " , DataContext = " themes/ShinyDarkGreen.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " ShinyDarkPurple " , Content = " ShinyDarkPurple " , DataContext = " themes/ShinyDarkPurple.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " ShinyDarkTeal " , Content = " ShinyDarkTeal " , DataContext = " themes/ShinyDarkTeal.xaml " });
    ThemeList.Items.Add( new ComboBoxItem() { Name = " ShinyRed " , Content = " ShinyRed " , DataContext = " themes/ShinyRed.xaml " });

    SetTheme(ThemeList.Items[ 0 ] as ComboBoxItem);
}

private void ThemeList_SelectionChanged( object sender, SelectionChangedEventArgs e)
{
    SetTheme(ThemeList.SelectedItem as ComboBoxItem);
}

// 设置相应的theme
void SetTheme(ComboBoxItem comboBoxItem)
{
     if (comboBoxItem != null )
    {
        ControlPage control = new ControlPage();
        Test.Children.Clear();
        Test.Children.Add(control);

        Uri uri = new Uri(comboBoxItem.DataContext.ToString(), UriKind.Relative);
        ImplicitStyleManager.SetResourceDictionaryUri(control, uri);
        ImplicitStyleManager.SetApplyMode(control, ImplicitStylesApplyMode.Auto);
        ImplicitStyleManager.Apply(control);
    }
}

上面代码中的ControlPage 类即是我们要加载的控件页对象，在该对象上声明了一些控件，然后将这些控件（集合）做为子控件加载到当前PAGE页面中的Stack元素(Test)中。这样我们运行一下这个DEMO,看一下各个主题的显示效果: