这篇文章中，我们将做个简单的登录界面，实现这样的效果，无限滚动的背景，上面有两个小鸟在飞翔，一个登录按钮，按钮上面有两个人物在奔跑。
目前项目的整体效果如下图：
OK~~~开始，第一步，我们先新建一个空工程，如下图：
接着我们新建几个文件夹，比如预设体、场景、纹理、动画、声音等，做好分类，如下图：
我们把我们需要的资源放进去，一张背景图，还有人物跑动的图，小鸟的图，还有bgm背景音乐，但注意，从网上down的资源里只有大图，没有对应的plist文件，就无法计算切割大图里的各个小图。我们先用PS处理下大图，如下图：
使用切片工具把大图切成各个小图，保存，然后我们用TP软件把各个小图合成大图跟对应的plist文件，如下图：
导出格式我们选cocos2d-x，可以看到会生成一张纹理大图跟对应的plist文件，接下来我们把所需的资源都导到项目工程里，如下图：
资源导入后，我们新建一个场景，叫Menu，点击Canvas，我们将设计分辨率改成1134*750，iphone6的分辨率，
接下来我们需要加个背景，直接把背景纹理拖进去，用矩形变换工具等比例改变图的大小，就是放大，大小超出紫色框，紫色框就是我们可见的屏幕范围，如下图：
但这样只是背景不动，体验会差点，所以我们做个背景无限滚动的效果。首先，我们新建一个空节点，叫bg，拖两张一样的背景图到bg里，分别叫bg1，bg2，调整位置，无缝连接在一起，如下图：
然后我们给节点bg添加一个animation组件，并且新建一个动画clip，叫做menu_bg_loop_clip，把clip拖进animation组件中，Play On Load打钩，如下图：
然后我们点击动画编辑器，打开左上角的开启编辑模式，点击属性列表的➕，我们选x，水平移动属性，加入关键帧，需要移动的位置，模式选loop，修改sample跟speed可以调整动画运行，速度如下图：
不过感觉还是单调了点，我们加入两只飞翔的小鸟，这样的话，就感觉生动了许多。首先，我们加个一个精灵，叫birds1，给它加上两个动画组件，小鸟有两个动画，一个是自身扇翅膀的动画，一个是位移的动画，然后创建两个clip，分别叫birds_fly_clip，birds_move_clip，如下图：
首先我们编辑鸟自身的动画，其实就是添加帧动画，属性列表添加spriteFrame，如下图：
然后就是添加位移动画了，这个可以随便自己定义位置，第一个只鸟我们只是移动位置x，然后我们把鸟拖进Preb中，做成预设体，同理第二只鸟也是一样的操作，位移动画我们可以跟第一只鸟不一样，同样做成预设体，，如下图：
然后我们添加一个button，如下图：
接下来，我们在按钮上添加两个精灵，分别叫p1，p2，它们会做一个奔跑的动画，帧动画的添加从上同那样操作就可以，如下图：
OK，差不多了，这样我们不用写一行代码，看看效果如何：
我感觉还行，就是gif效果不好~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
