插入对象

平铺壁纸

首先我们来为游戏添加背景。使用Construct 2里的Tiled Background对象(平铺壁纸相信大家都很熟悉。通俗点,就是一个图片可以向四方重复粘贴,和网页背景图类似,能防止游戏在加载时因图片太大而减慢速度),下面官方提供了素材——背景图,右击另存到你的计算机里:


现在,在layout画布里双击,弹出插入对象对话框。在该对话框中双击Tiled Background对象。

Open full size image

这时,鼠标指针形状变成了十字形,你可以在布局的任何位置点击,我们在布局中间差不多位置点击,弹出Texture editor对话框,我们点击打开文件夹图标,把刚才保存的背景瓦片载入。


接下来单击对话框右上角X关闭对话框,如果提示保存图片,请保存!现在画布上出现了背景瓦片对象。选中它,在左边的Properties Bar属性面板里设置它的position位置为0,0(左上角),以及它的size大小为1280,1024(画布的大小)。


背景创建完毕,你可以按CTRL+鼠标滚轮来放大缩小,或者点击view菜单-zoom命令来查看整体效果,你也可以按住space空格键,或者按下鼠标中键,来平移画布,很类似PS的操作。你也可以按CTRL+0或者view菜单-zoom to 100%命令来恢复画布1:1的视图模式。

Open full size image

添加层

接下来,我们来添加更多的对象。首先我们先去把背景瓦片对象锁定了,这样才不会被我们再次选中,和PS,FL里的锁定一样。

画布由多个层组成,我们可以在不同的层放置不同的对象,可以通过调整层的上下顺序来调整对象的前后显示,层可以被隐藏或者锁定,平滚特效等。背景瓦片放置于最底层,其他对象如玩家,怪物,NPC等放置在上面的几层。

我们可以通过Layers tab来管理层,和Project bar工程面板在一个选项卡中。


在层面板中,我们可以看到背景层的序号为0,Construct2是从0开始计算,和编程类似,选中背景图层,点击pencil图标将背景层名字更改为Background。并点击Background图层的锁图标将锁定本图层。接着点击绿色的+号按钮添加一个新图层“Main”。


接下来请保持图层Main处于选中状态,接着我们将把对象置于该图层。

回到画布中,同样双击插入另外一个对象,这次我们选择Mouse对象,我们需要鼠标输入控制。同样的添加Keyboard对象。
注意:这些对象不需要置于画布中,他们是隐藏的,自动在工程中起作用,现在工程中的所有层都可以使用鼠标和键盘输入控制了。

游戏对象

是时候来添加游戏对象了,如玩家角色,怪物角色,子弹,游戏特效等。下面是本例中要用的图片:

玩家:

怪物:

子弹:

爆炸特效:

在CT2中,游戏中这些对象,我们将采用sprite(RPG中好些人称为精灵,在flash里成为元件)对象来置入。该对象用来显示图片(纹理,图像设计专业说法,在CT2里可以就认为图片),还可以移动,旋转或缩放。
接下来依次插入上面的几个对象,插入过程如下,和上面的操作一样,大致如下:
1、双击插入新对象
2、双击选择Sprite对象
3、当鼠标变成十字,在画布中点击
4、弹出对话框,点击open 图标,加载四张素材图片中的一张
5、保存并关闭对话框
注意:如果你觉得这样的操作方法太慢,繁琐,你可以直接把图片拖入到画布中,和PS操作差不多,Construct2会自动为该图片创建Sprite对象。

移动子弹和爆炸对象到画布外,这样游戏一开始,我们看不到这些对象。
默认CT2会自动把我们的对象命名为Sprite,Sprite2,Sprite3,Sprite4,我们可以在他们各自的Properties bar属性面板里的Name属性里更改。依次更改Player,Monster,Bullet,Explosion(玩家,怪物,子弹,爆炸特效)。

添加行为

