flash拼图游戏源码_在Flash中构建视频拼图游戏

flash拼图游戏源码

Suppose you could convince your visitors to give their undivided attention to your company logo and message for one to two full minutes. And then watch your commercial. And then give you their email address. Sound too good to be true? Well, there is one catch: you have to be willing to chop your message up into little pieces.

假设您可以说服访问者在整个一到两分钟内全神贯注地关注公司徽标和消息。 然后观看您的广告。 然后给您他们的电子邮件地址。 听起来好得令人难以置信？ 好吧，这里有一个陷阱：您必须愿意将您的信息切成小块。

In this tutorial, we’ll work through the process of building a jigsaw puzzle, based on either a still image or a video. In the process, we’ll cover some useful Flash techniques for loading and masking images, and for responding to user actions.

在本教程中，我们将基于静态图像或视频来完成构建拼图的过程。 在此过程中，我们将介绍一些有用的Flash技术，用于加载和掩盖图像以及响应用户的操作。

For a sneak preview of what we’re building, unzip the download files and fire up sitePointPuzzle.swf. If you look in the .fla, you’ll find a couple of functions not described here: randomize scatters the puzzle pieces across the Stage, and displayTime shows a running timer. We’ll focus on the key features of the jigsaw puzzle application: cutting the loaded .jpg or .swf into puzzle pieces, and putting those pieces back together.

要预览我们要构建的内容，请解压缩下载文件并启动sitePointPuzzle.swf。 如果您查看.fla，则会发现此处未描述的几个功能：将拼图块randomize分散在舞台上，而displayTime显示正在运行的计时器。 我们将重点研究拼图游戏应用程序的主要功能：将加载的.jpg或.swf切成拼图，然后将它们放回原处。

制作可重复使用的拼图模板 (Make a Reusable Puzzle Template)

First, you need to decide on the dimensions of your puzzle, in order to make the puzzle template — the collection of shapes that fit together in the complete puzzle. The example template I’ve used here is 550 x 230 pixels. If you go much bigger than that, or if you use more than about 20 pieces, you risk bogging down slower machines. The actual JPG or SWF that provides the visible content will be loaded in at run-time, so we can get a lot of mileage out of a single template, reusing it with many different images.

首先，您需要确定拼图的尺寸，以制作拼图模板-完整拼图中适合的形状集合。 我在这里使用的示例模板是550 x 230像素。 如果您要比这大得多，或者使用的零件超过20件，则有可能使速度较慢的机器陷入困境。 提供可见内容的实际JPG或SWF将在运行时加载，因此我们可以从单个模板中获得很多收益，并将其与许多不同的图像一起使用。

In Frame 1 of a new Flash document, use the rectangle tool to draw a rectangle with no border, using any fill color. The color will not be visible in the final product. In the property inspector, set the width and height of the rectangle, and set its x and y position to 0. Insert an empty keyframe in Frame 2 of the timeline.

在新的Flash文档的第1帧中，使用矩形工具使用任何填充颜色绘制无边界的矩形。 该颜色在最终产品中将不可见。 在属性检查器中，设置矩形的宽度和高度，并将其x和y位置设置为0。在时间轴的第2帧中插入一个空关键帧。

Now select the lasso tool, and use it to cut out a puzzle piece from one corner of the rectangle.

现在选择套索工具，并用它从矩形的一个角上切出一块拼图。

Choose Modify > Shape > Optimize, and find a setting that seems to work well. Optimizing the shapes will speed up the performance of the final movie, but over-optimizing will distort the shapes of your puzzle pieces. Press F8 to open the Convert to Symbol dialogue window. Give the piece the name piece0, select Movie clip, set the registration point in the upper left corner, and check Export for Actionscript. Press OK to close the window.

选择“修改”>“形状”>“优化”，然后找到一个看起来效果很好的设置。 优化形状会加快最终电影的性能，但过度优化则会使拼图的形状变形。 按F8打开“转换为符号”对话框。 将片段