Expression Blend4制作图片切换
1.首先新建项目，然后在项目下创建一个文件夹image用来存放图片，将准备好的图片复制到image中。（如有需要调整画布与画板大小，可切换至代码界面，设置图片大小以及画布大小，调整过程中如果遇到图片随画布大小变化的情况，注意设置margin：0）
2.在如图
右上方点击“+”按钮，添加Storyboard，命名为Storyboard1，点击OK，这时时间轴出现
因为图片是一张覆盖着另一张的，所以要从界面显示的那张图片做起，也就是如下图所示的img4（img1对应1.jpg；img2对应2.jpg；img3对应3.jpg；img4对应4.jpg） 
3.选中img4，将时间轴移到“0”刻度处，点击“添加关键帧”按钮，再将时间轴移到“2”刻度处,点击“添加关键帧”按钮，设置img4的颜色由#FFFFFFFF改为#00000000（在下图位置修改颜色），点击“播放”按钮，即可看到两张图片之间的切换。 
4.选中img3，将时间轴移到“2”刻度处，点击“添加关键帧”按钮，再将时间轴移到“4”刻度处，点击“添加关键帧”按钮，设置img3的颜色由#FFFFFFFF改为#00000000，点击“播放”按钮，即可看到三张图片之间的切换。
5.选中img2，将时间轴移到“4”刻度处，点击“添加关键帧”按钮，再将时间轴移到“6”刻度处，点击“添加关键帧”按钮，设置img2的颜色由#FFFFFFFF改为#00000000，点击“播放”按钮，即可看到四张图片之间的切换。
代码如下：
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
x:Class="SilverlightApplication1.MainPage"
Width="200" Height="200">
<UserControl.Resources>
<Storyboard x:Name="Storyboard1">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.OpacityMask).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="img4">
<EasingColorKeyFrame KeyTime="0" Value="White"/>
<EasingColorKeyFrame KeyTime="0:0:2" Value="#00000000"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.OpacityMask).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" Storyboard.TargetName="img4">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:2" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.OpacityMask).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="img3">
<EasingColorKeyFrame KeyTime="0:0:2" Value="White"/>
<EasingColorKeyFrame KeyTime="0:0:4" Value="#00000000"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.OpacityMask).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="img2">
<EasingColorKeyFrame KeyTime="0:0:4" Value="White"/>
<EasingColorKeyFrame KeyTime="0:0:6" Value="#00000000"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.OpacityMask).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" Storyboard.TargetName="img3">
<EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:4" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.OpacityMask).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" Storyboard.TargetName="img2">
<EasingDoubleKeyFrame KeyTime="0:0:4" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:6" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<Image x:Name="img1" Margin="0" Source="image/1.jpg" Stretch="Fill" Width="200" Height="200"/>
<Image x:Name="img2" Margin="0" Source="image/2.jpg" Stretch="Fill" Width="200" Height="200">
<Image.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Image.OpacityMask>
</Image>
<Image x:Name="img3" Margin="0" Source="image/3.jpg" Stretch="Fill" Width="200" Height="200">
<Image.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Image.OpacityMask>
</Image>
<Image x:Name="img4" Margin="0" Source="image/4.jpg" Stretch="Fill" Width="200" Height="200">
<Image.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Image.OpacityMask>
</Image>
</Grid>
</UserControl>
可以设置N张图片切换，但方法总归是不变的，所以在这边只写到4张切换了。。。。有需要的，自行增加图片。。。。
