quick-cocos2d-x从零开始游戏开发笔记（三）：参照Flappy Bird制作第一个游戏①

人气小游戏FlappyBird我想就不用过多的介绍了。其最疯狂的时期每天能获得5W美元的广告收入。

下面我们将根据这款游戏来动手开发我们的第一个游戏。

从资源管理器找到 quick-cocos2d-x\bin 文件夹，然后打开一个cmd窗口，把create_project.bat这个批处理文件拖到cmd窗口里面，然后在后面输入空格com.quickx.game.mybird，按回车，如果项目的环境配置没有问题的话，项目应该就创建好了。

游戏默认创建到C盘了，我的具体路径是C:\Users\Administrator\mybird

打开SublimeText3，依次按快捷键ctrl+k，ctrl+b，打开侧边栏。把mybird文件夹整个拖进去。

这时候项目就创建好，可以开始编写程序了。建议装一下QuickXDev插件。和SublimeText结合起来开发事半功倍。

如果装过QuickXDev插件，我们可以在scripts文件夹上面点右键，选Run With Player直接运行看效果，按F5就可以刷新。不得不说quick-x-player非常的方便。

左边是运行的一些debug信息，右边的Hello World窗口默认有点大，可以在config文件里面修改默认打开的分辨率。这里我把窗口调成50%大小了。

上面是我下载的原版FlappyBird里面解压出来的图片资源，是一张大图，可惜没有plist文件，如果有plist文件就可以直接在项目中使用了。

只好把需要用到的一部分图片用PhotoShop6截取出来

先用快速选择工具选中需要截取的图片，然后ctrl+n新建一个文件，新文件的画布大小会根据剪切板自动调整的。然后把新文件另存起来。

下面是我截取好的一些图片，根据图片的用途命名好，看到命名就应该大概知道图片的用途，养成好习惯。

下面需要用到cocostudio把这些小图片合成，变成一张大图片和plist的形式。

打开cocostudio，选择第一个Animation Editor。

新建项目->在Resources文件夹点右键，选择导入文件。把这些图片加进去。然后选择文件->导出项目。

    

导出的时候，导出资源里面，选择导出全部大图

把这两个文件拷贝到项目目录的res文件夹下

根据背景图的大小，我们把项目的窗口大小设置成288 x 512大小。修改scripts文件夹下的config.lua文件并保存。

下面为游戏加入背景图片

打开SublimeText，在scripts->app->scences文件夹下新建 MenuScene.lua

在新建的MenuScene.lua文件插入如下代码

local MenuScene = class("MenuScene", function()
    return display.newScene("MenuScene")
end)

function MenuScene:ctor()
	display.addSpriteFramesWithFile("MyBird0.plist", "MyBird0.png")

	self.bg = display.newSprite("#bird_bg.png", display.cx, display.cy) 
	self:addChild(self.bg)
end

function MenuScene:onEnter()
end

function MenuScene:onExit()
end

return MenuScene

修改一下MyApp.lua文件，让程序从MenuScene启动

好了，重新在scriptc文件夹上面按右键 -> Run With Player

喔，终于看到东西了~

	local spriteTitle = display.newSprite("#bird_logo.png", display.cx, display.top - 100)
	spriteTitle:addTo(self)

	-- 创建HERO的动画
	local frames = display.newFrames("bird%01d.png", 1, 3)
	local sprite = display.newSprite(frames[1])
	local animation = display.newAnimation(frames, 1 / 7)		--1秒播放3帧 
	sprite:playAnimationForever(animation)		-- 循环播放动画
	sprite:setPosition(display.cx, display.cy + 50)

	self:addChild(sprite)

在MenuScene:ctor()方法里面添加上面的代码。加入游戏标题还有游戏的第一只精灵，一只呆呆的小鸟。

保存，在player里面F5刷新游戏的效果