Cocos Studio1.5.0.1开发学习笔记(一)

  听说Cocos Studio很久了,主要是因为骨骼动画。目前看来Cocos2d-x播放动画的方式只有2种:

  第一种:是播放序列帧动画,即将动画的每一帧都加载进缓存里,需要播放时再使用Animation类来播放,这种方法简单暴力,应对一些细节要求低的动画场景的时候,这么干无伤大雅。但是当动画帧数稍高的时候就会需要大量的图片,消耗资源很大。

  第二种:是由Cocos2d-x提供的Action类来播放动画,这种动画是在帧循环中靠调整每次渲染的坐标来打到动画效果,由于帧循环是1/60秒刷新一次,会让这样播放的动画非常流畅,而且不需要每一帧图片的资源。这种方案的缺点是播放动画的节点只能加载一张图片资源,当我们要实现一个如下的动画时,

  

  如果单从代码实现需要创建多个精灵,还要绑定各个精灵之间的协调和联动,总之会非常非常的麻烦。

  骨骼动画可以兼容以上两种方法的优点,同时不包含它们的缺点。所以现在越来越多的公司使用Cocos Studio来制作动画。

要使用Cocos Studio 首先要到官网 http://cn.cocos2d-x.org/download 下载你需要的Studio 版本,由于Cocos2d-x引擎本身的版本迭代速度比较快,有些版本的Studio并不能与引擎兼容,这里附上论坛上一个较为详细的版本对应下载 http://www.cocoachina.com/bbs/read.php?tid=154886。我使用的是刚发布不久的3.2版引擎,Cocos Studio 1.5.0.1能够对其兼容。

  初次使用我想完成两个学习目标:

  第一是学会制作骨骼动画,http://www.cocoachina.com/bbs/read.php?tid=189665 这个链接里有详细的描述,跟着一步一步来就可以了,我就不做复述了。(小插曲:我在试用mac版本刚发布的studio时发现了很多Bug,建议大家还是在window平台下使用)

  第二是在Cocos2d-x工程中使用Studio制作的动画。

  首先在Cocos2d-x的根目录下找到cocos2d-x-3.2\cocos\editor-support目录,将cocostudio目录以及其包含的文件复制到你新建工程所在目录下。然后用vs打开新建的项目,右击解决方案-》添加-》现有项目,把cocostudio添加进工程。接着右键你的工程-》属性-》c\c++-》常规-》附加包含目录,把cocostudio的目录导入进去。最后接着右键你的工程-》属性-》通用属性-》引用-》添加新引用。

  现在我们可以开始写代码了,首先要设计有个Hero类,用他来播放动画,代码如下:

 1 #ifndef __HERO_H__
 2 #define __HERO_H__
 3 #include "cocos2d.h"
 4 #include "cocos-ext.h"
 5 #include "CocoStudio.h"
 6 USING_NS_CC;
 7 using namespace cocostudio;
 8 USING_NS_CC_EXT;
 9 enum DIRECTION { LEFT, RIGHT, NONE };
10 class Hero:public Sprite
11 {
12 public:
13     CREATE_FUNC(Hero);
14     bool init();
15     void runLeft(float dt);
16     void runRight(float dt);
17     void attack();
18     void death();
19     void stop();
20
21     DIRECTION dir;
22     Size size;
23     Armature* armature;
24     bool isAniRunLeft;
25     bool isAniRunRight;
26 };
27 #endif

  我们在Hero的init函数里初始化动画,并调用一个stop函数加载一个站立时的动画:

 1 #include "Hero.h"
 2
 3 bool Hero::init()
 4 {
 5     Sprite::init();
 6     size = Director::getInstance()->getWinSize();
 7     ArmatureDataManager::sharedArmatureDataManager()->addArmatureFileInfo("Hero0.png", "Hero0.plist", "Hero.ExportJson");
 8     armature = Armature::create("Hero");
 9     armature->setScale(0.7f);
10     armature->setPosition(Vec2(size.width / 2, size.height / 2));
11     addChild(armature);
12     stop();
13
14     dir = NONE;
15     isAniRunLeft = false;
16     isAniRunRight = false;
17     return true;
18 }
19 void Hero::stop()
20 {
21     armature->getAnimation()->play("loading");
22 }
23 void Hero::runLeft(float dt)
24 {
25     float dis = dt * 200;
26     setPositionX(getPositionX() - dis);
27 }
28 void Hero::runRight(float dt)
29 {
30     float dis = dt * 200;
31     setPositionX(getPositionX() + dis);
32 }
33 void Hero::attack()
34 {
35     armature->getAnimation()->play("attack");
36 }
37 void Hero::death()
38 {
39     armature->getAnimation()->play("death");
40 }

  接着我们需要一个场景类,让我们的Hero在这个场景里面动起来:

 1 #ifndef __HELLOWORLD_SCENE_H__
 2 #define __HELLOWORLD_SCENE_H__
 3
 4 #include "cocos2d.h"
 5 #include "cocos-ext.h"
 6 #include "CocoStudio.h"
 7 #include "Hero.h"
 8 USING_NS_CC_EXT;
 9 class menuDelegate
