Tui-x简介 ( 转 ) ---- 1

1.什么是Tui-x

Tui- x是一个创建cocos2d-x UI界面的解决方案,而builder用的则是FlashCS,通过使用jsfl来拓展FlashCS从而达到UI编辑器的功能。这个jsfl所做的工作 十分简单,举个例子,如果你的项目是CPP的话,它会帮你导出一份界面xml和一个.h,xml文件将会使用tui的解析库来解析,头文件则是一个tag 的映射表,(如果是Lua项目则会帮你导出xml和lua文件),你可以利用这个tag映射表轻松地获取任意一个控件。

2.Tui-x所生成组件是什么

Tui-x所生成组成来自CocosWidget,这是一个优秀的第三方组件库,包含富文本,网格等高级控件,数量之多,质量之高,绝不亚于其他任何一款编辑器。(注:CocosWidget简称ccw)
值得一提的是,Tui-x已经可以完全可视化生成所有ccw的控件,包括CTableView,CListView,CGridView等高级复合控件,这些编辑操作完全在FlashCS中完成,门槛十分低廉,你甚至可以完全交给美术和策划去做界面。

(设计界面)

(生成界面)

3.Tui-x的特点是什么

①Tui-
x使用门槛十分低廉,只要会使用FlashCS创建影片剪辑即可进行开发。一个场景对应一个fla文件,便于美术分工,互不依赖。所有组件的创建需要遵循
命名规则,如果你之前有玩过mornui的话,将会十分有亲切感。举例,创建一个按钮,需要创建一个影片剪辑并改名,成btn_前缀,如btn_ok,这
个按钮所使用的资源图会根据你这个影片剪辑所在库路径去找相应的资源。如,这个btn_ok在fla库中的main/下,那么它在游戏中会去找
Resouce/main/下的btn_ok_normal.png,btn_ok_select.png
和 btn_ok_disable.png 。(注:找不到纹理不会崩)
这里的_normal就是固定的后缀命名规则,而btn_则是固定的前缀命名规则,在下篇文章中将会详细列出所有命名规则。

②Tui-
x的资源管理十分自由,完全交由开发者管理,自己加载plist和自己删除plist,这样看起好像不太智能,其实是把管理权还给开发者。这样有利于资源
重用。控件创建分两种模式,spriteFrame和普通png图。[spriteFrame模式:加载plist,并使用该纹理创建控件]
[普通png图:直接用散图png来创建控件]
 在只要在fla库中,把目录结构跟项目真实资源目录一一对应,然后在把控件spriteFrame勾选上即可。

③利用FlashCS的先天优势,Tui-x可以做到很多ccs和ccb都做不到的事,比如字体描边和阴影,运行效果如上图。编辑复合控件,如CListView和CGridView等,做背包so easy。

3.Tui-x的触摸机制是怎样的

Tui-
x严格来说,它不是一套框架,它只是一个工具,帮助开发者生成ccw,所以它的触摸机制就是ccw的树状触摸方式,所有触发事件全部来自
CWidgetWindow分发,更多关于cocoswiget的描述请戳http://blog.csdn.net/cocosviva
/article/details/18970717
 ,值得一提的是,在ccw里要实现popup效果将会是一件十分简单的事,你根本不用考虑或设置触摸优先级。在github上的例子中有演示。

4.Tui-x的优势是什么

Tui-
x有2.2.3 和 3.0 正式版两个版本 ,分别对应cpp 和
lua,满足各个项目的开发需求。而编辑器jsfl的总代码量仅1500行,tui解析库总代码量700行,这个数量级我看除了Tui没有哪款编辑器能做
到。有人说:你不就是借Flash的肩膀么,吊什么吊。我只能说,you can you up !  Tui-x就是不重复造轮子的最佳例子。

虽然XML的解析比JSON稍稍慢点,但是Tui-x是使用RapidXML解析,并有做缓存,所以不存在解析瓶颈。

Tui-x不单单只能生成普通控件,它能够生成骨骼,EditBox,粒子等特殊组件,骨骼 推荐使用Flash的龙骨插件dragonbonepanel 全部都是可视化,完爆ccs的ui编辑器 + 场景编辑 + 骨骼编辑器。[对不起我并没敌意,我只是说实话]

