WPF 之 Resource Dictionary

来源：互联网发布：抓取数据的免费软件编辑：程序博客网时间：2024/05/22 02:07

众所周知WPF能实现真正的代码于设计界面分离，如果说这是WPF的一个亮点的话，那么这就要归功于 Resource Dictionary 。

下面我们看看如何在 WPF中使用Resource Dictionary：

1. 使用VS2010 新建一个WPF控件工程，命名为WPFResourceDemo

2. 删除默认新建的 usercontrol1 控件的文件

3. 添加 ResourceDictionary 文件，命名为WPFResourceDemo.xaml

4. 在 ResourceDictionary标签中加入style,下面的style功能为一个圆球button的样式

<Style x:Key="CircleButtonStyle" TargetType="{x:Type Button}">            <Setter Property="Border.BorderThickness" Value="1,1,1,1" />        <Setter Property="Border.CornerRadius" Value="3" />        <Setter Property="Height" Value="36" />        <Setter Property="Width" Value="36" />        <Setter Property="Content" Value="" />        <Setter Property="Background">            <Setter.Value>                <ImageBrush ImageSource="pack://siteoforigin:,,,./Image/Buttons/Btn_normal.png"/>            </Setter.Value>        </Setter>        <Setter Property="Template">            <Setter.Value>                <ControlTemplate TargetType="Button">                    <Grid>                        <Ellipse Fill="{TemplateBinding Background}"/>                        <Ellipse>                            <Ellipse.Fill>                                <RadialGradientBrush>                                    <GradientStop Offset="0" Color="#00000000"/>                                    <GradientStop Offset="0.88" Color="#00000000"/>                                    <GradientStop Offset="1" Color="#80000000"/>                                </RadialGradientBrush>                            </Ellipse.Fill>                        </Ellipse>                        <Ellipse Margin="10" x:Name="highlightCircle" >                            <Ellipse.Fill >                                <LinearGradientBrush >                                    <GradientStop Offset="0" Color="#50FFFFFF"/>                                    <GradientStop Offset="0.5" Color="#00FFFFFF"/>                                    <GradientStop Offset="1" Color="#50FFFFFF"/>                                </LinearGradientBrush>                            </Ellipse.Fill>                        </Ellipse>                        <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center"/>                    </Grid>                </ControlTemplate>            </Setter.Value>        </Setter>        <Style.Triggers>            <Trigger Property="IsMouseOver" Value="True">                <Setter Property="Background" >                    <Setter.Value>                        <ImageBrush ImageSource="pack://siteoforigin:,,,./Image/Buttons/Btn_rollover.png">                        </ImageBrush>                    </Setter.Value>                </Setter>            </Trigger>            <Trigger Property="IsFocused" Value="True">                <Setter Property="Background" >                    <Setter.Value>                        <ImageBrush ImageSource="pack://siteoforigin:,,,./Image/Buttons/Btn_rollover.png">                        </ImageBrush>                    </Setter.Value>                </Setter>            </Trigger>            <Trigger Property="IsPressed" Value="True">                <Setter Property="Background" >                    <Setter.Value>                        <ImageBrush ImageSource="pack://siteoforigin:,,,./Image/Buttons/Btn_pressed.png">                        </ImageBrush>                    </Setter.Value>                </Setter>            </Trigger>            <Trigger Property="IsEnabled" Value="False">                <Setter Property="Background" >                    <Setter.Value>                        <ImageBrush ImageSource="pack://siteoforigin:,,,./Image/Buttons/Btn_disabled.png">                        </ImageBrush>                    </Setter.Value>                </Setter>            </Trigger>        </Style.Triggers></Style>

注：1. pack://siteoforigin:,,,./Image/Buttons/Btn_normal.png表示在当前程序的相对路径下搜索:./Image/Buttons/Btn_normal.png

2. 图片要添加到项目相应的目录Image/Buttons下，将其类型设置为content, build action 选择总是copy

5. 编译该项目，显示编译成功

6. 添加一个WPF 应用程序的工程（用于测试WPFResourceDemo），命名为TestWPFResourceDemo

7. 找到TestWPFResourceDemo下面的App.xaml,在Application下添加引用WPFResourceDemo.xaml的节点

  <Application.Resources>        <ResourceDictionary>            <ResourceDictionary.MergedDictionaries>                <ResourceDictionary Source="pack://application:,,,/ WPFResourceDemo;component/WPFResourceDemo.xaml" />            </ResourceDictionary.MergedDictionaries>        </ResourceDictionary>    </Application.Resources>

8. 添加WPFResourceDemo项目为TestWPFResourceDemo项目的引用

9. 在TestWPFResourceDemo的 Window1.xaml 加入一个button（从工具箱中拖拽到Gird）

10. 选中button，并点击它的style属性（在属性窗口中），选择CircleButtonStyle（Static中）