在Silverlight中模拟阴影

时间:2008-02-25 09:30:06  来源:蓝色理想  作者:langmuir  【背景色 】

Silverlight没有位图滤镜，同样的问题存在于WPF程序。有一些可以用png来模拟，但是有一些可以使用xaml。下面的一个例子展示一个可行的(并不一定是最好的)阴影滤镜，依靠Expression design将矢量内容输出。

第一步，打开Expression design并且创建一个图形，并且复制这个对象。做成一个带有圆角的矩形。

下一步，隐藏上面的矩形，并将下面的矩形的笔触效果改成位图喷枪。你可以改动笔刷的大小，得到最适合的外观效果。通常设置12-20px之间。笔刷的颜色设置(注意区分于填充)可以改变笔刷颜色。当然，你可以很自由的玩转各种其它的笔刷，做一些个性的效果。

得到的形状效果如下:

注意，我在稍后的屏幕截图里，将笔刷的宽度由13.33调整到了20。

现在，将隐藏的UI元素显现，并用你习惯的方式查看整体的效果。我通常调整到实际的尺寸(100%)。

如果效果不错，就可以输出XAML到Silverlight了.这里的关键是确保你的笔刷笔触是向量的。
接下来还可以设置一些细节，图像质量与XAML大小的权衡。在这个例子里，你可以设置比较低的质量。

最后的XAML会包含相当数量的路径(Path)并带有透明度变化，模拟一个边缘渐变的阴影。

还是其它的很多方法你可以尝试，同样可以达成需要的效果。

例子的所有资源下载(.design+sl Project)。

PS:发现Expression Design的一个优点，如果正在使用中的Design，因为系统故障导致重启、假死等，再次打开Design会恢复到原来的工作状态，文件不会丢失。

还有一个Bug,在第二步改变矩形笔刷后，外观从圆角变成了直角。如下图：