Tui-x Introduction (EXT)----1

1. What is Tui-x

Tui-x is a solution for creating a Cocos2d-x UI interface, while Builder uses the Flashcs to expand Flashcs by using JSFL to achieve the functionality of the UI editor. The work of this JSFL is very simple, for example, if your project is CPP, it will help you to export a copy of the interface XML and a. h,xml file will be parsed using the parse library of TUI, the header file is a tag mapping table, (If the LUA project will help you export XML and LUA files), you can easily get any one of the controls using this tag mapping table.

What are the components generated by 2.tui-x

Tui-x generated composition from Cocoswidget, which is an excellent third-party component library, including rich text, grid and other advanced controls, the number of high quality, no less than any other editor. (Note: Cocoswidget referred to as CCW) it is worth mentioning that Tui-x has been able to fully visualize the controls that generate all the CCW, including advanced composite controls such as Ctableview,clistview,cgridview, These edits are done entirely in Flashcs, and the threshold is very low, and you can even give it to art and planning to do the interface.

(Design interface)

(Build interface)

What are the characteristics of 3.tui-x?

①tui-x is very inexpensive to use, as long as you can create a movie clip using Flashcs to develop it. A scene corresponding to a FLA file, so that the division of Fine Arts, independent of each other. All components must be created with a naming convention, and if you have played Mornui before, you will be very intimate. For example, create a button that needs to create a movie clip and rename it to a btn_ prefix, such as BTN_OK, which uses a resource map to find the appropriate resource based on the library path of your movie clip. For example, this BTN_OK in the FLA library main/, then it will be in the game to find resouce/main/under the Btn_ok_normal.png,btn_ok_select.png and Btn_ok_disable.png. (Note: No texture can be found) the _normal here is a fixed suffix naming convention, while Btn_ is a fixed prefix naming convention, and in the next article, all the naming rules are listed in detail.

②tui-x Resource management is very free, completely to the developer management, their own load plist and delete plist, so it seems not too smart, in fact, the management of the right back to the developers. This facilitates resource reuse. The control is created in two modes, spriteframe and normal PNG. [spriteframe mode: Load plist and create controls using this texture] [Normal PNG diagram: Create a control directly with a hash PNG] in the FLA library, the directory structure is the same as the Project REAL resource directory one by one, and then the control Spriteframe check.

③ use Flashcs's innate advantage, tui-x can do a lot of CCS and CCB do not do things, such as font strokes and shadows, running effects such as. Edit composite controls, such as CListView and Cgridview, to make backpacks so easy.

What is the touch mechanism of 3.tui-x?

Tui-x strictly speaking, it is not a framework, it is just a tool to help developers generate CCW, so its touch mechanism is the CCW's tree-like touch, all trigger events from the Cwidgetwindow distribution, more about Cocoswiget description please poke/HTTP// blog.csdn.net/cocosviva/article/details/18970717, it is worth mentioning that in the CCW to achieve the popup effect will be a very simple thing, you do not have to consider or set the touch priority. In the example on GitHub there is a demo.

What are the advantages of 4.tui-x?

Tui-x has two versions of the 2.2.3 and 3.0 editions, each corresponding to CPP and LUA, to meet the development needs of each project. And the total code of the editor JSFL only 1500 lines, TUI Analytic Library Total code Volume 700 lines, this order of magnitude I see no editor can do without TUI. Some people say: you do not borrow the shoulder of flash, hanging what hanging.  I can only say that you can get up! Tui-x is the best example of not repeating wheels.

Although the parsing of XML is slightly slower than JSON, Tui-x is parsed using Rapidxml and has a cache, so there is no parsing bottleneck.

Tui-x not only can generate ordinary controls, it can generate bones, editbox, particles and other special components, bone recommended to use the Flash keel plugin dragonbonepanel All are visualized, the end of the CCS UI editor + scene editing + Bone editor. [Sorry I'm not hostile, I'm just telling the truth]

Tui-x extensibility is first-class, learned JS can even directly modify the JSFL, in the exported XML to add a number of fields is very easy. Look at the CCW, if you know the CCW, you can define the control and fuse it into the tui-x, and the following article will teach you how to make your own control and build it with tui-x.

Tui-x The code is very simple, a few lines, through the accompanying. h or LUA get any control, listen to events.

[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 ():p arsescene (ret,"Panel_welcome", Path_welcomeui)
5. return ret
6. End
7. </span>

5. Why use Tui-x to develop

Tui-x easy to get started, development is convenient, CCW this set of components is honed, well-designed, interface is very user-friendly, also contains Lua and CPP also 3.x version, because Flashcs is cross-platform, Tui-x accidentally also cross platform. On the other hand, Cocosbuilder has no one to maintain, ignore. Look at Cocostudio, often collapsed do not say, you call the art to do a scene to teach half a day, but also often complained about difficult to use, and then see the Exportjson, redundant data a heap, large volume does not say, the crash is not good debugging, Rich text Chinese garbled, unable to spit groove, you say with CCS do skeletal animation, All right, misplaced, various splash screens. You have to remember that development is not purely code-writing. The above problems flash can be very good to solve, art students prefer to use flash and PS.

6. Project history, acknowledgement and communication

Tui-x before the birth of a project called Tui, is also used JSFL do the editor, the author Shangfei, but then the Tui control only Panel,image,button these three, can not meet the development needs, later Tui-x was born, discard the original structure and interface, Re-create a new tui-x, the reason is called tui-x, pure respect for the original.

Thank Cocoswidget author Li Junlin Jason.lee classmate, thank Shangfei classmate.

Cocoswidget Official group 261286285 tui-x official group 347085657

7. Download

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

Tui-x Introduction (EXT)----1