本篇教程通过制作捕鱼达人的启动界面来说明CocoStudio UI编辑器的用法。先看看效果图

好了,下面一步一步的动手做吧!

1、打开软件

2、新建项目

依次打开软件主界面左上角菜单栏的:“文件”-->“新建项目”,弹出窗口如下图

输入项目名称和保存路径,点确定

3、导入UI资源

可以导入文件或文件夹

成功导入后,在“资源”视图会列出导入的文件,由小图组成的大图(含.plist文件的图)会列出小图,大图直接不能使用,也不会列表中出现。

4、制作背景

到此背景层添加完毕

5、添加捕鱼达人的图标

参照第4步添加一个控件,然后放到合适的位置。并命名为icon。需要注意的是在添加之前,请确定在对象结构视图选中的是Panel而不是background。否则添加的控件属于background的子空间。

6、添加开始按钮

再添加“开始游戏”按钮,这也是一个按钮控件。这个控件是属于startGame的子空间。

7、添加“选择场景”按钮,方法参照第6步,我这里偷个懒,就不截图了。

8、最后一步当然是导出了。先保存工程“文件”-->“保存工程”。再导出工程,导出后的文件工场景编辑器使用。导出很简单。直接“文件”-->"导出项目"。弹出对话框

默认就可以,其它选项可以自己试试,看看导出的文件有什么不同。

工程文件下载地址可以到我的资源下载里面找http://download.csdn.net/detail/fuyongbing1986/6225089。哈哈,放心不要积分哦。

下一篇将写怎样在场景编辑器中如何使用UI编辑器导出的文件。

UI编辑器的更多相关文章

  1. Cocos2d-x 3.2 学习笔记(十三)CocoStudio UI编辑器 by 保卫萝卜

    关于编辑器部分研究的不多,但基本能使用.最近时间不是很多,因此写blog的次数越来越少了.自从玩了<保卫萝卜>时候一直想要写一下,同时练下手感.基本的结构已经写的差不多了,主要完善写UI和 ...

  2. 超棒的 15 款 Bootstrap UI 编辑器

    自从 2011 年 Mark Otto 和 Jacob Thornton 开发了  Bootstrap,我们第一次接触并熟知了 Bootstrap .这些都归功于  Twitter!从那以后,它就非常 ...

  3. CocoStudio UI 编辑器的使用

    详细教程:http://www.cocoachina.com/bbs/read.php?tid=161567 Table of Contents 1 游戏中的 UI 1.1 基于 Cocos2d-x ...

  4. 使用 CocoStudio UI 编辑器实现《乱斗堂》设置界面

    由于是引用别人的,所以直接贴上地址了.http://www.cocoachina.com/bbs/read.php?tid=164820&fpage=7 1 游戏中必不可少的 UI 元素    ...

  5. laya的UI编辑器

    //加载一个图集 Laya.loader.load("res/atlas/comp.json",Handler.create(this,this.onLoaderComp), Ha ...

  6. Bootstrap-Other:UI 编辑器

    ylbtech-Bootstrap-Other:UI 编辑器 1.返回顶部 1. Bootstrap UI 编辑器 以下是 15 款最好的 Bootstrap 编辑器或者是在线编辑工具. 1. Boo ...

  7. cocostudio ui编辑器 使用心得

    1 c++包含路径 2九宫格设置 cocostudio ui编辑器设置九宫格x,y,w,h是从图片左上角开始测量,然后调整尺寸就行了. 2.  如果点了自适应  panel会在加载json的时候被设置 ...

  8. [使用经验]cocostudio UI编辑器的裁剪

    日志-2015/03/16 描述:在程序使用UI编辑器导出文件的时候,该panel中大于panel的部分都没有显示出来,例如人物,一些特效等 原因:UI编辑器panel都勾上了裁剪 解决:在编辑器中把 ...

  9. 四款免费好用的Bootstrap ui编辑器

    Bootstrap带来了设计革命,本文介绍的四种免费Bootstrap在线设计工具,可视化所见所得设计网页,然后输出Html/CSS代码,其中有些甚至可以实现拖曳,也有可以设定自己的主题模板Theme ...

随机推荐

  1. C# 课堂总结1-二进制转换

    一.目的:便于计算机表示,稳定性好,符合逻辑运算,真为1,假为0. 二.各进制表示方法: 2进制:0,1 8进制:0-7 16进制:0-9,A,B,C,D,E,F 二.转换方法: 1.各进制转换为10 ...

  2. 06-UIKit(tableView数据模型)

    目录: 一.UIPageControl 二.table view数据模型 三.反向传值给TableView并更新 回到顶部 一.UIPageControl在页面下显示点 1 重要属性 .numberO ...

  3. WCF技术剖析之二十五: 元数据(Metadata)架构体系全景展现[元数据描述篇]

    原文:WCF技术剖析之二十五: 元数据(Metadata)架构体系全景展现[元数据描述篇] 在[WS标准篇]中我花了很大的篇幅介绍了WS-MEX以及与它相关的WS规范:WS-Policy.WS-Tra ...

  4. Android解析Excel文档完整示例

    MainActivity如下: package cc.testexcel; import java.io.File; import jxl.Cell; import jxl.CellType; imp ...

  5. WPF中控件ListView和DataGrid典型属性介绍

    ListView GridView View视图 重要属性: public bool AllowsColumnReorder 获取或设置一个值,该值指示 System.Windows.Controls ...

  6. java中的object类

    在Java中,任何一个类都扩展来自Object类.当没有为某一个类定义父类时,Java会自动定义Object类为其父类. object类的一些常用方法: (1)public String toStri ...

  7. codeforces #267 C George and Job(DP)

    职务地址:http://codeforces.com/contest/467/problem/C 太弱了..这题当时都没做出来..思路是有的,可是自己出的几组数组总是过不去..今天又又一次写了一遍.才 ...

  8. Python 3语法小记(四)字典 dictionary

    字典是Python里面一种无序存储结构,存储的是键值对 key - value.关键字应该为不可变类型,如字符串.整数.包含不可变对象的元组. 字典的创建很简单,用 d = {key1 : value ...

  9. android圆形进度条ProgressBar颜色设置

    花样android Progressbar http://www.eoeandroid.com/thread-1081-1-1.html http://www.cnblogs.com/xirihanl ...

  10. TNetHttpClient支持异步访问(Delphi 10.1 Berlin,红鱼儿的博客)

    Delphi 10.1进一步改进自Delphi 10带来的Http访问控件TNetHttpClient,支持异步访问,同时增加ConnectionTimeout及ResponseTimeout两个超时 ...