10 {
11 public:
12     virtual void stopstate() = 0;
13 };
14 class Panel :public Menu
15 {
16 public:
17     menuDelegate* exm;
18     MenuItem* getSelectItem()
19     {
20         return _selectedItem;
21     }
22     static Panel* create()
23     {
24         Panel* ret = new Panel;
25         ret->init();
26         ret->autorelease();
27         return ret;
28     }
29     bool init()
30     {
31         Menu::init();
32         scheduleUpdate();
33         return true;
34     }
35     void update(float dt)
36     {
37         if (this->getSelectItem() && this->getSelectItem()->isSelected())
38             this->getSelectItem()->activate();
39         else
40         {
41             exm->stopstate();
42         }
43     }
44 };
45 class HelloWorld : public cocos2d::Layer,public menuDelegate
46 {
47 public:
48     // there‘s no ‘id‘ in cpp, so we recommend returning the class instance pointer
49     static cocos2d::Scene* createScene();
50
51     // Here‘s a difference. Method ‘init‘ in cocos2d-x returns bool, instead of returning ‘id‘ in cocos2d-iphone
52     virtual bool init();
53
54     // a selector callback
55     void menuCloseCallback(cocos2d::Ref* pSender);
56
57     // implement the "static create()" method manually
58     CREATE_FUNC(HelloWorld);
59
60     void stopstate();
61     void update(float dt);
62     void moveRight();
63     void moveLeft();
64     void moveAttack();
65     void moveDead();
66     void loadMenu();
67     Hero* hero;
68     Panel* menu;
69 };
70 #endif // __HELLOWORLD_SCENE_H__

  以下是场景类的cpp文件:

  1 #include "HelloWorldScene.h"
  2
  3 USING_NS_CC;
  4 using namespace cocostudio;
  5 Scene* HelloWorld::createScene()
  6 {
  7     // ‘scene‘ is an autorelease object
  8     auto scene = Scene::create();
  9
 10     // ‘layer‘ is an autorelease object
 11     auto layer = HelloWorld::create();
 12
 13     // add layer as a child to scene
 14     scene->addChild(layer);
 15
 16     // return the scene
 17     return scene;
 18 }
 19
 20 // on "init" you need to initialize your instance
 21 bool HelloWorld::init()
 22 {
 23     //////////////////////////////
 24     // 1. super init first
 25     if ( !Layer::init() )
 26     {
 27         return false;
 28     }
 29
 30     Size visibleSize = Director::getInstance()->getVisibleSize();
 31     Vec2 origin = Director::getInstance()->getVisibleOrigin();
 32
 33     /////////////////////////////
 34     // 2. add a menu item with "X" image, which is clicked to quit the program
 35     //    you may modify it.
 36
 37     // add a "close" icon to exit the progress. it‘s an autorelease object
 38     auto closeItem = MenuItemImage::create(
 39                                            "CloseNormal.png",
 40                                            "CloseSelected.png",
 41                                            CC_CALLBACK_1(HelloWorld::menuCloseCallback, this));
 42
 43     closeItem->setPosition(Vec2(origin.x + visibleSize.width - closeItem->getContentSize().width/2 ,
 44                                 origin.y + closeItem->getContentSize().height/2));
 45
 46     // create menu, it‘s an autorelease object
 47     auto menu = Menu::create(closeItem, NULL);
 48     menu->setPosition(Vec2::ZERO);
 49     this->addChild(menu, 1);
 50
 51     /////////////////////////////
 52     // 3. add your codes below...
 53
 54     // add a label shows "Hello World"
 55     // create and initialize a label
 56
 57     auto label = LabelTTF::create("Hello World", "Arial", 24);
 58
 59     // position the label on the center of the screen
 60     label->setPosition(Vec2(origin.x + visibleSize.width/2,
 61                             origin.y + visibleSize.height - label->getContentSize().height));
 62
 63     // add the label as a child to this layer
 64     this->addChild(label, 1);
 65     loadMenu();
 66     hero = Hero::create();
 67     addChild(hero);
 68     scheduleUpdate();
 69     return true;
 70 }
 71 void HelloWorld::update(float dt)
 72 {
 73     if (hero->dir == RIGHT)
 74     {
 75         hero->runRight(dt);
 76     }
 77     if (hero->dir == LEFT)
 78     {
 79         hero->runLeft(dt);
 80     }
 81 }
 82 void HelloWorld::loadMenu()
 83 {
 84     Size size = Director::getInstance()->getWinSize();
 85     auto closeItem1 = MenuItemImage::create("CloseNormal.png", "CloseSelected.png", CC_CALLBACK_0(HelloWorld::moveLeft, this));
 86     auto closeItem2 = MenuItemImage::create("CloseNormal.png", "CloseSelected.png", CC_CALLBACK_0(HelloWorld::moveRight, this));
 87     auto closeItem3 = MenuItemImage::create("CloseNormal.png", "CloseSelected.png", CC_CALLBACK_0(HelloWorld::moveAttack, this));
 88     auto closeItem4 = MenuItemImage::create("CloseNormal.png", "CloseSelected.png", CC_CALLBACK_0(HelloWorld::moveDead, this));
 89     menu = Panel::create();
 90     menu->addChild(closeItem1);
 91     menu->addChild(closeItem2);
 92     menu->addChild(closeItem3);
 93     menu->addChild(closeItem4);
 94     menu->alignItemsHorizontally();
 95     menu->setPositionY(menu->getPositionY() / 2);
 96     menu->exm = this;
 97     addChild(menu);
 98 }
 99
