假期是一年中的美好时光，充满了朋友、家人、食物……和原型？现在，我们用 Axure RP 制作的雪花节日贺卡祝您节日快乐。

每片雪花都遵循一个循环，使其不断下落、旋转和褪色——永远！当雪花重置时，它会根据随机生成的值调整大小。此外，雪花下落和旋转的速度取决于其大小，因此较大的雪花比较小的雪花移动得更快，从而产生深度错觉。

让我们仔细看看这个交互循环的每一步。打开Snowflake母版，选择repeater就可以开始了。

1. 设置雪花的大小

Snowflake母版中的中继器只有一行，它创建了一个雪花。

转发器的Item Loaded交互以Set Size操作开始，该操作将雪花的起始大小乘以中继器的SizeFactor列中的值。（此值1默认设置为，但它会随机化为第 3 步1和10第 3 步之间的值。）

以下公式用于设置雪花的宽度和高度：

宽度： [[Target.width * Item.SizeFactor]]
高度： [[Target.height * Item.SizeFactor]]

注意： Target指雪花，因为它是Set Size操作的目标。

项目加载事件的结尾是：触发雪花的移动事件来开始它们的下降和循环旋转。

2. 移动和旋转雪花

雪花的移动交互有两种情况，它们使用条件逻辑来确定移动雪花时会发生什么。

1. 第一种情况Fall and Rotate使雪花在页面上向下移动，只要它高于存储在SnowflakeFadePoint 变量中的 Y 值。（变量值设置为浏览器窗口高度的 75%，与Happy Holiday页面的窗口改变尺寸交互。）

   请注意，移动和旋转操作[[This.height]]在其值中使用。这就是我如何根据雪花的大小让雪花下落和旋转得更快或更慢。雪花越大，它走得越快。

2. 一旦雪花低于SnowflakeFadePoint值，Fade Out用例就会使用淡入淡出动画将其隐藏，从而触发其隐藏交互。

3.重置雪花

雪花的隐藏交互以500 毫秒的等待动作开始，为完成淡入淡出动画留出足够的时间。

然后删除This repeater row，从而删除雪花。

最后，它向repeater 添加了一个新行，从而创建了一个新的雪花。这是步骤 1中的SizeFactor值随机化的地方。新的转发器行在SizeFactor列中添加了以下等式：

[[Math.floor(Math.random() * SnowflakeMaxSizeFactor) + 1]]

这会1在SnowflakeMaxSizeFactor变量中存储的值之间生成一个随机数，该值设置为10。（您可以通过转到应用程序菜单中的项目 → 全局变量来更改此值。）

将新行添加到转发器后，循环从步骤 1 重新开始。

下载示例 RP 文件

当然，Happy Holidays页面上还有很多事情可以创建您看到的降雪。这个交互循环只是基本的构建块。查看该页面的小部件设置、页面加载交互和窗口大小调整交互，以了解其他所有内容如何工作。