Behaviors类似于flash中的行为(动作),是预先封装的功能函数。例如,我们添加一个Platform行为给一个对象,添加Solid行为给地板,游戏运行时,该对象就可以象platformer游戏(例如:超级玛丽)中的角色一样跳来跳去。你也可以通过事件来达到同样的效果,但是这需要较长的时间,而且该预置的行为已经很好。
Construct2具有以下行为:

8 Direction movement: 这个行为可以让你实现给角色添加方向移动(方向键)的功能。
Bullet movement:这个行为让对象朝着它当前的角度移动,比如,本例中玩家射出的子弹的移动行为,不要被这名字迷惑了,它不只适用于子弹,也可以应用于怪物等移动。在Contruct2里所有的移动行为都是通过添加速度向前行进。
Scroll to:这个行为可以让运行时画布随着对象移来移去(滚动)。这个行为很适合于角色。
Bound to layout:这个行为可以防止对象离开画布区域。这个行为对于角色来说也很重要。
Destroy outside layout:当对象离开画布区域时,就将其销毁。比如本例中的子弹,如果不销毁的话,虽然子弹离开画布区域了,但是依然暂用内存。所以我们需要及时销毁不再需要的对象。
Fade:这个行为可以给对象添加淡出效果,用于爆炸等特效的消失。

接下来我们就来给对象添加相应的行为。

如何增加行为

我们给角色player添加8 direction movement行为:选中player,在properties bar属性面板里,找到Behaviors分类,点击Add/Edit弹出Behaviors行为对话框。


在对话框中,点击绿色+号-添加行为图标,在弹出的“Add behavior”对话框中双击8 direction movement


接着以同样的方法给player添加Scroll ToBound to layout行为,此时"player:Behaviors"对话框如下:


关闭行为对话框。点击运行查看游戏!此时我们已经可以移动角色,屏幕也跟随角色移动,而且通过设置Bound to layout行为后,角色也不能移出画布区域。


希望你安装了兼容HTML5的插件,另外,请确保你是使用最新版的火狐,Chrome,或是 Ie9。一旦你的游戏运行后,请确保你可以用方向键移动玩家,而且银幕会随着玩家移动! 而且你不能使玩家走出画布。

添加其他行为

我们以同样的方法给其他对象添加相应的行为如下:

-给Bullet对象添加Bullet movement和Destroy outside layout行为。
-给Monster对象添加Bullet movement行为。
-给Explosion对象添加Fade行为。Fade行为默认会销毁对象,所以不用担心对象有没有销毁。

此时,我们再运行查看游戏,会发现怪物一下子就飞出去了。我们来编辑下怪物的行为,选中Monster怪物对象。看到properties bar属性面板中,我们会发现属性栏里多出了其他一些属性,这些属性是添加了行为后才有的。


更改speed速度为80(单位:像素/秒)
同样的方法给Bullet子弹对象的速度更改为400,Explosion对象的Fade行为的Fade out time淡出时间为0.5秒。

添加更多怪物

按住CTRL,拖拽Monster对象复制几个实例。他们都是Monster对象类型的。

对象类型可认为是对象的类(学过编程的知道,没学也没事)。在事件系统中,我们主要处理的就是对象类型。例如:你创建了一个Bullet collides with Monster事件,将会检测子弹与所有基于Monster对象类型的实例的碰撞,而不需要单独为每个怪物添加碰撞事件。通过Sprites(精灵/元件),一个对象类型的实例将共享同一个图片(纹理材质)。这样游戏在加载的时候只需加载一次该图片即可。我们在以后的课程中再深入对象类型和实例。目前,就可以认为不同类型的敌人是不同类型的对象类型。游戏中运行时创建的怪物对象都是相应对象类型的实例。(学过编程的都知道,本不想翻译这段话的,想想还是翻了,不必太纠结这个)

使用Ctrl +拖拽 创建7到8个新的怪物实例(为了区分下,往下我们用实例来表述)。放置怪物的时候不要太靠近玩家。否则角色一下子就挂了!此时你的画布类似如下:

