使用Cocos Studio 创建帧动画《1》

我在前面的博客中介绍了使用Cocos Studio创建一个简单的工程和Cocos Studio工程分析

这篇博客将介绍使用Cocos Studio 创建帧动画,在以前我们通常是通过代码创建动画,今天介绍使用Cocos Studio 创建动画,不需要写一行代码,这样就可以提高开发效率,使用代码创建动画的方法,可以参考我的博客Cocos2d-X使用CCAnimation创建动画

 

首先打开Cocos Studio

使用Cocos Studio 创建帧动画《1》_第1张图片

 

创建一个项目,创建好后会进入项目界面,创建项目的方法可以参考我的博客使用Cocos Studio创建一个简单的工程

使用Cocos Studio 创建帧动画《1》_第2张图片

 

删除创建中的图片(删除HelloWorld.png)选择Demo(创建的项目名),并且单击鼠标右键,并且选择新建文件

使用Cocos Studio 创建帧动画《1》_第3张图片

 

设置文件名为Node,设置类型为节点,然后单击新建

使用Cocos Studio 创建帧动画《1》_第4张图片

 

进入节点编辑界面

使用Cocos Studio 创建帧动画《1》_第5张图片

 

导入创建动画所需要的资源:选择Demo(创建的项目名),并且单击鼠标右键,并且选择导入资源

使用Cocos Studio 创建帧动画《1》_第6张图片

 

 选择资源,选择完成后点击选择

使用Cocos Studio 创建帧动画《1》_第7张图片

 

资源成功导入到Cocos Studio中的效果

使用Cocos Studio 创建帧动画《1》_第8张图片

 

拖一个精灵到节点中

使用Cocos Studio 创建帧动画《1》_第9张图片

 

左手按住键盘上的Ctrl键,右手选择创建动画的图片

使用Cocos Studio 创建帧动画《1》_第10张图片

 

将图片拖着精灵中

使用Cocos Studio 创建帧动画《1》_第11张图片

 

设置动画的帧数,并且单击确定

使用Cocos Studio 创建帧动画《1》_第12张图片

 

播放动画

 

将动画放到场景中

使用Cocos Studio 创建帧动画《1》_第13张图片

 

选择项目

 

选择发布项目

使用Cocos Studio 创建帧动画《1》_第14张图片

 

选择发布为Visual Studio工程,并且单击确定

使用Cocos Studio 创建帧动画《1》_第15张图片

 

操作完成后会自动启动Visual  Studio,并且会自动转到创建的项目

使用Cocos Studio 创建帧动画《1》_第16张图片

 

打开HelloWorldScene.cpp文件,在HelloWorld::init()中添加下面的代码

  if(!Layer::init())
    {
        return false;
    }
    
	//加载Cocos Studio编辑好的资源
    auto rootNode = CSLoader::createNode("MainScene.csb");
    addChild(rootNode);

	//加载动画: 
	ActionTimeline *action = CSLoader::createTimeline("Node.csb"); 
	rootNode->runAction(action); 
  
	//播放动画
	//从第0帧到25帧循环播放
	action->gotoFrameAndPlay(0, 25, true);

    return true;

 

程序的执行结果

使用Cocos Studio 创建帧动画《1》_第17张图片

 

单击此处下载完整的项目

你可能感兴趣的:(使用Cocos Studio 创建帧动画《1》)