100 void HelloWorld::moveRight()
101 {
102     if (hero->dir == NONE)
103         hero->armature->getAnimation()->play("run");
104     float num = hero->armature->getRotationY();
105     if (num == -180)
106     {
107         hero->armature->setRotationY(0);
108     }
109     hero->dir = RIGHT;
110 }
111 void HelloWorld::moveLeft()
112 {
113     if (hero->dir == NONE)
114         hero->armature->getAnimation()->play("run");
115     float num = hero->armature->getRotationY();
116     if (num == 0 )
117     {
118         hero->armature->setRotationY(-180);
119     }
120     hero->dir = LEFT;
121 }
122 void HelloWorld::moveDead()
123 {
124     hero->death();
125 }
126 void HelloWorld::moveAttack()
127 {
128     hero->attack();
129 }
130 void HelloWorld::stopstate()
131 {
132     if (hero->dir == NONE)
133         return;
134     float num = hero->armature->getRotationY();
135     if (num == 0)
136     {
137         hero->stop();
138         CCLOG("111111");
139     }
140     else if (num == -180)
141     {
142         hero->stop();
143         hero->armature->setRotationY(-180);
144     }
145     hero->dir = NONE;
146 }
147 void HelloWorld::menuCloseCallback(Ref* pSender)
148 {
149 #if (CC_TARGET_PLATFORM == CC_PLATFORM_WP8) || (CC_TARGET_PLATFORM == CC_PLATFORM_WINRT)
150     MessageBox("You pressed the close button. Windows Store Apps do not implement a close button.","Alert");
151     return;
152 #endif
153
154     Director::getInstance()->end();
155
156 #if (CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
157     exit(0);
158 #endif
159 }

  运行后的效果如下:

  

Cocos Studio1.5.0.1开发学习笔记(一)

时间: 2024-10-14 07:38:07

Cocos Studio1.5.0.1开发学习笔记(一)的相关文章

cocos2dx游戏开发学习笔记2-从helloworld开始