Tui-x拓展性是一流的,学过js的甚至可以直接修改jsfl,在导出的xml中增加若干个字段十分容易。再看看ccw,如果对ccw有了解的话,也可以定义控件并融合到Tui-x中,后面的文章将会教大家如何制作自己的控件,并用Tui-x生成。

Tui-x使用代码十分简单,寥寥几行,通过附送的.h或lua获取任意控件,监听事件。

[cpp] view plaincopy

  1. <span style="font-size:14px;">//cpp
  2. void Mainui::onLoadScene()
  3. {
  4. TuiManager::getInstance()->parseScene(this,"panel_main",PATH_MAIN);
  5. }
  6. </span>

[cpp] view plaincopy

  1. <span style="font-size:14px;">--lua
  2. function Welcomeui:create()
  3. local ret = Welcomeui.new()
  4. TuiManager:getInstance():parseScene(ret,"panel_welcome",PATH_WELCOMEUI)
  5. return ret
  6. end
  7. </span>

5.为什么要使用Tui-x开发 

Tui-
x上手容易,开发便捷,ccw这套组件是久经磨练,精心设计的,接口十分人性化,还包含lua和cpp还有3.x版,由于FlashCS是跨平台
的,Tui-x一不小心也跨平台了。另一方面看,cocosbuilder已经没人维护了,忽略。再看cocostudio,经常崩溃不说,你叫美术用来
做个场景教半天,还经常投诉难用,再看看导出来的ExportJson,冗余数据一堆,体积大不说,崩溃了还不好调试,富文本中文换行乱码,无力吐槽,你
说用ccs做骨骼动画,好吧,错位,各种闪屏。你要记住,开发不是纯写代码的。以上问题Flash都能很好地解决,美术同学更愿意用Flash和Ps。

6.项目历史,鸣谢和交流

Tui-x的诞生前有一个叫tui的项目,也是用jsfl做编辑器,作者
仝鹏飞,但当时的tui控件只有panel,image,button这三个,根本不能满足开发需求,后来Tui-x诞生了,抛弃原有的结构和接口,重新
打造全新的Tui-x,之所以叫Tui-x,纯粹是尊重原著。

感谢CocosWidget的作者 李俊霖 Jason.lee 同学,感谢 仝鹏飞 同学。

CocosWidget 官方群261286285 Tui-x 官方群 347085657

7.下载

Tui-x 2.x :  https://github.com/LingJiJian/tui/tree/Tui-x
   Tui-x 3.x  https://github.com/LingJiJian/Tui-x

时间: 2025-01-15 03:32:20

Tui-x简介 ( 转 ) ---- 1的相关文章

Android网络通讯简介

网络通信应该包含三部分的内容:发送方.接收方.协议栈.发送方和接收方是参与通信的主体,协议栈是发送方和接收方进行通信的契约.按照服务类型,网络通信可分为面向连接和无连接的方式.面向连接是在通信前建立通信链路,而通信结束后释放该链路.无连接的方式则不需要在通信前建立通信连接,这种方式不保证传输的质量. Android提供了多种网络通信的方式,如Java中提供的网络编程,在Android中都提供了支持.Android中常用的网络编程方式如下: 针对TCP/IP协议的Socket和ServerSock

微信红包的架构设计简介

@来源于QCon某高可用架构群整理,整理朱玉华. 背景:有某个朋友在朋友圈咨询微信红包的架构,于是乎有了下面的文字(有误请提出,谢谢) 概况:2014年微信红包使用数据库硬抗整个流量,2015年使用cache抗流量. 微信的金额什么时候算? 答:微信金额是拆的时候实时算出来,不是预先分配的,采用的是纯内存计算,不需要预算空间存储.. 采取实时计算金额的考虑:预算需要占存储,实时效率很高,预算才效率低. 实时性:为什么明明抢到红包,点开后发现没有? 答:2014年的红包一点开就知道金额,分两次操作

JSON 简介

