作为菜鸟曾一直使用手写cocos2dx界面,最近一直在研究cocostudio这个工具。尝试着使用工具来快速的开发游戏,折腾了一个多星期了,每天不停的搜索资料。

记录下本人试用cocostudio制作的启动界面所遇到的问题和经验,方便以后查阅。

首先设置编辑器的分辨率为480*800安卓分辨率的大小。

添加一个sprite精灵使用大小为480*800的图片(background.png)作为背景,然后添加sprite精灵作为游戏logo(logo.png),继续添加sprite作为进度条的背景(loading_bj.png),然后在进度条背景上面添加进度条控件(LoadingBar.png),设置进度条进度为1%,进度条方向类型为从左到右,最后在进度条控件上方添加一个text文本标签用来显示进度条进度值。

QQ20160119-1@2x.png

在cocostudio中编辑好场景后,我们通过项目菜单中的发布与打包进行csb文件的发布。

最后我们在cocos2dx中来读取csb文件,通过交互来使用控件。

本博客主要目标:1、加载cocostudio发布的csb文件。2、自动改变进度条的进度值和标签文本显示值。


1、在cocos2dx中加载csb文件

参照上一篇博客讲到的

CocoStudio使用笔记1:cocos2dx3.4加载CocoStudio导出的csb文件

http://www.byjth.com/tools/41.html


2、自动改变进度条改变状态值和标签显示值

参照以前的一篇博客,

Cocos2dx学习笔记12:cocos2dx进度条(ProgressTimer)

http://www.byjth.com/biji/32.html


下面我把本次的实现代码贴出来。

cocos2dx3.9使用CocoStudio制作的进度条LoadingBar.png

cocos2dx3.9使用CocoStudio制作的进度条LoadingBar.png

通过简单的代码我们就可以获得一个非常精美的Loading场景,当然画面的精致程度还是和美术有很大的关系。

这里我的xcode模拟器设置为480*800的。启动模拟器来预览下最后的效果。

进度条.gif

到现在为止我吗使用简单的几句代码就可以创建一个精美的场景,当然本图中为使用了粒子特效。因为不需要交互,这里不做解释,有时间我们再来介绍下进度条加载完成后自动切换下一个场景的应用。


CocoStudio使用笔记2:cocos2dx3.9使用CocoStudio制作的进度条LoadingBar

http://www.byjth.com/tools/43.html