Fun with Silverlight系列之一 －－ 倒影效果

核心提示：本文示例源代码或素材下载 在Silverlight中实现倒影效果和在WPF中稍有不同，在WPF中可以用VisualBrush 实现，Fun with Silverlight系列之一 －－ 倒影效果，具体如下:要反射的内容：1<Border Name="inkBorder" Grid.R

本文示例源代码或素材下载

在Silverlight中实现倒影效果和在WPF中稍有不同，

在WPF中可以用VisualBrush 实现，具体如下:

要反射的内容：1<Border Name="inkBorder" Grid.Row="0" VerticalAlignment="Bottom" Margin="20"
2　　　　　　Width="400" Height="100" CornerRadius="5" BorderThickness="4">
3　　　<Border.BorderBrush>
4　　　　<LinearGradientBrush SpreadMethod="Reflect" StartPoint="0,0" EndPoint="0.5,0.5">
5　　　 <LinearGradientBrush.GradientStops>
6　　　　 <GradientStop Color="Gray" Offset="0" />
7　　　　　　<GradientStop Color="#eeeeee" Offset="1" />
8　　　　　</LinearGradientBrush.GradientStops>
9　　　　 </LinearGradientBrush>
10　　　</Border.BorderBrush>
11　　　<InkCanvas Background="Yellow">
12　　　　 <Line X1="10" Y1="70" X2="380" Y2="70" Stroke="Gray"/>
13　　　</InkCanvas>
14　　</Border>

倒影内容：

1　<Rectangle.Fill>
2　　<VisualBrush
3　　　Visual="{Binding ElementName=inkBorder}">
4　　　<VisualBrush.RelativeTransform>
5　　　　<TransformGroup>
6　　　　　<ScaleTransform ScaleX="1" ScaleY="-1" />
7　　　　　<TranslateTransform Y="1" />
8　　　　</TransformGroup>
9　　　</VisualBrush.RelativeTransform>
10　　</VisualBrush>
11　</Rectangle.Fill>关键在于这句话<ScaleTransform ScaleX="1" ScaleY="-1" /> 表示控件的反转效果，后面也会用到这个技巧。