备案控制台
探索云世界
开发者社区 开发与运维 文章 正文

WPF 文件级资源（类似与使用CSS文件，然后引用CSS文件）

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

1. 文件级资源：定义在资源字典的XAML文件中，添加“资源字典（Resource Dictionary）”类型的项

文件名为Dictionary1.xaml

ExpandedBlockStart.gif 
1 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
2     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
3     <SolidColorBrush Color="Red" x:Key="redBrush"></SolidColorBrush>
4 </ResourceDictionary>

以下是WIndow1.xaml文件

ExpandedBlockStart.gif
复制代码 
 1 <Window x:Class="WpfWindowAndDialog.Window1"
 2     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4     Title="Window1" Height="300" Width="300" WindowStartupLocation="CenterScreen">
 5     <Window.Resources>
 6         <ResourceDictionary Source="Dictionary1.xaml"></ResourceDictionary>
 7     </Window.Resources>
 8     <Grid>
 9         <Button Height="23" HorizontalAlignment="Left" Background="{StaticResource ResourceKey=redBrush}"  
10　　　　  Margin="10,10,0,0" Name="button1" VerticalAlignment="Top"  >Button</Button>
11     </Grid>
12 </Window>
复制代码

类似与使用CSS文件，然后引用CSS文件.可以有多个资源文件，这样便于管理

2.对象（控件）级资源：定义在某个ContentControl中，作为其子容器、子控件共享的资源

定义在资源字典的XAML文件中，添加“资源字典（Resource Dictionary）”类型的项

文件名为Dictionary1.xaml

ExpandedBlockStart.gif 
1 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
2     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
3     <SolidColorBrush Color="Red" x:Key="redBrush"></SolidColorBrush>
4 </ResourceDictionary>

Window2.xaml文件

ExpandedBlockStart.gif
复制代码 
<Window x:Class="WpfWindowAndDialog.Window2"

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

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

Title="Window1" Height="300" Width="300" WindowStartupLocation="CenterScreen">  
<Grid>
<Grid.Resources>
<ResourceDictionary Source="Dictionary1.xaml"></ResourceDictionary>
</Grid.Resources>
<Button Height="23" HorizontalAlignment="Left" Background="{StaticResource ResourceKey=redBrush}"  Margin="10,10,0,0" Name="button1" VerticalAlignment="Top" Width="75" >Button</Button>
</Grid>
</Window>
复制代码

3.将图形作为一种资源来使用

ExpandedBlockStart.gif
复制代码 
 1 <Window x:Class="WpfWindowAndDialog.Window3"
 2     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4     Title="Window1" Height="300" Width="300" WindowStartupLocation="CenterScreen">  
 5     <Window.Resources>
 6         <Ellipse  x:Key="myEllipse"  Fill="Yellow" Height="100"/>
 7     </Window.Resources>
 8     <StackPanel>
 9           <StaticResource ResourceKey="myEllipse"/>
10      </StackPanel>
11 </Window>
复制代码

(2)重用绘图资源

ExpandedBlockStart.gif
复制代码 
 1 <Window x:Class="WpfWindowAndDialog.Window4"
 2     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4     Title="Window1" Height="300" Width="300" WindowStartupLocation="CenterScreen">  
 5     <Window.Resources>
 6         <GeometryDrawing x:Key="drawing" Brush="Green">
 7             <GeometryDrawing.Geometry>
 8                 <EllipseGeometry RadiusX="200" RadiusY="10"/>
 9             </GeometryDrawing.Geometry>
10         </GeometryDrawing>
11         <DrawingBrush x:Key="dbrush" Drawing="{StaticResource drawing}"></DrawingBrush>
12     </Window.Resources>
13     <StackPanel>
14         <Rectangle Width="250" Height="50" Fill="{StaticResource dbrush}">
15         </Rectangle>
16         <Rectangle Width="250" Height="50" Fill="{StaticResource dbrush}">
17         </Rectangle>
18     </StackPanel>
19 </Window>
复制代码

4.皮肤与主题

两款非常简单的皮肤文件

ExpandedBlockStart.gif
复制代码 
1 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
2     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
3     <Style TargetType="{x:Type Button}">
4         <Setter Property="Background" Value="Blue"/>
5         <Setter Property="Foreground" Value="White"/>
6     </Style>
7     <SolidColorBrush x:Key="appBackground" Color="#EEF"/>
8 </ResourceDictionary>
复制代码
ExpandedBlockStart.gif
复制代码 
1 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
2     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
3     <Style TargetType="{x:Type Button}">
4         <Setter Property="Background" Value="Green"/>
5         <Setter Property="Foreground" Value="White"/>
6     </Style>
7     <SolidColorBrush x:Key="appBackground" Color="#EEF"/>
8 </ResourceDictionary>
复制代码

