一步一步学Silverlight 图片处理Word文件下载.docx

一步一步学Silverlight 图片处理Word文件下载.docx

《一步一步学Silverlight 图片处理Word文件下载.docx》由会员分享，可在线阅读，更多相关《一步一步学Silverlight 图片处理Word文件下载.docx（7页珍藏版）》请在冰豆网上搜索。

注意，在Silverlight2Beta1中，目前似乎只支持.png格式的图片。

<

CanvasBackground="

#CDFCAE"

>

<

RectangleCanvas.Left="

20"

Canvas.Top="

80"

Width="

240"

Height="

136"

RadiusX="

15"

RadiusY="

Rectangle.Fill>

ImageBrushImageSource="

a1.png"

/ImageBrush>

/Rectangle.Fill>

/Rectangle>

ImageSource="

b1.png"

Canvas.Left="

320"

/Image>

/Canvas>

运行后如下所示：

图片拉伸

当我们创建了一个图片的时候，如果不指定它的宽度和高度，它将会使用默认的规格来显示；

如果指定了高和宽，图片将显示在指定高和宽的矩形区域内。

可以通过苏醒Stretch来指定图片如何填充在该区域内，即图片拉伸。

Stretch属性具有四个可选值：

None：

不对图片进行拉伸以便填充规定的尺寸。

Uniform：

按比例进行拉伸，直到有一边满足规定的尺寸区域为止，其余部分不会被填充，按最小尺寸填充。

UniformToFill：

按比例进行拉伸，直到完全填充规定的尺寸区域为止，超出该区域的将会被裁剪，按最大尺寸填充。

Fill：

不按比例拉伸，完全填充规定的尺寸区域，将会破坏图像的比例。

Stretch默认的属性是Uniform，为了更直观的看到这个四个值的区别，下面看一个例子，我们使用一个规格尺寸为160*90图片，中间带一个小的正方形：

在页面上放置四个Border控件，大小为220*220，并在其中各放置一个Image，图片的大小也定义为220*220，设置四个Image的Stretch属性分别为None、Uniform、UniformToFill、Fill，如下所示：

BorderBorderBrush="

Black"

BorderThickness="

3"

220"

40"

50"

a2.png"

Stretch="

None"

/Border>

330"

Uniform"

UniformToFill"

Fill"

运行后可以很明显的看到这个四个值的区别，如下图所示：

裁剪图片

有时候我们只需要显示出图片的一部分，可以使用Clip属性对图片进行裁剪，在Clip属性中我们可以设置任意的几何图形，注意是Geometry而非前面讲过的Shape，关于Geometry后面会专门讲到。

如下面的例子，裁剪出一个椭圆的区域：

Image.Clip>

EllipseGeometryCenter="

120,68"

100"

60"

/EllipseGeometry>

/Image.Clip>

运行后效果如下所示：

半透明遮罩

使用图片的OpacityMask属性，可以解释为通过用OpacityMask属性指定的画刷的alpha通道值来遮掩图片的alpha通道值，可以使用的画刷有LinearGradientBrush,RadialGradientBrush和ImageBrush，而对于SolidColorBrush则可以直接通过Opacity属性实现。

如下面的例子，我们对图片做一些渐变的效果：

160"

Opacity="

0.7"

Image.OpacityMask>

LinearGradientBrushStartPoint="

0,0"

EndPoint="

1,0"

GradientStopOffset="

0.0"

Color="

#00000000"

/>

1.0"

#FF000000"

/LinearGradientBrush>

/Image.OpacityMask>

运行后效果如下：

结束语

本文介绍了Silverlight中对于图片的处理，在后面我们还将利用这些知识做一个综合实例——实现图片的倒影效果。