黑马程序员_学习日记84_814WP7开发（画刷Brush、变换Transform、样式、换肤）

1、画刷：
(1)Silverlight的界面都是用画刷（Brush）画出来的，可以改变不同的画刷画不同的内容。
SolidColorBrush：实心颜色画刷
LinearGradientBrush：线性渐变画刷
RadialGradientBrush：径向渐变画刷（以圆心散射）
ImageBrush：图片画刷
(2)Brush类型的属性都可以指定各种Brush，比如Button的Foreground属性、Rectangle的Fill属性。
(3)SolidColorBrush

<Rectangle>
    <Rectangle.Fill>
        <SolidColorBrush>Red</SolidColorBrush>
    </Rectangle.Fill>
</Rectangle>

可以简写成：

<Rectangle Fill="Red">

(4)LinearGradientBrush

<LinearGradientBrush>
    <GradientStop Color="Black" Offset="0"></GradientStop>
    <GradientStop Color="Red" Offset="0.5"></GradientStop>
    <GradientStop Color="White" Offset="1"></GradientStop>
</LinearGradientBrush>

(5)RadialGradientBrush

<!--GradientOrigin属性为渐变圆心坐标（最大1）-->
<RadialGradientBrush GradientOrigin="0,0.5">
    <GradientStop Color="White" Offset="0"></GradientStop>
    <GradientStop Color="Red" Offset="0.5"></GradientStop>
    <GradientStop Color="Yellow" Offset="1"></GradientStop>
</RadialGradientBrush>

(6)ImageBrush

<TextBlock Height="107" HorizontalAlignment="Left" Margin="10,10,0,0" Name="textBlock1" Text="传智播客" VerticalAlignment="Top" Width="458" FontSize="72" FontWeight="Bold">
    <TextBlock.Foreground>
        <ImageBrush ImageSource="Images/1.png"></ImageBrush>
    </TextBlock.Foreground>
</TextBlock>

2、变换Transform
变换可以让UI元素产生扭曲、旋转等。不用改变逻辑的几何形状、位置。就像通过放大镜看物体一样。
Transform类型的属性都可以应用变换。
变换有如下几种：
RotateTransform：旋转变换

<Image.RenderTransform>
    <!--以(100,100)为中心，逆时针旋转30度-->
    <RotateTransform CenterX="100" CenterY="100" Angle="-30"></RotateTransform>
</Image.RenderTransform>

ScaleTransform：缩放变换

<!--ScaleX、ScaleY为缩放的倍数-->
<ScaleTransform CenterX="40" CenterY="40" ScaleX="0.5" ScaleY="2"></ScaleTransform>

SkewTransform：倾斜变换

<SkewTransform AngleX="30" AngleY="10"></SkewTransform>

TranslateTransform：平移变换

<TranslateTransform X="30" Y="50"></TranslateTransform>

因为不推荐使用Canvas布局，所以如果动态控制元素位置、大小一般使用ScaleTransform 、 TranslateTransform ，不推荐修改元素的Height、Width和坐标。

3、样式：
    Silverlight中的样式非常类似于HTML中的CSS样式。存在内联样式、页面样式、样式文件等形式。Silverlight中所有的属性都能当样式用，没有单独的样式。
(1)内联样式
(2)页面样式

<UserControl.Resources>
    <Style TargetType="Button" x:Key="WarnBtn">
        <Setter Property="Foreground" Value="Red"></Setter>
    </Style>
</UserControl.Resources>
<!--LayoutRoot 是包含所有页面内容的根网格-->
<Grid x:Name="LayoutRoot" Background="Transparent">
    <Button Style="{StaticResource WarnBtn}" Content="大button" Height="80" Width="200" ></Button>
</Grid>

(3)样式文件

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="Button" x:Key="rb1">
        <Setter Property="Foreground" Value="Red"></Setter>
    </Style>
</ResourceDictionary>
然后在页面中
<UserControl.Resources>
    <ResourceDictionary Source="Dictionary1.xaml"></ResourceDictionary>
</UserControl.Resources>
来引入

(4)全局样式（直接写在App.xaml中）

<Application.Resources>
    <Style TargetType="TextBox">
        <Setter Property="Foreground" Value="Black" ></Setter>
        <Setter Property="Background" Value="Red" ></Setter>
    </Style>
</Application.Resources>

样式如果没有设定x:Name或x:Key，那么则应用于作用范围内的所有同类型文件。

4、换肤功能

private void btnLittle_Click(object sender, RoutedEventArgs e)
{
    ResourceDictionary newStyle = new ResourceDictionary();
    newStyle.Source = new Uri("/PhoneApp1;component/ChangeSkin/LittleGreenStyle.xaml",UriKind.RelativeOrAbsolute);
    ApplySkin(newStyle);
}

private void btnBig_Click(object sender, RoutedEventArgs e)
{
    ResourceDictionary newStyle = new ResourceDictionary();
    newStyle.Source = new Uri("/PhoneApp1;component/ChangeSkin/BigRedStyle.xaml", UriKind.RelativeOrAbsolute);
    ApplySkin(newStyle);
}

private void ApplySkin(ResourceDictionary newStyle)
{
    App.Current.Resources.MergedDictionaries.Clear();
    App.Current.Resources.MergedDictionaries.Add(newStyle);
}