引用皮肤的文件

ExpandedBlockStart.gif
复制代码 
 1 <Window x:Class="Chapter12.<Window x:Class="Chapter12.Window1"
 2     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4     Title="Window1" Height="300" Width="300" Background="{DynamicResource appBackground}">
 5     <Grid>
 6         <Grid.RowDefinitions>
 7             <RowDefinition/>
 8             <RowDefinition/>
 9             <RowDefinition/>
10         </Grid.RowDefinitions>
11         <RadioButton x:Name="chooseGreenSkin" Grid.Row="0" Content="Green"/>
12         <RadioButton x:Name="chooseBlueSkin" Grid.Row="1" Content="Blue"/>
13         <Button Grid.Row="2">Hello</Button>
14     </Grid>
15 </Window>"
16     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
17     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
18     Title="Window1" Height="300" Width="300" Background="{DynamicResource appBackground}">
19     <Grid>
20         <Grid.RowDefinitions>
21             <RowDefinition/>
22             <RowDefinition/>
23             <RowDefinition/>
24         </Grid.RowDefinitions>
25         <RadioButton x:Name="chooseGreenSkin" Grid.Row="0" Content="Green"/>
26         <RadioButton x:Name="chooseBlueSkin" Grid.Row="1" Content="Blue"/>
27         <Button Grid.Row="2">Hello</Button>
28     </Grid>
29 </Window>
复制代码

Window.xaml的后台代码

ExpandedBlockStart.gif
复制代码 
 1 using System;
 2 using System.Collections.ObjectModel;
 3 using System.Windows;
 4 
 5 namespace Chapter12
 6 {
 7     /// <summary>
 8     /// Window1.xaml 的交互逻辑
 9     /// </summary>
10     public partial class Window1 : Window
11     {
12         public Window1()
13         {
14             InitializeComponent();
15             EnsureSkins();
16             chooseBlueSkin.Click += SkinChanged;
17             chooseGreenSkin.Click+=SkinChanged;
18         }
19 
20         static ResourceDictionary greenSkin;
21         static ResourceDictionary blueSkin;
22 
23         void EnsureSkins()
24         {
25             if(greenSkin == null)
26             {
27                 greenSkin = new ResourceDictionary();
28                 greenSkin.Source = new System.Uri("GreenSkin.xaml", UriKind.Relative);
29 
30                 blueSkin = new ResourceDictionary();
31                 blueSkin.Source = new System.Uri("BlueSkin.xaml", UriKind.Relative);
32             }
33         }
34 
35         void SkinChanged(object o, EventArgs e)
36         {
37             if (chooseGreenSkin.IsChecked.Value)
38             {
39                 ApplySkin(greenSkin);
40             }
41             else
42             {
43                 ApplySkin(blueSkin);
44             }
45         }
46 
47         void ApplySkin(ResourceDictionary newSkin)
48         {
49             Collection<ResourceDictionary> appM = Application.Current.Resources.MergedDictionaries;
50             if (appM.Count != 0)
51             {
52                 appM.Remove(appM[0]);
53             }
54             appM.Add(newSkin);
55          
56         }
57     }
58 }
复制代码



本文转自Work Hard Work Smart博客园博客，原文链接：http://www.cnblogs.com/linlf03/archive/2011/07/30/2122149.html，如需转载请自行联系原作者