ylbtech-JSON: JSON 简介 JSON:JavaScript Object Notation(JavaScript 对象表示法) JSON是存储和交换文本信息的语法,类似 XML. JSON 比 XML 更小.更快.更易解析. JSON 实例 { "employee":[ {"firstName":"John","lastName":"Doe"}, {"firstName"

Docker简介

Docker简介 什么是Docker: 正所谓Docker的英文本意为"搬运工",所以在我们的世界里,可以理解为Docker搬运的是装满任意类型的APP的集装箱,开发者可以通过Docker将APP变成一种标准化的.可移动植的.自动管理的组件.它用一种新的方式实现了轻量级的虚拟机,专业术语成为应用容器(Application Container) Docker的优势: 1.利用率高 ·Docker对系统资源的利用率很高,一台主机可以同时运行数千个Docker容器 2.可以快速的交付应用程

kafka入门:简介、使用场景、设计原理、主要配置及集群搭建(转)

问题导读: 1.zookeeper在kafka的作用是什么? 2.kafka中几乎不允许对消息进行"随机读写"的原因是什么? 3.kafka集群consumer和producer状态信息是如何保存的? 4.partitions设计的目的的根本原因是什么? 一.入门 1.简介 Kafka is a distributed,partitioned,replicated commit logservice.它提供了类似于JMS的特性,但是在设计实现上完全不同,此外它并不是JMS规范的实现.k

Quartz.NET简介及入门指南

Quartz.NET简介 Quartz.NET是一个功能完备的开源调度系统,从最小的应用到大规模的企业系统皆可适用. Quartz.NET是一个纯净的用C#语言编写的.NET类库,是对非常流行的JAVA开源调度框架 Quartz 的移植. 入门指南 本入门指南包括以下内容: 下载 Quartz.NET 安装 Quartz.NET 根据你的特定项目配置 Quartz 启动一个样例程序 下载和安装 你可以下载 zip 文件或使用 Nuget 程序包.Nuget 程序包只包含 Quartz.NET 运

ASP.Net简介、IIS服务器和Repeater重复器

简介:ASP.NET - 制作网站应用程序的技术 WebForm -出来时间比较早,敏捷.便捷开发,封装一些控件,慢慢发现一些控件做的挺好,真正使用没有那么敏捷 MVC -出来时间比较晚 什么东西? winform 界面 - 后台 - 数据库 共同组合出来的程序:ASP.NET 界面(HTML+CSS+JS) - 后台 - 数据库 运行机制:winform - 程序是安装在用户的电脑上,程序是运行在用户电脑上的.net Framework框架上的 ASP.NET - 通过浏览器向服务器发送请求,

CloudFoundry in 1 Box简介:PCF-Dev篇

在<CloudFoundry in 1 Box简介:Bosh-lite篇>我们介绍了Bosh-lite的架构和部署.在本篇中,我们将详细描述另一个CloudFoundry in 1 Box解决方案PCF-Dev. 1PCF-dev简介 PCF是Pivotal发行的Cloud Foundry商业版,PCF-Dev原名MicroPCF,是Pivotal为PCF的应用开发人员准备的一款App单虚拟机版的CloudFoundry.但是,麻雀虽小,五脏俱全.PCF-Dev虽然可以在仅仅一台虚拟式上即可运

1、elasticsearch简介

1.elasticsearch简介 中文帮助文档地址:http://es.xiaoleilu.com/ • Elasticsearch是一个基于Lucene的实时的分布式搜索和分析引擎.设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便.基于RESTful接口. – 普通请求是...get?a=1 – rest请求....get/a/1 • Elasticsearch的用户 – GitHub,Wikipedia,ebay等... • ES VS Solr – 接口 • 类似web

CDH 1、CDH简介

1.Apache Hadoop 不足之处 • 版本管理混乱 • 部署过程繁琐.升级过程复杂 • 兼容性差 • 安全性低 2.Hadoop 发行版 • Apache Hadoop • Cloudera’s Distribution Including Apache Hadoop(CDH) • Hortonworks Data Platform (HDP) • MapR • EMR • … 3.CDH能解决哪些问题 • 1000台服务器的集群,最少要花费多长时间来搭建好Hadoop集群,包括Hive