在WPF程序中,如果相位一个控件或者图片制作一个倒影的效果应该怎么做呢?其实非常简单,只需要利用三个知识点OpacityMask、ScaleTransform以及VisualBrush。
先看OpacityMask属性,该属性可使元素的特定区域透明或者部分透明。OpacityMask接受任何类型的画刷,在本例中,我们使用LinearGradientBrush画刷。
再看ScaleTransform,它是属于WPF中各种变换的一种,它可以放大或缩小元素的坐标系统,从而绘制更大或者更小的图像,对WPF中的变换有兴趣的可以多研究一下,在此不做过多介绍。
VisualBrush,画刷的一种,可以拷贝指定的元素的外观并绘制。
废话太多,现在上代码:
<TextBox Width="200" VerticalContentAlignment="Center" Name="tx" Height="40" FontSize="25" Text="Hello World" ></TextBox>
<!--倒影区域,利用矩形框作为倒影的载体-->
<Rectangle RenderTransformOrigin="0.5 0.5" Height="40" Width="200">
<Rectangle.Fill>
<!--绘制目标元素的外观-->
<VisualBrush Visual="{Binding ElementName=tx}"></VisualBrush>
</Rectangle.Fill>
<!--设置矩形框的OpacityMask属性-->
<Rectangle.OpacityMask>
<LinearGradientBrush StartPoint="0 0" EndPoint="0 1">
<GradientStop Color="AntiqueWhite" Offset="1"/>
<GradientStop Color="Transparent" Offset="0.1"/>
</LinearGradientBrush>
</Rectangle.OpacityMask>
<!--利用ScaleTransform将矩形框翻转-->
<Rectangle.RenderTransform>
<ScaleTransform ScaleY="-1"/>
</Rectangle.RenderTransform>
</Rectangle>
效果如图,做的比较粗糙,大家可以按照这个思路做出更漂亮的效果,欢迎交流