文章标签：
前端开发
C#
容器
关键词：
CSS引用
wpf资源
CSS文件
CSS资源
wpf引用
zting科技
目录
相关文章
jerrywangsap
|
6月前
|
前端开发 JavaScript Java
如何将 css 从 Application bundle 资源中剥离出来
如何将 css 从 Application bundle 资源中剥离出来
jerrywangsap
60 0
jerrywangsap
|
6月前
|
前端开发 UED
关于 Web 应用的内联 css 和 scss 文件里的 var 关键字用法
关于 Web 应用的内联 css 和 scss 文件里的 var 关键字用法
jerrywangsap
75 0
王同学睡醒了
|
4月前
|
前端开发
解决VScode在保存less文件时，自动生成对应的css文件以及安装Easy less之后，计算式子不显示结果的问题
解决VScode在保存less文件时，自动生成对应的css文件以及安装Easy less之后，计算式子不显示结果的问题
王同学睡醒了
40 1
童小纯
|
2月前
|
Web App开发 JSON 前端开发
Webpack【搭建Webpack环境、Webpack增加配置文件、Webpack中使用Loader、Webpack分离CSS文件 】(一)-全面详解（学习总结---从入门到深化）
Webpack【搭建Webpack环境、Webpack增加配置文件、Webpack中使用Loader、Webpack分离CSS文件 】(一)-全面详解（学习总结---从入门到深化）
童小纯
51 0
童小纯
|
3月前
|
JSON 前端开发 JavaScript
Webpack【搭建Webpack环境、Webpack增加配置文件、Webpack中使用Loader、Webpack分离CSS文件 】(一)-全面详解（学习总结---从入门到深化）（上）
Webpack【搭建Webpack环境、Webpack增加配置文件、Webpack中使用Loader、Webpack分离CSS文件 】(一)-全面详解（学习总结---从入门到深化）
童小纯
56 0
老码识途
|
2月前
|
C#
浅谈WPF之样式与资源
WPF通过样式，不仅可以方便的设置控件元素的展示方式，给用户呈现多样化的体验，还简化配置，避免重复设置元素的属性，以达到节约成本，提高工作效率的目的，样式也是资源的一种表现形式。本文以一个简单的小例子，简述如何设置WPF的样式以及资源的应用，仅供学习分享使用，如有不足之处，还请指正。
老码识途
42 0
web前端圈
|
3月前
|
前端开发 程序员 容器
CSS样式文件和class类名命名规范参考
CSS样式文件和class类名命名规范参考
web前端圈
27 0
前方一片光明
|
8月前
|
前端开发 小程序
微信小程序系列——无缝引入CSS或者WXML文件
微信小程序系列——无缝引入CSS或者WXML文件
前方一片光明
177 0
童小纯
|
3月前
|
Web App开发 前端开发 JavaScript
Webpack【搭建Webpack环境、Webpack增加配置文件、Webpack中使用Loader、Webpack分离CSS文件 】(一)-全面详解（学习总结---从入门到深化）（下）
Webpack【搭建Webpack环境、Webpack增加配置文件、Webpack中使用Loader、Webpack分离CSS文件 】(一)-全面详解（学习总结---从入门到深化）
童小纯
26 0
邹邹很busy。
|
8月前
|
前端开发
css--引用样式、选择器
css--引用样式、选择器
邹邹很busy。
40 0

热门文章

最新文章

  • 1
    基于Material Design风格开源、易用、强大的WPF UI控件库
  • 2
    《手把手教你》系列技巧篇（十八）-java+ selenium自动化测试-元素定位大法之By css中卷（详细教程）
  • 3
    WPF学习小记
  • 4
    【CSS进阶】使用CSS gradient制作绚丽渐变纹理背景效果（下）
  • 5
    《手把手教你》系列技巧篇（十七）-java+ selenium自动化测试-元素定位大法之By css上卷（详细教程）
  • 6
    前端代码整洁与规范之CSS篇
  • 7
    《手把手教你》系列技巧篇（十九）-java+ selenium自动化测试-元素定位大法之By css下卷（详细教程）
  • 8
    Tailwind CSS如何在vue项目中使用
  • 9
    【掰开揉碎】详解 CSS3 Grid 布局
  • 10
    【前端设计】HTML+CSS+JavaScript基本特性
  • 1
    CSS字型
    23
  • 2
    css元素
    13
  • 3
    如何使用代理IP通过HTML和CSS采集数据
    12
  • 4
    《CSS 简易速速上手小册》第6章：高级 CSS 技巧（2024 最新版）
    15
  • 5
    CSS cursor的一些相关属性
    12
  • 6
    css怎样设置下滑线？
    10
  • 7
    css中几种隐藏元素的方法
    10
  • 8
    js实用方法记录-动态加载css/js
    12
  • 9
    【CSS进阶】使用CSS gradient制作绚丽渐变纹理背景效果（下）
    43
  • 10
    【CSS进阶】巧用伪元素before和after制作绚丽效果（下）
    11

    • 相关课程

    更多
  • CSS 快速掌握
  • 零基础学前端HTML+CSS
  • 前端开发CSS基础

    • 相关电子书

    更多
  • 零基础CSS入门教程
  • 低代码开发师（初级）实战教程
  • 阿里巴巴DevOps 最佳实践手册

    • 相关实验场景

    更多
  • 前端开发基础3：CSS3常见显示属性
  • CSS基础教程
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）