事件

首先,在画布区域上方的选项卡上切换到Event sheet1事件编辑器面板,一个列表的事件被成为Event sheet事件表。游戏的不同部分可以拥有不同的事件表,事件表同样可以"include"包含即导入(编程里的概念,不懂就无视吧)其他事件表,这样可以重复利用事件表,目前我们不需要这些功能。

关于事件

Construct 2整个系统运作是基于事件系统,大多数显示器帧频为60帧/秒,为了匹配显示器达到平滑的显示效果,Construct 2也设置了差不多帧速率。所以事件表通常是一秒钟运行60次。每次都会更新屏幕相应发生变化的区域。事件表运行时的顺序为从上往下,所以靠上的事件先运行。

条件、动作、子事件

事件包含条件,测试某些条件是否满足,例如,Is spacebar down?(检测空格键是否按下)。如果条件满足了,那么事件的动作将会运行,例如,Create a bullet object创建一个子弹实例。当动作运行后,任何子事件也会运行,这样可以测试更多条件,运行更多的动作和更多的子事件等。使用该系统,我们可以为游戏或程序创建更多负责的功能。本例中,我们不需要该功能。

简述如下:
Are all conditions met?

view source print ?
1 //条件是否都满足?

--->yes:run all the event's actions。

view source print ?
1 //是:运行所有事件的动作

--->no:go to next event(not including any sub-event)

view source print ?
1 //否:往下运行下个事件,这里没有运用(包含)子事件

我们来创建第一个事件
我们将使player(发射口)一直看向鼠标,这样我们点击发射子弹的时候,子弹将发往鼠标方向。如下:


记住:每次屏幕被重绘的时候,tick(一个内部循环中,每秒几帧屏幕重绘,百度一下吧,囧)将会运行(tick下的事件都会运行一次)。所以如果我们强制player每帧都朝向鼠标,那么player将一直朝向鼠标。

我们开始制作该事件。在event sheet的空白位置双击,将打开添加事件对话框:

不同的对象根据他们要做的行为拥有不同的条件和动作,在对话框中双击System对象,对话框中列出了所有System对象的条件:

双击Every tick条件插入到事件表中。对话框将关闭,Every tick事件被创建,但没有actions(动作)。如下:


接着我们添加一个动作来使角色看向鼠标。点击event右边的Add action链接,打开对话框如下:

下:


对话框中列出了可以添加动作的对象,双击player对象,对话框列出了player对象可添加的动作如下:

选取Set angle towards position动作。该动作会自动计算角色到给定的X,Y坐标的角度。
接下来要指定X,Y坐标值(动作的参数,条件同样可以带有参数)。我们输入Mouse.X和Mouse.Y(也可以输入表达式如:Mouse.X+100,虽然用的并不多)
此时,你运行就可以看到效果了。
如果提示错误:Mouse is not any object name,确保你已添加了Mouse object鼠标对象!

你可能会担心如何记住所有可用的表达式。别担心,浮动在上边的object panel,默认处于半透明状态不会干扰你的注意力。移动鼠标到该面板上,单击,面板变完全可见。该面板起着字典的功能,可以帮你记住各类你可以使用的表达式。你可以双击表达式来插入,省的手动输入。
还有,点击对话框上的Done确定按钮。该动作就被添加了!如下:


第一个事件添加完毕!尝试运行游戏,角色在移动的时候一直朝下鼠标。

添加游戏功能

通过上边的学习,我们已经学会了添加事件,教程到这,已经很长了,我们会发现教程看起来很啰嗦,太细,做起来一下子就完了,所以接下来我们稍微简化下。记住添加条件或动作的步骤如下:

1、双击添加新事件,点击Add action链接添加一个动作。
2、在对话框中双击要添加条件/动作的对象
3、选取要添加的条件/动作
4、如果有需要的话,输入参数

接下来教程中以下面的格式来表述:

