Expression XAML Silverlight 设计/图形初学者中级开发 Visual Studio C#

使用 Silverlight Physics Helper Library 的简单应用程序

<b>Kunal Chowdhury «IN»</b>

4.82/5 (18投票s)

2010 年 6 月 27 日

CPOL

5分钟阅读

62075

544

使用 Silverlight Physics Helper Library 的简单应用程序

引言

最近我对使用 Silverlight 物理助手产生了兴趣。我在网上看到了一些演示，它们使用 Silverlight 的物理库来创建具有摩擦逻辑的精美动画。是的，就是摩擦。你可以将一个球放在一个表面上，它会在那个表面上弹跳。我觉得这很有趣，于是想创建一个简单的演示。在这里，我将演示如何使用 Expression Blend 创建一个示例应用程序。你甚至不需要用 Visual Studio 写一行代码。惊喜的微笑真的吗？是的，让我们开始吧。

先决条件

在进行下一步之前，你需要已在开发环境中安装以下工具：

在 Expression Blend 中设置项目

在正确下载并安装它们之后，打开你的 Expression Blend 并创建一个新的带有网站的 Silverlight 项目。选择适当的位置来创建项目，并为你的解决方案提供一个好名字。在这里，我创建的解决方案名称是“Silverlight 4 Physics Demo”。

Creating new Silverlight Project using Expression Blend

项目创建完成后，在 Expression Blend 的 Assets（资产）选项卡中，在“Location”（位置）下搜索“Spritehand.FarseerHelper.dll”。如果你在那里找不到它，说明你的物理助手库没有正确安装。然后，手动将它们作为 DLL 引用添加到你的项目中。找到 Assets（资产）选项卡中的“Spritehand.FarseerHelper.dll”后，点击它，你会在右侧面板中看到一些控件可见。它们是“CameraController”、“CameraLayer”、“PhysicsController”、“PhysicsJoint”和“PhysicsStaticHolder”。看下面的截图。在此示例中，我们只使用其中的两个：“PhysicsController”和“PhysicsStaticHolder”。

基本概念

PhysicsController 负责控制对象在水平或垂直方向上的运动，或在对象之间创建碰撞。PhysicsStaticHolder 顾名思义，它的作用是将其绑定到一个实心对象或一组对象上，你的物体将带有一定的速度和摩擦力掉落到其中。

玩转 XAML

让我们通过 XAML 来创建一个简单的应用程序（无需编写任何代码）。为此，请使用 Microsoft Expression Blend 打开你的 *MainPage.xaml* 页面，并将 Grid 面板替换为 Canvas 。此步骤是必要的，因为该库只能识别 canvas 。
现在我们将创建一个“U”形的谷状区域，我们将在这个区域里投掷一个球，球会沿着路径滚动。为此，我们首先在 XAML 页面中添加一个 Rectangle 并为其设置一些背景颜色。
在 Rectangle 的上方添加一个 Ellipse ，使其看起来像一个山谷。它看起来会像下面的截图。
现在选中 Rectangle 和 Ellipse 。右键单击选中的区域以打开上下文菜单。单击“Combine”（合并）=>“Subtract”（减去）。这将从 Rectangle 中减去 Ellipse 的部分，并将它们合并为一个 Path 控件。
减去后的区域看起来会像下面的截图。完成此操作后，为新创建的 Path 指定一个合适的名称。在我们的示例中，我们将使用“frictionArea”。在这个区域里，我们将投掷一个球，它将沿着路径边缘滚动。
添加一个新的小型 Ellipse 并将其命名为“ball”。这个球将沿着 frictionArea 滚动。将球的大小调整为 82 x 82 像素。然后将其 Left 位置（即 Canvas.Left）设置为 23，Top 位置（即 Canvas.Top）设置为 -500。这将把球定位在远离表面的位置。
现在从 Assets（资产）选项卡中将一个“PhysicsController”和一个“PhysicsStaticHolder”拖放到你的 canvas 中（如前所述）。
选中“PhysicsController”并转到其 Properties（属性）面板。如上图所示，将其 FrictionDefault 设置为 5 ，GravityHorizontal 设置为 0 （零），GravityVertical 设置为 500 ，并将 MousePickEnabled 设置为 True。顾名思义，FrictionDefault 将为你的控件添加摩擦力，GravityHorizontal 将设置水平加速度，GravityVertical 将添加垂直下降速度。在我们的示例中，我们不需要任何水平速度，因为我们的球会在山谷中滚动。因此，我们需要一些垂直加速度，以便它能够下落到表面。
现在单击“PhysicsStaticHolder”并从 Properties（属性）面板中将其 Body 设置为“frictionArea”。您只能在此设置一个元素。如果需要更多元素作为表面，请将它们分组在一个 Canvas 中，并将 canvas 设置为 PhysicsStaticHolder 的 Body 。