1.说明:
如果之前有玩过morn的话,会对Tui-x的命名规则感到亲切。所谓的命名规则,就是以控件的名字(实例名)去生成对应组件,编辑器会根据控件的前缀去分析该组件类型,比如命名为btn_ok会被解析成按钮,最终生成CButton。
跟morn不一样的是,Tui-x的控件资源(png图)分固定前缀,和固定后缀,比如一个btn_ok的影片剪辑控件,对应的png图命名应该是 btn_ok_normal.png,btn_ok_select.png 和 btn_ok_disable.png ,这里的_normal ,_select,_disable 就是固定后缀 ,而btn_就是固定前缀。
我们创建组件的使用的是带自定义属性的影片剪辑,严格来说是flash的组件。为了方便美术同学创建控件我们提供了一个模板fla,Template.fla,里面罗列出Tui-x的所有控件,除了两个容器panel和cell,因为这两个容器没有自身的自定义属性,所以直接用影片剪辑做就好了。
Template.fla
并不是所有控件的资源图都需要固定后缀,但像button这种有三种图组成的就需要固定后缀,大部分控件都是跟flashCS里的控件命名一致。
2.列举资源图的命名规则。
img_test->img_test.png
img9_test->img9_test.png
btn_test->btn_test_normal.png btn_test_select.png btn_test_disable.png
ckb_test ->ckb_test_normal1.png ckb_test_select1.png ckb_test_disable1.png
ckb_test_normal2.png ckb_test_select2.pngckb_test_disable2.png
slider_test->slider_test_bg.png slider_test_progress.png slider_test_thumb.png
prog_test->prog_test_bg.png prog_test_progress.png prog_test_thumb.png
arm_test->arm_test.png arm_test.plist arm_test.xml
labAtlas_test->labAtlas_test.png
labBmf_test->labBmf_test.fnt labBmf_test.png
ctlv_test->ctlv_test_baseboard.pngctlv_test_joystick.png
tgv_test->tgv_test_normal.pngtgv_test_select.pngtgv_test_disable.png
list_test->list_test.png
pv_test->pv_test.png
tbl_test->tbl_test.png
gv_test->gv_test.png
gpv_test->gpv_test.png
armBtn_test->armBtn_test.png armBtn_test.xml armBtn_test.plist
numStep_test->numStep_test_lnormal.pngnumStep_test_lselect.pngnumStep_test_ldisable.pngnumStep_test_stepbg.png
numStep_test_rnormal.png numStep_test_rselect.png numStep_test_rdisable.png
ptl_test->ptl_test.png ptl_test.plist
movie_test->movie_test.png movie_test.json movie_test.plist
注意:这些资源你不一定全部要有,像button_disable.png ,你如果只有两个状态,不填也是可以的。
3.为什么有自定义属性,还要搞命名规则?
这是为了方便操作,你每个按钮都有三个png图,我每次创建一个按钮就要设置3次资源名,相当繁琐而且不规范。在Tui-x的flash控件里面,资源路径是根据该组件在库中路径所决定,跟参数设置无关。
4.交流
CocosWidget 官方群261286285 Tui-x 官方群 347085657
5.下载
Tui-x 2.x : https://github.com/LingJiJian/tui/tree/Tui-x Tui-x 3.x https://github.com/LingJiJian/Tui-x