Add condition System -> Every tick
Add action Player -> Set angle towards position -> X: Mouse.X,Y: Mouse.Y

让角色可以射击
当玩家点击的时候,可以发射子弹。这可以通过Spawn an object动作来实现,该动作在同样的位置和角度(相对于角色)创建新的对象实例。子弹的Bullet movement属性将会使它向前飞出。制作如下事件:

条件:Mouse->On click->Left clicked(the default)

view source print ?
1 //鼠标->点击->左击(默认)

动作:Player->Spawn another object->For Object,choose the Bullet

view source print ?
1 //Play对象->产生另外的对象->对象,选择子弹层,输入1(“Main”图层),Image point(子弹的发射起点)保持默认为0。如下:


如果你运行游戏,你将看到子弹从角色图片的中心发出,并不是从枪口发出。我们来修改下,在工程或对象面板中右击player对象选择Edit animations编辑动画。


在弹出的图片编辑器中,选择Set origin and image points工具


看到image points对话框,对象的原点以红点显示


这是对象的原点(如果你旋转对象,将绕着这个点),点击绿色的+号按钮添加一个点,该点以蓝点显示。我们在角色图片枪口位置处左击,将该点放置于枪口位置:


关闭图片编辑器,双击事件表中早前添加的Spawn an object动作,更改Image point为1.在面板中可以看到序号的,默认的原点为0,其他添加的一次1,2。。。等。如下:


运行游戏。此时子弹已经修改为从枪口发射。此时,子弹没有做其他任何事。接下来我们来添加碰撞事件,用来消灭敌人。
添加事件如下:
条件:Bullet->On collision with another object->pick Monster。

view source print ?
1 //子弹->于其他对象碰撞->选择Monster怪物。

动作:Monster->Destroy

view source print ?
1 //怪物->消灭

动作:Bullet->Spawn another object->Explosion,layer 1

view source print ?
1 //在图层1 碰撞的位置产生新对象-爆炸特效

动作:Bullet->Destroy

view source print ?
1 //子弹销毁

爆炸特效

运行游戏,尝试射击一个怪物,我们可以看到碰撞发生,爆炸特效也产生了,杯具的是,有个大大的黑色边框,好难看!


不用担心,我们可以去掉黑框,在工程面板或者对象面板点击Explosion object爆炸特效对象。在它的属性面板里设置Effect属性为Additive(叠加,玩过PS的知道,黑色颜色值为0,叠加后就不起作用,就看不到了,具体的去百度下吧)。再次尝试游戏可以看到,完美了

让怪物聪明一点

(添加怪物智能AI,专业说法,囧,本例可没那么高深)
当下怪物只会向右移动。我们来让他们更有趣些。首先让他们产生在随机的位置。
条件:System->On start of Layout

view source print ?
1 //系统->画布启动时

动作:Monster->Set angle->random(360)

view source print ?
1 //怪物->设置角度->0-360随机度数

Condition: System -> On start of Layout
Action: Monster -> Set angle -> random(360)


此时,怪物依然移出画布,再也看不到,接着我们再来修改,让怪物移动边缘处的时候,自动往回移动,并且添加智能,让怪物朝着玩家角色移动(自然是角色没挂的时候)。
条件:Monster->Is outside layout

view source print ?
1 //判断怪物是否要离开画布

动作:Monster->Set angle toward position->For X,Player.X - for Y,Player.Y

view source print ?
1 //设置怪物朝向角色的坐标

再次运行游戏。此时你可以看到怪物在画布里朝着不同的方向移来移去,最终都会朝着角色围过来。这个智能的行为咱们不编程看不到代码(就算编程也太难,囧,要不也不找这软件了哈),将就着看吧,似乎不错了!
此我们的角色还是无敌的,怪物却是太脆落了,子弹一碰就挂了,接着我们通过instance variables实例变量来修改这些。

实例变量

