上一篇文章中我们讲到了Quick-Cocos2d-x 3.3中的display文件中包含的方法。今天我们来介绍下Quick-Cocos2d-x 3.3中的ui库。
Quick-Cocos2d-x 3.3中的UI分为两部分,一部分位于framework的ui.lua中,一部分位于framework/cc/ui中。在framework/cc/ui中的代码已经重构了ui.lua中的接口,对于新用户我们只需要使用framework/cc/ui下的接口就可以了。
我们先看下ui文件夹下有哪些文件:
下面我们来详细说下每个文件的用途和内容:
文件名称 | 控件 |
---|---|
UIButton | 按钮基类 |
UICheckBoxButton | CheckBox按钮控件 |
UICheckBoxButtonGroup | CheckBox按钮组控件 |
UIGroup | 控件组基类 |
UIImage | 图片控件 |
UIInput | 输入控件 |
UILabel | 文字控件 |
UILayout | 布局基类 |
UIListView | 列表控件 |
UIListViewItem | 列表项控件 |
UILoadingBar | 加载进度条控件 |
UIPageView | PageView控件 |
UIPageViewItem | PageView单个控件 |
UIPushButton | 按钮控件 |
UIScrollView | 滚动视图控件 |
UISlider | 滑动控件 |
UIStretch | 拉伸控件 |
接下来我们介绍常用的几个控件,至于基类有兴趣的同学可以自己去了解。 目前Quick-Cocos2d-x常用的控件有:
- UIPushButton
- UIImage
- UIInput
- UILabel
- UIListView
UIPushButton
UIPushButton其实就是我们常见的按钮,在Cocos2d-x中相当于Menu和ImageMenuItem的组合。
UIPushButton包含三个方法:
1
2
3
|
function UIPushButton:ctor(images, options)
function UIPushButton:setButtonImage(state, image, ignoreEmpty)
function UIPushButton:onTouch_(event)
|
1
|
function UIPushButton:ctor(images, options)
|
ctor()创建一个UIPushButton对象,images传入的是不同状态下的图片,options是参数表 其中scale9为是否缩放。
1
|
function UIPushButton:setButtonImage(state, image, ignoreEmpty)
|
setButtonImage用来设置不同状态下的按钮状态。
1
|
function UIPushButton:onTouch_(event)
|
该函数用来设置PushButton的触摸事件。
UIImage
1
|
function UIImage:ctor(filename, options)
|
创建一个UIImage对象,filename是图片文件名称,options是参数表,scale9表示是scale9图片。
1
|
function UIImage:setLayoutSize(width, height)
|
设置图片大小。
UIInput
UIInput是输入控件,相当于原来的EditBox和TextFiled。
1
|
function UIInput:ctor(options)
|
创建一个UIInput控件。options控件是参数表,UIInputType代表是EditBox或TextFiled。options的具体参数有点多,可以参看UIInput中newEditBox_和newTextFiled_的参数说明。
UILabel
UILabel是Cocos2d-x中的文本标签的集合。
1
|
function UILabel:ctor(options)
|
创建一个UILabel控件。其中options为参数表,options.UILabelType表示文本标签的类型,1表示BMFont,2表示TTF。
1
|
function UILabel:setLayoutSize(width, height)
|
设置控件大小。
UIListView
UIListView是Quick-Cocos2d-x中的列表控件。
1
|
function UIListView:ctor(params)
|
创建一个UIListView控件。params表示UIListView的参数表。
1
|
function UIListView:onCleanup()
|
清除列表内容
1
|
function UIListView:onTouch(listener)
|
注册列表控件触摸函数。
1
|
function UIListView:setAlignment(align)
|
列表控件设置所有listItem中content的对齐方式
1
|
function UIListView:newItem(item)
|
创建一个新的listViewItem项
1
|
function UIListView:setViewRect(item)
|
设置显示区域
1
|
function UIListView:addItem(listItem, pos)
|
在列表项中添加一项
1
|
function UIListView:removeItem(listItem, bAni)
|
在列表项中移除一项
1
|
function UIListView:removeAllItems()
|
移除所有的项
1
|
function UIListView:getItemPos(listItem)
|
取某项在列表控件中的位置
1
|
function UIListView:isItemInViewRect(pos)
|
判断某项是否在列表控件的显示区域中
1
|
function UIListView:reload()
|
加载列表
1
|
function UIListView:dequeueItem()
|
取一个空闲项出来,如果没有返回空。