bo_|PS图片拼图的教程怎么做？

发布网友 发布时间：2022-02-22 04:48

我来回答

共1个回答

热心网友 时间：2022-02-22 06:17

第一步:图片的准备工作
用PS或Fireworks将一张JPG图像分割，如分割成12块，然后分别保存成12个jpg小图片，比如我将他们分别命名为pic1～pic12（PS中处理的图像文件名）。
第二步:建立Flash文件
打开Flash，通过Ctrl+J打开设置面板，将画面大小改为800X600px,其他可以保持默认值。
第三步:制作用来判断位置的Movie Clip
在场景中导入12块已经处理好的小图片，然后按照原图顺序摆放在场景的下半部，选中左上角第一块,按F8键,转换成 Movie Clip(以后简称MC),控制点选择在图片中心(这一点很重要),name为check1(也可以根据自己的习惯取名),其余的图片用同样的方法处理。
然后选择菜单Window Properties或Ctrl+F3,打开Properties面板,按顺序为这些图片分别填写Instance Name为b1～b12,以便以后在Action中调用.选中所有MC(Ctrl+A),将他们的Alpha属性设置为30％,这样做只是为了使MC看上去模糊,让玩家不能清楚地辨认出是哪部分,以增大游戏难度。
第四步:制作用来拖拽的MC
这是比较重要的一步,我们将利用这个MC来实现图块的拖拽以及位置的判断,在这里我们运用了MC中嵌套Button的方法以实现代码重用。
选择菜单Insert New Symbol...或Ctrl+F8新建Button(以下简称BT),取名为button_body,确定后进入编辑界面,在Timeline(时间线)中右键单击Hit帧,在快捷菜单中选择New Keyframe建立关键帧 ,选择矩形工具(R),绘制一个矩形,选择选取工具 (V),双击矩形,在Properties面板中将宽、高、X坐标、Y坐标分别设置为80、80、0、0（图片大小）;
新建MC 取名button_action,确定后进入MC编辑窗口,Ctrl+L打开Library(库),将刚刚建立的button_body拖进来,同样将X、Y坐标设置为(0,0).
下面开始为BT(按钮)添加AS,选中刚才拖进来的button_body,打开Actions面板,利用快捷键Ctrl+Shift+E(Flash 5 中为Ctrl+E,前提是选中了Actions面板)转换到Expert Mode(专家模式,这个模式下编写AS比较灵活,建议使用),填入下面的代码:
on (press) {//按下鼠标
startDrag(_parent, false, 20,20, 1000, 1000);//使图块可以在一定范围内被拖拽
}
on (release) {//释放鼠标
stopDrag();//停止拖拽
for (i=1; i <=12; i++) {//判断图块所在位置，12为图块数量
if (_parent._x<=eval("_root.b"+i)._x+40 and _parent._x>=eval("_root.b"+i)._x-40 and _parent._y<=eval("_root.b"+i)._y+40 and _parent._y>=eval("_root.b"+i)._y-40) {
//如果被拖拽的图块中心点进入某个判断位置的MC的范围内时,之间注意空格不能存在
_parent._x = eval("_root.b"+i)._x;//设置图块的坐标,使其吸附到相应的位置
_parent._y = eval("_root.b"+i)._y;
}
}
}
这样,拖拽组件button_action就制作好了,在下面的制作中将重复用到这个MC.
第五步:制作被拖拽的图块
新建MC,命名为pic1(这个名称无关紧要),确定后进入编辑窗口,在Library中将button_action拖入,设置坐标为(0,0),再从Library中将最初导入的图片pic1.jpg拖入,坐标(0,0),重复这个步骤,直到所有图块都拥有自己相应的MC.
顺便再做一个按钮，命名为button_back,用来在游戏完成后开始新的游戏.
第六步:游戏的完成工作
回到场景中,将TimeLine中已存在的层命名为"位置判断层"，点击TimeLine左下角的Insert Layer按钮 ,新建三个层,分别命名为"图块层"、"AS层"和"按钮与提示层".选择"图块层",将Library中的pic1～pic12这几个MC拖入该层。特别注意:这里是MC,而不是图片,我们可以按住Ctrl键同时选择不连续的多个Symbol。按顺序在Properties面板中分别填写Instance Name为p1～p12。

选择"按钮与提示层",将第二帧设为关键帧并在Properties面板(flash 5中为Frame面板)中填写Frame Label为"over",选择文字工具(A),在中间位置写入胜利后的提示,如:"Good You Win !!",再拖入button_back到合适位置,并*AS:
on(release){
prevFrame();//回到前一帧,开始新游戏
}
现在进入冲刺阶段,选择"AS层",选择第一帧,*AS:
stop();//flash 5中请将这句去掉
for (i=1; i <=12; i++) {//游戏初始化
eval("p"+i)._x = random(240)+80;//随即设置图块的位置于场景上半部的一定区域内
eval("p"+i)._y = random(160)+70;
}
_root.onEnterFrame = function() {
//flash 5中请去掉这句和最后一个"}",将下面的AS*到该层的第二帧,并在第三帧*gotoAnfPlay(2)
b = 0;
for (j=1; j <=12; j++) {
if (eval("p"+j)._x == eval("b"+j)._x and eval("p"+j)._y == eval("b"+j)._y) {
//判断图块是否在正确的位置上,如果是
b =b+1;//变量加一
}
}
if (b == 12) {//如果所有图块的位置都正确
gotoAndStop("over");//显示胜利信息 over与前面对应label
}