Silverlight 动态背景
4.89/5 (13投票s)
创建一个丰富的、动态的背景，当用户使用您的应用程序时做出反应。
引言
自从我开始开发Silverlight应用程序以来，我就对创建一个更丰富、更动态的用户体验很感兴趣。毕竟，一个能超越Flash的平台，我可以用C#编写代码，这让我的思绪得以遨游...
我不能为此想法邀功，它在Jose Fajardo的这篇文章中有详细的描述。请阅读它，因为它能帮助您理解本示例想要实现的目标。原始作者没有提供任何源代码，只有一些截图。我尽力重现了这种效果，并在某些地方进行了改进。
本文将相当简短，我可以花很长时间来列出所有9个文件的参考。我更愿意让您下载示例并运行它。我在本文中包含了一些截图，以及基本概念的描述。
背景
对于背景，我选择了一个简单的径向设计。包含一个XAML故事板，用于在南非国旗的6种颜色之间更改主背景颜色。这是为了支持目前正在南非举行的2010年世界杯。
形状图层
为了创建Jose Fajardo描述的效果，我们在其上绘制形状的顶部有三个图层（Canvas）。每个图层都有一个逐渐透明且更小的形状。与动画一样，它的动画速度也逐渐变慢，以便在您移动鼠标时产生更流畅的感觉。
形状是简单的XAML路径，以下是一些基本形状的示例。形状继承自ShapeBase，其中包括用于处理变换（例如缩放和旋转）的标准方法。这是为了让背景能够动态地旋转和调整添加到图层的每个形状的大小。如果我们不允许这样做，最终所有形状都将南北对齐并且大小相同。如果所有形状的大小都相同，则在呈现中将没有透视效果。如果所有形状都南北对齐，那将非常无聊。
控件层
在Background层和所有Shape层之上是Controls层。此层包含屏幕上所需的视觉元素，并且也进行动画处理。动画是所有层中最不敏感的，因此控件不会在用户伸手去够的时候简单地从鼠标下“跳出来”。
布局
Background和Shape层显示在一个2520像素宽和1680像素高的区域中。这是为了实现高清（HD）的视觉布局。我知道HD只有1920x1080，但我增加了屏幕顶部、底部、左侧和右侧的300像素边距，以便实现更大的显示，并且即使在HD分辨率下也能感受到应用程序的连续性。
Controls层显示在一个略小于客户端视觉窗口的区域中，以防止任何控件从屏幕侧面滑出无法触及的地方。
更改和修改
我更改了原始作者实现其系统的一些方法，其中之一是我创建了一个所有形状都必须继承的ShapeBase类。这允许我们通过更改属性来动态地更改呈现的Shapes，而不是必须为每个Shape实际创建新页面。
所有更改都是为了创建一套更可重用的代码，以便我可以将此概念用于Genesis Smart Client Framework v2.0 (Project Ruby)的动态活动背景。
更新
- 2010年6月11日 - 发布原始文章