Flash 8实训教程—游戏制作入门第3章拼图游戏.ppt

第3章 拼图游戏 3.1 游 戏 说 明　　本游戏是一个简单的拼图游戏。所有拼图的图片均为规则的正方形，而非常见的拼图那样有不规则的形状。所有图片在舞台上平铺，通过拖动图块到它应该在的位置，实现将图块放到正确的位置上；而将原来占据该位置的图块自动切换到所拖动图块原来的位置上。当所有图块均放置到正确位置时，表明拼图正确完成。 　　3.2 打 乱 拼 图3.2.1 游戏制作　　1．初期准备工作　　(1) 准备一张位图图片(本书配套光盘中第三章\素材\3-1.jpg)，图片尺寸为1024×768像素或者800×600像素。由于目前普遍使用的电脑显示器屏幕的长宽比例一般为4∶3，因此，使用这一比例的图片在屏幕上显示时，给人的视觉感受会比较和谐。 图3-1 　　(2) 使用图片处理软件处理图片。本例中使用Adobe Photoshop，选择菜单命令〖图像〗→〖图像大小〗，在弹出的〖图像大小〗对话框中(见图3-1)，将图片的〖分辨率〗设置为“72”(像素/英寸)，〖宽度〗改为“400”(像素)，〖高度〗自动变为“300”(像素)。 　　(3) 打开Flash，新建一个空白Flash文件，将动画文件的大小设置为400×300像素。　　(4) 在图像处理软件中按Ctrl+A键全选图像，按Ctrl+C键复制，再回到Flash中按Ctrl+V键进行粘贴；或者在Flash中选择菜单命令〖文件〗→〖导入〗→〖导入到舞台…〗，然后选择需要导入的图片即可。　　(5) 如果图片与舞台没有重合，则在〖属性〗控制面板中将图片的位置〖x〗和〖y〗均设置为“0”。 　　2．制作基本元件　　(1) 保持刚才导入的图片被选中(图片外会有一个灰色的框)，按F8键，在〖转换为元件〗对话框中，将〖类型〗设置为“影片剪辑”，〖名称〗设置为“big_mc”。现在可以将舞台上的图片实例删去，库中元件不受影响。　　(2) 使用〖矩形工具〗，在〖属性〗控制面板中将〖笔触颜色〗设置为“无色”，〖填充颜色〗设置为任意颜色，在舞台上画一个矩形。 　　(3) 保持矩形选中的状态，按F8键将它转换为影片剪辑，〖名称〗为“mask_mc”，并将舞台上的实例删去，保留库中的元件。 　　(4) 按Ctrl+F8键，在〖创建新元件〗对话框中，选择〖类型〗为“影片剪辑”，〖名称〗为“block_mc”。确定后，自动进入“block_mc”的编辑界面。　　(5) 调出〖库〗面板，将“big_mc”影片剪辑拖动到舞台上，在〖属性〗控制面板中，设置〖x〗和〖y〗为“0”，〖实例名称〗为“img”。　　(6) 将图层1重新命名为“大图”。　　(7) 新建层，拖动此层放置于“大图”层的上方，并将层命名为“遮罩”。 　　(8) 在〖库〗控制面板中，拖出“mask_mc”影片剪辑放到此层上。在〖属性〗控制面板中，将这个实例的〖x〗和〖y〗均设置为“0”，〖实例名称〗设置为“mask”。　　(9) 单击“遮罩”层以选中，在“遮罩”层单击右键，在弹出的快捷菜单中选择〖遮罩层〗。两个图层变成图3-2所示的形式。　　(10) 单击场景1，返回主场景。 图3-2 　　3．打碎图片并随机摆放　　(1) 从〖库〗面板中拖出“block_mc”影片剪辑，将它放到舞台白色区域外面的灰色区域中。　　(2) 在〖属性〗控制面板中，将此“block_mc”影片剪辑的〖实例名称〗设置为“tu”。　　(3) 新建层，命名为“action”。　　(4) 选择第1帧，按F9键，插入如下Action Script语句：　　weizhi=Array(1,2,3,4,5,6,7,8,9,10,11,12);　　PieceLeft=12;　　ax=0;　　ay=0;　　　　for (c=0; c12; c++) { 　　(5) 效果如图3-3所示。 图3-3 3.2.2 重点与难点详解　　在开始编程前，我们首先要把图片分成为横向4块，纵向3块，也就是一共分成为12块，然后再给这12块分别编号(见图3-4)。　　开始编程时，使用一个数组变量weizhi来记住在没打乱图片顺序之前的各块图块。那么，什么是数组呢？我们可以把数组看成是一列火车，其中每一节车厢放着一个数字。我们是通过语句“weizhi=Array(1,2,3,4,5,6,7,8,9,10,11,12);”来给数组赋值的。通过“weizhi[0]，weizhi[1]，…”的形式来访问每一节“车厢”中的数字。可以这么说，0号车厢中放着数字1，1号车厢中放着数字2，……，11号车厢中放着数字12。特别要注意的是，车厢编号是从0开始的。 图3-4 　　在本例中，一开始有十二节车厢，顺序放入1～12这几个数。我们用PiecesLeft变量来