Instance variables实例变量允许每个怪物存储它自身的生命值。一个变量简化了说就是一个可以改变的值。他们单独存储,分别带他们相应的实例。

我们来为怪物添加health实例变量。在工程或对象面板选择怪物monster(注意monster的意思就是怪物,本教程翻译的时候好多地方都是这样注释的,因为实际制作中我们是用英文的)。亦或,在画布中选取monster怪物对象。这样属性面板呈现的是怪物的相关属性。在properties bar属性面板的Instance variables分类下点击Add/edit:


弹出实例变量对话框,类似于早前的行为对话框。本对话框允许你为对象添加或修改实例变量。点击绿色+号按钮来添加新变量。


在弹出的对话框中输入变量名health,保持类型为Number(数字型),设置Initial value初始值为5。这使怪物拥有5个生命值。当他们被子弹射到时,生命值减1,直到为0,被消灭。
当我们点击OK确定。变量就出现在实例变量对话框中以及属性面板中,可以通过Add/Edit链接修改。

更改事件

切换到事件表(event sheet记得英文哦,教程中有些地方就写中文了,软件还是英文的,软件是可以汉化,但是太费时间,等心情好再说)中,我们来更改怪物被消灭的事件。
找到事件Bullet-on collision with Monster.现在的动作是destroy monster,右击该动作,选择Replace。


弹出的对话框和新建动作的对话框一样,选择Monster->Subtract from(in the Instance variables catrgory)->Instance variable "health",并输入值1。点击Done确定。该动作呈现如下:


现在我们射击怪物时,当子弹碰到怪物,怪物生命值减1,子弹爆炸消失,但我们得添加一个事件来检测怪物的生命为0时,让它消灭。添加如下事件:
条件:Monster->Compare instance variable->Health,Less or equal,0

view source print ?
1 //校对实例变量值是否<=0 不要用=0,连射可导致怪物生命值负数。

动作:Monster->Spawn another object->Explosion,layer1

view source print ?
1 //产生爆炸效果,你可以替换成怪物挂掉的效果

动作:Monster->Destroy

view source print ?
1 //怪物消灭


运行游戏,尝试射击

显示分数并存档

我们来添加分数显示功能,让玩家知道猎取了多少怪物,获得了多少分数。我们需要另外一个变量,但此时我们熬添加一个全局变量global variable。假设我们的游戏有好几关,全局变量就可以累积分数。全局变量适用于整个游戏,只有一个之存储着。
右击事件表底部,并选择Add global variable。

输入分数变量名Score。其他字段默认即可,点击OK确定。变量将从0开始计数。starting at 0.


现在全局变量呈现在事件表中:


注意:local variable局部变量限制于自身所在事件的作用范围,现在我们不用考虑这个,本例不用。其实很多东西都是参考程序里的,不过无所谓了,无视吧!
接着我们来添加动作,在Monster:health less or equal 0事件里添加动作System->Add to(under Global & local variables)->Score,value 1.如下:


现在玩家就拥有分数了,每当怪物被杀掉,就可以增加1分

Congratulations on finishing this tutorial!

Did you learn a lot from it? Share it now with your friends!

  • Tweet

