WP7页面的样式设置

       如果根元素是Page，则是<Page.Resources>，不要以为是特殊用法，Resources只是UserControl的一个属性，这是在给属性用复杂方法赋值，这样的样式就是全局的样式， TargetType指定目标控件类型（SL中样式必须指定目标类型，而不像CSS中那样可以弱类型），x:Key为样式的名字（必须唯一），Silverlight中样式必须指定目标控件类型。

    在控件中通过Style=“{StaticResource WarnBtn}”来引用样式

    Style也可以不设定x:Key，这样表示对于所有这种类型的控件设置这个样式

和CSS类似，内层范围的控件自动继承上层范围控件的样式；同样内联覆盖页面级，页面级覆盖全局级。

在根节点下增加

1  <UserControl.Resources>

2         <Style TargetType="Button" x:Key="yangshi">

3             <SetterProperty="Foreground" Value="Red"></Setter>

4         </Style>

5 </UserControl.Resources>

6 

7  <Button Content="样式" Style="{StaticResource yangshi}">

8           

9         </Button>

下面的效果与上面的效果相同；在控件上直接给控件的的样式赋值

1  <Button Content="样式">

2             <Button.Foreground >

3                red

4             </Button.Foreground>

5         </Button>

样式是可以继承的：

1  <Style TargetType="Button" x:Key="yangshi">

2         <Setter Property="Foreground" Value="Red"></Setter>

3     </Style>

4     <Style x:Key="yangshi1" TargetType="Button" BasedOn="{StaticResource yangshi}">

5         <Setter Property="Width" Value="200"></Setter>

6     </Style>

也可以把样式设置到应用程序资源。这样的样式就是全局的样式了，整个程序都可以访问

1 <!--应用程序资源-->

2     <Application.Resources>

3         <Style x:Key="yangshi"  TargetType="Button">

4             <Setter Property="Foreground" Value="red"></Setter>

5         </Style>

6     </Application.Resources>

我们还可以把样式写在一个资源文件中：

    可惜的是微软并没有提供相应的资源文件，所以需要我们自己来创建一个

    新建一个XML文件

 

并且把后缀改成xaml写入下面的内容

1 <ResourceDictionary

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

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

4     <Style TargetType="Button" x:Key="yangshi">

5         <Setter Property="Foreground" Value="Red"></Setter>

6     </Style>

7 </ResourceDictionary>

然后我们在使用这个资源文件的程序中进行引用：

1  <UserControl.Resources>

2         <ResourceDictionary Source="XMLFile1.xaml">

3             

4         </ResourceDictionary>

5     </UserControl.Resources>

 附加个小知识点：

   动态的去修改一个图片的地址：不能直接给Source赋地址路径；因为它需要的是一个imageSource对象

1 image1.Source = new BitmapImage(new Uri("Images/mm.jpg",UriKind.Relative));

 

 附加一个闪光字的制作方法：

我们先来画这么一个界面

 1   <TextBlock  FontSize="80" Height="119" HorizontalAlignment="Left" Margin="56,232,0,0" Name="textBlock1" Text="功夫之王" VerticalAlignment="Top" Width="366" >

 2             <TextBlock.Foreground>

 3                <LinearGradientBrush>

 4                    <GradientStop Color="Beige" Offset="0.2"></GradientStop>

 5                     <GradientStop x:Name="qidian" Color="Gold" Offset="0.4"></GradientStop>

 6                     <GradientStop Color="BurlyWood" Offset="0.6"></GradientStop>

 7                     <GradientStop Color="GhostWhite" Offset="0.8"></GradientStop>

 8                     <GradientStop Color="Bisque" Offset="1"></GradientStop>

 9                </LinearGradientBrush>

10             </TextBlock.Foreground>

11         </TextBlock>

然后来配置动画控件的属性：

 1 <phone:PhoneApplicationPage.Resources>

 2         <Storyboard x:Name="donghua">

 3             <DoubleAnimation 

 4                 AutoReverse="True"  //是否逆向  左→右→左  默认是左→右 左→右

 5 

 6                 Duration="0:0:3" //动画在From、To值之间变化时的持续时长

 7                 BeginTime="0:0:3" //动画三秒以后播放

 8 

 9                 RepeatBehavior="3x" //重复的次数  Forever为永远播放

10                 Storyboard.TargetName="qidian"  //动画作用的控件名

11                 Storyboard.TargetProperty="Offset" //动画作用的属性名

12                 From="0.1" //起始

13                 To="1"//结束

14                 ></DoubleAnimation>

15         </Storyboard>

16     </phone:PhoneApplicationPage.Resources>

    最后在后台begin动画 

1   private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)

2         {

3             donghua.Begin();

4         }

      除了DoubleAnimation之外，还有很多其他动画，这些动画都从TimeLine类继承，都有的属性AutoReverse、RepeatBehavior、Duration、Completed事件（播放完成）、BeginTime（延迟播放，不是立即播放）

 

      Storyboard中可以放多个Animation

动画是异步播放的，Begin只是启动动画，不会等待动画播放完成再返回

指定EasingFunction属性可以设定动画的缓动曲线（EasingFunction属性也非常的好玩，大家可以试下！）