样式--资源

它是对于特定娄型的可视化元素,应该可以直接说是针对控件的一种可重用的属性设置列表,这样对于需要设置相同属性值的同类型的多个控件来讲是大大提高效率,我们不必要为每个控件做重复的动作。   针对一个style  对于同类型的控件可以重复引用

一个TextBox的样式示例,我们希望通过引用资源中的样式,使得页面上的所有TextBox控件都具有统一的外观,而且都只能输入数字

  • <phone:PhoneApplicationPage.Resources>  
  •     <!--不带key的样式,应用于所有TextBlock元素-->  
  •     <Style TargetType="TextBlock">  
  •         <Setter Property="FontSize" Value="40"/>  
  •         <Setter Property="Foreground" Value="Yellow"/>  
  •     </Style>   
  •     <!--带key的样式,只有引用该资源的元素才应用-->  
  •     <Style x:Key="MyTextBoxStyle" TargetType="TextBox">  
  •         <Setter Property="FontSize" Value="40"/>                                                        //每个都对应 相应类型控件 的  一个属性
  •         <Setter Property="Foreground" Value="Blue"/>  
  •         <Setter Property="InputScope">  
  •             <Setter.Value>  
  •                 <InputScope>  
  •                     <InputScopeName NameValue="Number"/>  
  •                 </InputScope>  
  •             </Setter.Value>  
  •         </Setter>  
  •     </Style>  
  • </phone:PhoneApplicationPage.Resources>  
  •         <TextBox Grid.Column="1" Grid.Row="0" Style="{StaticResource MyTextBoxStyle}" />     //引用对应类型 的key的  style
  •         <TextBox Grid.Column="1" Grid.Row="1" Style="{StaticResource MyTextBoxStyle}" />  
  •         <TextBox Grid.Column="1" Grid.Row="2" Style="{StaticResource MyTextBoxStyle}" /> 
    •         <TextBox Grid.Column="1" Grid.Row="3"/>                               //引用没有定义的对应类型的 style
    •         <TextBox Grid.Column="1" Grid.Row="4"/> 

     

     

    样式在资源中有两种声明方式,一种是带键值,一种是不带键值的。 1、带key的样式,不会自动应用到元素/控件上,除非元素的Style属性引用了该资源的键; 2、不带键的样式资源,将自动应用于当前页面(如果资源声明在当前页)中的所有同类型的元素。
    所以,在上例中,你会看到左边的一列TextBlock,它们都没有显式设置Style属性,但它们都一致引用了第一个样式,因为该样式是不带键的。

 

 

 

 

 

 

 

 

//////////////////////////////

转自另一个博客

Windows Phone 7开发学习(4):Style样式的四种使用

时间:2012-04-17 19:41来源:博客园 作者:徐明祥 点击:
303次

在Web开发中,我们通过CSS来控制页面元素的样式,一般常用三种方式: 1. 内联样式表:即直接设置元素的style属性 2. 嵌入样式表:即在html页面上写一个 代码段,然后设置元素的class 属性 3. 外部样式表:即写一个独立的.css 文件,然后再html页面上引入该文件,然后设置元素的class属性 具体如何操作,这里就不说了。不懂
  

  在Web开发中,我们通过CSS来控制页面元素的样式,一般常用三种方式:

  1. 内联样式表:即直接设置元素的style属性

  2. 嵌入样式表:即在html页面上写一个