如何用C2制作小游戏相关推荐

  1. python能制作游戏吗_如何用Python制作小游戏

    要想用Python制作小游戏,必须要安装一个插件Pygame 什么是Pygame Pygame是跨平台Python模块,专为电子游戏设计,包含图像.声音.建立在SDL基础上,允许实时电子游戏研发而无需 ...

  2. java 制作小游戏_如何用java制作小游戏

    展开全部 import javax.swing.Icon; import javax.swing.JOptionPane; public class CaiShuZi4JOptionPane { /* ...

  3. 如何用python制作小游戏

    1.准备 开始之前,你要确保Python和pip已经成功安装在电脑上噢,如果没有,请访问这篇文章:超详细Python安装指南 进行安装. Windows环境下打开Cmd(开始-运行-CMD),苹果系统 ...

  4. 如何用python制作五子棋游戏_Python制作打地鼠小游戏

    原文链接 Python制作小游戏(二十一)​mp.weixin.qq.com 效果展示 打地鼠小游戏https://www.zhihu.com/video/1200492442610450432 简介 ...

  5. 用JAVA制作小游戏——飞机大战(三)

    本篇博客是对飞机大战游戏项目完整代码的展示 详细代码讲解: 用JAVA制作小游戏--飞机大战(一) 用JAVA制作小游戏--飞机大战(二) 最下方附整个程序的文件下载链接 代码展示 主界面 impor ...

  6. 用JAVA制作小游戏——飞机大战(二)

    本篇博客是对飞机大战游戏使用代码的展示 重难点: 首先需要鼠标能够控制战机,使鼠标在窗口内时始终能够使战机的位置与鼠标相同,实现鼠标控制战斗机移动. 其次需要能够以一定的速度产生子弹和敌机,并且以一定 ...

  7. 用JAVA制作小游戏——推箱子(三)

    本篇博客主要是对推箱子地图编辑器功能的代码讲解. 首先给出这段代码的部分运行截图: 重难点: 地图编辑器主要有三个重难点: 需要有一个绘制地图的界面 能够实现地图绘制的功能 地图绘制完成后需要将地图内 ...

  8. 用JAVA制作小游戏——推箱子(二)

    本篇博客主要是推箱子游戏界面功能的代码讲解. 首先先给出这段代码的部分运行截图: 重难点: 游戏界面主要有五个重难点: 固定好地图的位置 地图的显示 构建菜单栏 读取地图数据 玩家操作功能实现 地图的 ...

  9. 用JAVA制作小游戏——推箱子(一)

    本篇博客是对推箱子游戏首页代码的展示 效果图: 难点: 在背景图上添加按钮. 由于直接使用add方法,会变成图片一块区域,按钮一块区域,彼此互不重叠,形成的界面效果不太好,因此用了JLayeredPa ...

最新文章

  1. js方法参数中含有单引号双引号的处理
  2. VSFTP配置参数详解
  3. linux目录怎么自动生成,情景linux--如何快速生成大文件?
  4. JavaScript强化教程——JavaScript Math(算数) 对象
  5. javascript --- 作用域和闭包
  6. 【HDU - 5700】【51nod - 1672】 区间交(贪心,STLset 或线段树第k大)
  7. mysql partition 性能_通过分区(Partition)提升MySQL性能
  8. Android学习笔记之ListView与Item的焦点冲突处理
  9. uva 550 有趣的乘法(dfs)
  10. 从王者荣耀看设计模式(五.组合模式)
  11. linux复制远程文件和文件夹
  12. 华为od德科面试数据算法真题解析-专栏必看-
  13. 下载小红书无水印照片
  14. 商务统计_6 用图表演示数据 - 定性数据
  15. ewebeditor编辑器解析漏洞
  16. 最近越来越当心,是不是自己真的老了。。。
  17. win10 1050ti anaconda搭建tensorflow-gpu
  18. 小程序开发可以用什么语言?
  19. 大一学生WEB前端静态网页——唯品会1页 包含hover效果
  20. 国内技术管理人员批阅google的“春运交通图”项目

热门文章

  1. java 代码实现卷积计算
  2. 原生前端三大件实现餐厅经营小游戏
  3. python数据归一化处理方法_python测试数据怎么归一化
  4. 基于51单片机的16x16点阵滚动广告牌仿真原理图程序
  5. Excel中HLOOKUP函数实例(一):自动判断并获取数据
  6. webgl函数 mix
  7. 信息系统项目管理师(2022年)—— 重点内容:项目组合管理(19)
  8. 产品思考之:2B or 2C
  9. arduino低功耗模式_ESP8266+DeepSleep+BMP280+ThingSpeak温度压力高度电量无线低功耗测量...
  10. 羽毛球是世界上飞行最快的球