本篇教程通过制作捕鱼达人的启动界面来说明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. pomelo 协议

    分析的是hybridconnector,使用的chatofpomelo-websocket(pomelo为0.7.0) 參考:https://github.com/NetEase/pomelo/wik ...

  2. swift 关于 toolbar 学习笔记

    import UIKit class ViewController: UIViewController { @IBOutlet weak var toolBar: UIToolbar! @IBOutl ...

  3. C++sort函数使用总结

    头文件:algorithm 对于(整数/字符)数组进行比較时,可直接通过sort(a,a+n)或sort(a.begin(),a.end())进行排序,默认升序排列,须要高速实现降序时,有三种方案 1 ...

  4. 距离变换DT

    距离变换:计算区域中的每个点与最接近的区域外的点之间距离,把二值图象变换为灰度图象. 对于目标中一个点,距离变换的定义为改点与目标边界最近的距离. 目标点离边界约近则值越小,转换的点越暗:越远,值越大 ...

  5. 自己python程序的并行修改

    遇到运算量大的程序,学习了下python并行运算的方法,在自己的程序上进行了修改,看看是否可以增加效率.原始代码是: import gt_apps as my_apps f=file('sample. ...

  6. 02-OC方法、属性

    目录: 一.方法 二.实例变量 三.属性(点语法) 四.初始化方法(自定义构造方法) 回到顶部 一.方法 1 函数与方法有什么区别? 函数只是一个程序的代码段,与类无关. 方法,类的一部分,代表对象可 ...

  7. C#利用lambda实现委托事件的挂接

    转自:http://www.cdtarena.com/cpx/201307/9287.html在写一个小程序的时候,碰到了这样的问题,需要用委托来挂接事件,但是又想在这事件中使用局部的变量,而委托一旦 ...

  8. JAVA刚碰见的问题( java.lang.SecurityException: The jurisdiction policy files are not signed by a trusted signer)

    原文:刚碰见的问题 1.  failed to load the jni shared library jre bin server jvm.dll 解决:这个主要是eclipse的版本和安装的jdk ...

  9. window批处理-3.go

    go: 控制批处理中的命令运行流程 命令格式: go label lable--行号 demo bat @echo off echo 跳过中间.运行最后 goto last type a.txt :l ...

  10. Delphi体系内部的4种消息传递办法(Send,Post,Perform,Dispatch)

    一.什么是消息? 消息是windows对应用程序发送的有关‘发生了某种事件’的通知.例如点击鼠标,调整窗口大小或键盘上按下一个键,都会引起windows发送一条消息到应用程序中去,去通知应用程序发生了 ...