代码段,然后设置元素的class 属性

  3. 外部样式表:即写一个独立的.css 文件,然后再html页面上引入该文件,然后设置元素的class属性

  具体如何操作,这里就不说了。不懂的去百度一把,绝对会出现一大坨。

  同样的,在WP7开发中,也有类似以上几种方式设置控件的样式——开发平台可以千差万别,编程思想都是大同小异的。

  一,内联样式:

  直接设置控件的 Height 、Width、Foreground、HorizontalAlignment、VerticalAlignment 等属性。以设置一个Botton控件的样式为例,如:

    <Grid x:Name="ContentPanel" >             <Button Content="Button" Name="btnDemo"                      Height="72"                      Width="150"                      Foreground="White"                      Background="Blue"                      HorizontalAlignment="Left"                      VerticalAlignment="Top"                      Margin="170,132,0,0"                      Grid.Row="1" />           </Grid>

  这种方式比较简单,但是代码不能复用。

  二,嵌入样式:

  在页面<phone:PhoneApplicationPage.Resources> 节点下添加样式,然后在需要的控件上设置Style 属性。还是以上面那个Botton控件为例。

  1,在页面<phone:PhoneApplicationPage.Resources> <phone:phoneapplicationpage.resources>节点下添加一个Key值叫“BtnStyle”的样式

  <phone:PhoneApplicationPage.Resources>         <Style x:Key="BtnStyle"  TargetType="Button">             <Setter Property="Height" Value="72" />             <Setter Property="Width" Value="150" />             <Setter Property="Foreground" Value="White" />             <Setter Property="Background" Value="Blue" />             <Setter Property="HorizontalAlignment" Value="Left" />             <Setter Property="VerticalAlignment" Value="Top" />         </Style>     </phone:PhoneApplicationPage.Resources>

  2, 设置Botton 控件的Style 属性为 "{StaticResource BtnStyle}"

   <Grid x:Name="ContentPanel" >             <Button Content="Button" Name="btnDemo"                     Style="{StaticResource BtnStyle}"                     Margin="170,132,0,0"  />    </Grid>

  解释一下,TargetType="Button" 指定了该样式适用于Botton类型的控件,Key="BtnStyle" 如果不设置该值,则该样式将适用于所有的Botton 控件,而设置了其值为“BtnStyle”,则只用于设置了 Style="{StaticResource BtnStyle}" 的Botton控件。这就好比CSS中的元素选择器和类选择器。

  这种方式可以使得单个页面上的控件能够复用一个样式,比第一种方式面向对象了一步。

  三,外联样式:

  1,新建一个.xaml资源文件,如/Resources/BtnStyle.xaml

  2, 在BtnStyle.xaml文件里编写样式代码

BtnStyle.xaml:  <ResourceDictionary   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   xmlns:System="clr-namespace:System;assembly=mscorlib">     <Style x:Key="BtnStyle" TargetType="Button">         <Setter Property="Height" Value="72" />         <Setter Property="Width" Value="150" />         <Setter Property="Foreground" Value="White" />         <Setter Property="Background" Value="Blue" />         <Setter Property="HorizontalAlignment" Value="Left" />         <Setter Property="VerticalAlignment" Value="Top" />     </Style> </ResourceDictionary>

  3,在App.xaml文件的<Application.Resources> 或者普通页面的<phone:PhoneApplicationPage.Resources>或者用户控的 <UserControl.Resources>  节点下添加相应的ResourceDictionary,配置引用BtnStyle.xaml:

app.xaml:    <Application.Resources>                    <ResourceDictionary>             <ResourceDictionary.MergedDictionaries>                 <ResourceDictionary Source="Resources/BtnStyle.xaml"/>             <!--<ResourceDictionary Source="Resources/BtnStyle2.xaml"/>                 <ResourceDictionary Source="Resources/BtnStyle3.xaml"/>-->             </ResourceDictionary.MergedDictionaries>         </ResourceDictionary>              </Application.Resources> 或者MainPage.xaml: <phone:PhoneApplicationPage.Resources>
        <ResourceDictionary>             <ResourceDictionary.MergedDictionaries>                 <ResourceDictionary Source="Resources/BtnStyle.xaml"/>             </ResourceDictionary.MergedDictionaries>         </ResourceDictionary>
</phone:PhoneApplicationPage.Resources>

  <ResourceDictionary.MergedDictionaries>节点下可以添加多个资源文件

  这种方式相比前面两种使得样式和结构又更进一步分离了。

  在App.xam引用,是全局的,可以使得一个样式可以在整个应用程序中能够复用。在普通页面中引用只能在当前页面上得到复用。

  4, 设置Botton 控件的Style 属性为"{StaticResource BtnStyle}" 和上面的一样。

  四,用C#代码动态加载资源文件并设置样式

  1,新建资源文件:同上面的1,2两步。

  2,在后台编写代码

     ResourceDictionary resourceDictionary = new ResourceDictionary();

     Application.LoadComponent(resourceDictionary, new Uri("/PhoneApp1;component/Resources/BtnStyle.xaml", UriKind.Relative));      Application.Current.Resources.MergedDictionaries.Add(resourceDictionary);      //以上几行代码表示将我们自定义的样式加载到应用程序的资源字典中。     this.btnDemo.SetValue(Button.StyleProperty, Application.Current.Resources["BtnStyle"]);

   本文来自徐明祥的博客,原文地址:http://www.cnblogs.com/xumingxiang/archive/2012/03/23/2413342.html

 

 

posted on 2012-11-08 11:55  Top@Gragon  阅读(236)  评论(0编辑  收藏  举报

导航