背水一战 Windows 10 (10) - 资源: StaticResource, ThemeResource
作者：webabcd
介绍
背水一战 Windows 10 之 资源
- StaticResource
- ThemeResource
示例
1、演示“StaticResource”相关知识点
Resource/StaticResourceDemo.xaml
<Page
x:Class="Windows10.Resource.StaticResourceDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Resource"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" xmlns:common="using:Windows10.Common"> <!--
定义各种类型的 StaticResource（Resources 属性来自 FrameworkElement）
系统会在加载 xaml 的时候去查找并应用 StaticResource 指定的资源
StaticResource 需要先定义后引用，比如如果把下面这段 Page.Resources 代码放到 Grid 后面去定义，那么就会报错
-->
<Page.Resources>
<x:String x:Key="MyString">StaticResource 经常用于指定 Style 或 ControlTemplate 资源，参见 /Controls/UI 部分</x:String>
<x:Double x:Key="MyDouble1">24</x:Double>
<x:Double x:Key="MyDouble2">48</x:Double>
<Thickness x:Key="MyThickness">20,20,20,20</Thickness>
<common:Employee x:Key="CurrentEmployee" Name="wanglei" Age="35" IsMale="True"></common:Employee> <!--静态资源也可以用来定义控件-->
<Flyout x:Key="MyFlyout">
<StackPanel>
<TextBlock Text="我是 Flyout 中的内容" />
</StackPanel>
</Flyout>
</Page.Resources> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <!--
下面演示 StaticResource 的使用方法
--> <!--
StaticResource 的 3 种引用方式
-->
<TextBlock Name="textBlock0" Margin="5" Text="{StaticResource MyString}" />
<TextBlock Name="textBlock1" Margin="5" Text="{StaticResource ResourceKey=MyString}" />
<TextBlock Name="textBlock2" Margin="5">
<TextBlock.Text>
<StaticResource ResourceKey="MyString" />
</TextBlock.Text>
</TextBlock> <TextBlock Name="textBlock3" Margin="5" FontSize="{StaticResource MyDouble1}" Text="我是 TextBlock">
<!--
Style 或 ControlTemplate 内都可以引用静态资源
-->
<TextBlock.Style>
<Style TargetType="TextBlock">
<Setter Property="Padding" Value="{StaticResource MyThickness}" />
</Style>
</TextBlock.Style>
</TextBlock> <!--
动态改变引用的资源
-->
<Button Name="btnChangeStaticResource" Content="改变引用的 StaticResource" Margin="5" Click="btnChangeStaticResource_Click" /> <!--
设置 FrameworkElement 的 DataContext 为一个指定的静态资源
-->
<TextBlock Margin="5" DataContext="{StaticResource CurrentEmployee}" Text="{Binding Name}" />
<TextBlock Margin="5" DataContext="{StaticResource CurrentEmployee}" Text="{Binding Age}" />
<TextBlock Margin="5" DataContext="{StaticResource CurrentEmployee}" Text="{Binding IsMale}" /> <!--
引用指定的静态资源（此静态资源是一个控件）
-->
<Button Margin="5" Content="按我弹出 Flyout" Flyout="{StaticResource MyFlyout}" /> <!--
如果一个 FrameworkElement 要引用内部 Resources 的话，像下面这么写是会报错的，因为资源被先引用后定义了
-->
<!--
<TextBlock Margin="5" Text="我是 TextBlock" Foreground="{StaticResource MyTextBlockForeground}">
<TextBlock.Resources>
<SolidColorBrush x:Key="MyTextBlockForeground" Color="Red" />
</TextBlock.Resources>
</TextBlock>
--> <!--
如果一个 FrameworkElement 要引用内部 Resources 的话，需要像下面这么写（资源先定义后引用）
-->
<TextBlock Margin="5" Text="我是 TextBlock">
<TextBlock.Resources>
<SolidColorBrush x:Key="MyTextBlockForeground" Color="Red" />
</TextBlock.Resources>
<TextBlock.Foreground>
<StaticResource ResourceKey="MyTextBlockForeground" />
</TextBlock.Foreground>
</TextBlock> </StackPanel>
</Grid>
</Page>
Resource/StaticResourceDemo.xaml.cs
/*
* 演示“StaticResource”相关知识点
*/ using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls; namespace Windows10.Resource
{
public sealed partial class StaticResourceDemo : Page
{
public StaticResourceDemo()
{
this.InitializeComponent();
} private void btnChangeStaticResource_Click(object sender, RoutedEventArgs e)
{
// 获取 Application 中的资源
// (double)Application.Current.Resources["MyDouble1"]; // 获取关联 xaml 内的资源（本例中的资源定义在 xaml 中的 Page 下，所以用 this.Resources[""] 来获取）
if (textBlock3.FontSize == (double)this.Resources["MyDouble1"])
{
// 引用指定的资源
textBlock3.FontSize = (double)this.Resources["MyDouble2"];
}
else
{
textBlock3.FontSize = (double)this.Resources["MyDouble1"];
}
}
}
}
2、演示“ThemeResource”相关知识点
Resource/ThemeResourceDemo.xaml
<Page
x:Class="Windows10.Resource.ThemeResourceDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Resource"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <!--
ThemeResource 与 StaticResource 的区别是：ThemeResource 在运行时会根据主题的变化而重新计算
--> <!--
默认的主题资源的相关定义在如下位置（以我的开发环境为例）
1、C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\10.0.10586.0\Generic\generic.xaml
2、C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\10.0.10586.0\Generic\themeresources.xaml 注：默认的主题资源不会复制到应用程序中，这些资源字典在内存中作为 Windows 运行时本身的一部分存在
--> <Page.Resources> <ResourceDictionary>
<!--
通过 ResourceDictionary 内的 ResourceDictionary.ThemeDictionaries 内的 ResourceDictionary 来定义不同主题的资源
在资源中定义的主题分为 3 种："Light", "Dark" 和 "HighContrast"，其中 High Contrast（高对比度模式） 不常用，就不详细介绍了
-->
<ResourceDictionary.ThemeDictionaries> <!--
Default 主题，对应 ElementTheme.Dark 或 ApplicationTheme.Dark
-->
<ResourceDictionary x:Key="Default">
<!--
这里摘自 themeresources.xaml 中的部分定义，如果要覆盖其中的定义就自己再定义同名资源即可
-->
<SolidColorBrush x:Key="ApplicationPageBackgroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="SystemControlBackgroundAccentBrush" Color="{ThemeResource SystemAccentColor}" /> <!--
这是系统级资源，不在 themeresources.xaml 内，其含义是在“设置”->“个性化”->“颜色”中选择的主题色，当然也可以这样重新定义
-->
<Color x:Key="SystemAccentColor">#FFFF0000</Color>
</ResourceDictionary> <!--
HighContrast 主题，不常用，就不详细介绍了
-->
<ResourceDictionary x:Key="HighContrast">
<!--
这里摘自 themeresources.xaml 中的部分定义，其引用的一些颜色资源来自系统级，比如 SystemColorWindowColor 或 SystemColorButtonFaceColor 之类的，他们不在 themeresources.xaml 内
比如在“设置”->“轻松使用”->“高对比度”中目前可以设置 4 中不同的高对比度主题，每一种对应的颜色资源都不一样
-->
<SolidColorBrush x:Key="ApplicationPageBackgroundThemeBrush" Color="{ThemeResource SystemColorWindowColor}" />
<SolidColorBrush x:Key="SystemControlBackgroundAccentBrush" Color="{ThemeResource SystemColorButtonFaceColor}" />
</ResourceDictionary> <!--
Light 主题，对应 ElementTheme.Light 或 ApplicationTheme.Light
-->
<ResourceDictionary x:Key="Light">
<!--
这里摘自 themeresources.xaml 中的部分定义，如果要覆盖其中的定义就自己再定义同名资源即可
-->
<SolidColorBrush x:Key="ApplicationPageBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="SystemControlBackgroundAccentBrush" Color="{ThemeResource SystemAccentColor}" /> <!--
这是系统级资源，不在 themeresources.xaml 内，其含义是在“设置”->“个性化”->“颜色”中选择的主题色，当然也可以这样重新定义
-->
<Color x:Key="SystemAccentColor">#FF00FF00</Color>
</ResourceDictionary> </ResourceDictionary.ThemeDictionaries>
</ResourceDictionary> </Page.Resources> <Grid Background="Transparent"> <StackPanel Name="panel" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Margin="10 0 10 10"> <TextBlock Margin="5" Name="lblMsg" Foreground="Blue" /> <TextBlock Margin="5" Text="Microsoft HoloLens全息眼镜由Microsoft 公司于北京时间2015年1月22日凌晨与Window10同时发布。" Foreground="Blue" /> <StackPanel Width="200" Height="100" Margin="5" HorizontalAlignment="Left" Background="{ThemeResource SystemControlBackgroundAccentBrush}" /> <!--动态变换主题，引用的主题资源会重新计算-->
<Button Name="btnChangeTheme" Click="btnChangeTheme_Click" Margin="5">变换主题</Button> </StackPanel> </Grid>
</Page>
Resource/ThemeResourceDemo.xaml.cs
/*
* 演示“ThemeResource”相关知识点
*
*
* 1、主题共有两种类别：Light 和 Dark，子会继承父的主题类别
* 2、Application 级别指定 Theme 的话，在 App.xaml 中做如下声明 <Application RequestedTheme="Dark"></Application>
* 3、FrameworkElement 级别指定 Theme 的话，则指定 FrameworkElement.RequestedTheme 即可
*
*
* Application.Current.RequestedTheme - 获取或设置 Application 级别的主题（ApplicationTheme 枚举：Light, Dark）
* FrameworkElement.RequestedTheme - 获取或设置 FrameworkElement 级别的主题（ElementTheme 枚举：Default, Light, Dark）
* 注：ElementTheme 比 ApplicationTheme 多了一个 Default，其含义是当 ElementTheme 为 Default 时，其实际主题为 application 级主题
*/ using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls; namespace Windows10.Resource
{
public sealed partial class ThemeResourceDemo : Page
{
public ThemeResourceDemo()
{
this.InitializeComponent(); DisplayMessage();
} private void DisplayMessage()
{
// 当前 Application 级别的 Theme
lblMsg.Text = "application theme: " + Application.Current.RequestedTheme.ToString();
lblMsg.Text += Environment.NewLine; // 当前 panel 的 Theme
lblMsg.Text += "FrameworkElement theme: " + panel.RequestedTheme.ToString();
} // 动态变换主题，引用的主题资源会重新计算
private void btnChangeTheme_Click(object sender, RoutedEventArgs e)
{
if (panel.RequestedTheme == ElementTheme.Default) // 未指定 panel 的主题，则 panel 主题同 application 级主题
{
if (Application.Current.RequestedTheme == ApplicationTheme.Dark) // application 是 Dark 主题
{
panel.RequestedTheme = ElementTheme.Light;
}
else
{
panel.RequestedTheme = ElementTheme.Dark;
}
}
else if (panel.RequestedTheme == ElementTheme.Dark) // panel 是 Dark 主题
{
panel.RequestedTheme = ElementTheme.Light;
}
else // panel 是 Light 主题
{
panel.RequestedTheme = ElementTheme.Dark;
} DisplayMessage();
}
}
}
App.xaml
<Application
x:Class="Windows10.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10" RequestedTheme="Dark">
<!--
上面的 RequestedTheme 被我设置为 Dark 了，关于主题的相关知识点请参见：/Resource/ThemeResourceDemo.xaml
--> </Application>
OK
[源码下载]