一.新建工程 具体安装和新建工程的方法在cocos2dx目录下的README.md文件中已经有详细说明,这里只做简单介绍. 1.上官网下载cocos2dx-3.0的源码,http://www.cocos2d-x.org/ 2.安装python2.7 3.运行setup.py安装 4.执行cocos new helloworld -p helloworld -l cpp,生成新工程 二.新建工程中包含的东西 -Classes AppDelegate.cpp      -----游戏真正开始执行的地

IBatis .NET 开发学习笔记——.NET 开发环境搭建

大家好,今天给大家带来的是web应用程序配置,至于windows应用程序或者其他类型解决方案可以相同的配置,web应用程序配置文件为web.config,windows应用程序是app.config. 通过以下步骤可以建立属于你自己的环境: 1.首先,肯定是打开Visual Studio(文章后面简称VS),如果你有其他工具开发,我也不介意,反正我用VS,VS目前最新版是2013,不过我喜欢复古,所以,我目前用安装VS2010来当作教程,不管目前是多少版本了,都可以同理得到. 2.然后,新建一个

【web开发学习笔记】Structs2 Action学习笔记(一)

1.org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter准备和执行 2. <filter-mapping> <filter-name>struts2</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> url-pattern约定熟成只写/*,没必要写*.action 3. <

Django Web开发学习笔记(5)

第五部分 Model 层 创建一个app工程.app和project的区别引用DjangoBook的说法是: 一个project包含很多个Django app以及对它们的配置. 技术上,project的作用是提供配置文件,比方说哪里定义数据库连接信息, 安装的app列表, TEMPLATE_DIRS ,等等. 一个app是一套Django功能的集合,通常包括模型和视图,按Python的包结构的方式存在. 例如,Django本身内建有一些app,例如注释系统和自动管理界面. app的一个关键点是它

【Android开发学习笔记】【第三课】Activity和Intent

首先来看一个Activity当中启动另一个Activity,直接上代码说吧: (1)首先要多个Activity,那么首先在res-layout下新建一个 Other.xml,用来充当第二个Activity的布局文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&qu

IOS开发学习笔记-(3) 进度条、等待动画开始停止

一.创建对应空间视图  ,如下图: 二.编写对应的 .h 代码,如下 : #import <UIKit/UIKit.h> @interface ViewController : UIViewController @property (weak, nonatomic) IBOutlet UIActivityIndicatorView *activWaitNetWork; @property (weak, nonatomic) IBOutlet UIProgressView *pgrsDownLo

IOS开发学习笔记(二)-语音识别(科大讯飞)

上次简单地讲解了如何利用科大讯飞完成语音合成,今天接着也把语音识别整理一下.当然,写代码前我们需要做的一些工作(如申请appid.导库),在上一篇语音合成的文章当中已经说过了,不了解的可以看看我上次的博文,那么这次直接从堆代码开始吧. 详细步骤: 1.导完类库之后,在工程里添加好用的头文件.在视图里只用了一个UITextField显示识别的内容,两个UIButton(一个开始监听语音,一个结束监听),然后引入类.添加代理,和语音合成的一样. MainViewController.h 1 #imp

Kinect开发学习笔记之(一)Kinect介绍和应用

Kinect开发学习笔记之(一)Kinect介绍和应用 [email protected] http://blog.csdn.net/zouxy09 一.Kinect简单介绍 Kinectfor Xbox 360,简称 Kinect,是由微软开发,应用于Xbox 360 主机的周边设备.它让玩家不须要手持或踩踏控制器,而是使用语音指令或手势来操作 Xbox360 的系统界面.它也能捕捉玩家全身上下的动作,用身体来进行游戏,带给玩家"免控制器的游戏与娱乐体验".其在2010年11月4日于

android开发学习笔记001a

Android 应用与开发环境 1.使用SDK版本:Android 2.3 . 2.发展和历史 创始人:Andy Rubin,Android公司被Google收购.07年11月5日1.0发布. 3.平台架构及特性 Linux内核(操作系统)->函数库,Android运行时(中间件)->应用程序框架->应用程序 我要学习的就是如何在android 操作系统里开发应用程序. 我们只和应用程序框架(Android API)打交道.也就是我们的SDK. 函数库是C/C++的库. Android