背水一战 Windows 10 (10) - 资源: StaticResource, ThemeResource
背水一战 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
[源码下载]