var CustomTableViewCell = cc.TableViewCell.extend({
draw: function (ctx) {
this._super(ctx);
}
});
var HelloWorldLayer = cc.Layer.extend({
sprite:null,
ctor:function () {
this._super();
//获取到屏幕的大小
var size = cc.winSize;//var size = cc.director.getWinSize();
/***********************GUI获取控件对象****************************/
var root = ccs.uiReader.widgetFromJsonFile("");
var button = ccui.helper.seekWidgetByName(root,"123");
/***********************Widget****************************/
var widget = new ccui.Widget();
/*************与触摸相关的函数********/
widget.setTouchEnabled(true);//设置是否启用触摸事件
widget.isTouchEnabled();//判断是否启用触摸事件
widget.addTouchEventListener(this.touchEvent,this);//触摸事件的回调函数
widget.setSwallowTouches(true);
/*************与启用相关的函数********/
widget.setEnabled(false);//设置是否启用控件
widget.isEnabled();//获取控件是否启用
/*************与高亮相关的函数********/
widget.setBright(false);//设置控件是否高亮，注意要和上面的setEnabled搭配使用才能使外观变灰状态
widget.isBright();//获取控件是否高亮
widget.setHighlighted(false);//设置控件状态为高亮状态
widget.isHighlighted();//获取控件是否处于高亮状态
widget.setBrightStyle(ccui.Widget.BRIGHT_STYLE_HIGH_LIGHT);//设置高亮风格
/*************与焦点相关的函数********/
widget.isFocused();//查询是否拥有该焦点
widget.setFocused(false);//切换控件是否拥有焦点
widget.isFocusEnabled();//查询是否允许接受焦点
widget.setFocusEnabled(false);//切换是否允许接受焦点
widget.requestFocus();//请求获取焦点
widget.onFocusChange(lostFocus,getFocus);//焦点更改事件发生时会调用此方法
widget.getCurrentFocusedWidget();//获取当前拥有焦点的控件
/*************与位置相关的函数********/
widget.getLeftBoundary();//获取左边界在父节点坐标系中的位置
widget.getBottomBoundary();//获取下边界在父节点坐标系中的位置
widget.getRightBoundary();//获取右边界在父节点坐标系中的位置
widget.getTopBoundary();//获取上边界在父节点坐标系中的位置
widget.getWorldPosition();//获取控件在世界坐标系中的位置
/*************百分比和启用布局控件相关的函数********/
widget.getSizePercent();//获取控件的百分比尺寸
widget.setSizePercent(30);//设置控件的百分比尺寸
widget.isLayoutComponentEnabled();//获取是否启用布局组件的结果
widget.setLayoutComponentEnabled(false);//设置是否启用布局组件
this.addChild(widget);
/***********************Buuton继承于Widget****************************/
var button = new ccui.Button("ccs-res/cocosui/button.png", "ccs-res/cocosui/buttonHighlighted.png", "",1);//ccui.Widget.LOCAL_TEXTURE;ccui.Widget.PLIST_TEXTURE
/*************3个状态纹理的相关函数**************/
button.loadTextures("ccs-res/cocosui/button.png", "ccs-res/cocosui/buttonHighlighted.png", "",1);
button.loadTextureNormal("ccs-res/cocosui/button.png",1);
button.loadTexturePressed("ccs-res/cocosui/button.png",1);
button.loadTextureDisabled("ccs-res/cocosui/button.png",1);
/*************九宫格的相关函数**************/
button.isScale9Enabled();//判断按钮是否为九宫格模式
button.setScale9Enabled(true);//设置按钮为九宫格模式
/*************文本内容相关的函数**************/
button.getTitleText();//获取按钮文本内容
button.setTitleText("string");//设置按钮文本内容
button.getTitleColor();//获取按钮文本颜色
button.setTitleColor(cc.color(0x21,0x22,0x23,0x144));//设置按钮文本颜色
button.getTitleFontSize();//获取按钮文本字号大小
button.setTitleFontSize(cc.size(10));//设置按钮文本字号大小
button.getTitleFontName();//获取按钮文本名字
button.setTitleFontName("123");//设置按钮文本名字
/*************缩放效果相关的函数**************/
button.getZoomScale();//获取一个缩放比例
button.setZoomScale(0.6);//设置一个缩放比例
button.setPressedActionEnabled(false);//设置启用按钮被按下时的缩放的动作
button.setTouchEnabled(true);
button.setContentSize(cc.size(150, 48));
button.ignoreContentAdaptWithSize(false);如果设置为true，忽略内容适应，使用系统默认的渲染大小，与实际的图片资源大小无关
button.setPressedActionEnabled(true);//设置按钮是否启用点击缩放的效果
button.setZoomScale(0.3);//点击缩放到原来的0.3
button.setNormalizedPosition(0.5, 0.5) //Node的位置像素会根据它的父节点的尺寸大小计算
button.x = size / 2.0;
button.y = size / 2.0;
button.addTouchEventListener(this.touchEvent ,this);
//button.addClickEventListener(function(sender,type){
//switch (type){
// case ccui.Widget.TOUCH_BEGAN:
// console.log("TOUCH_BEGAN");
// break;
// case ccui.Widget.TOUCH_MOVED:
// console.log("TOUCH_MOVED");
// break;
// case ccui.Widget.TOUCH_ENDED:
// console.log("TOUCH_ENDED");
// break;
// case ccui.Widget.TOUCH_CANCELED:
// console.log("TOUCH_CANCELED");
// break;
// default:
// break;
//}
//});
this.addChild(button);
//说明：Widget对象中button.ignoreContentAdaptWithSize(false);和 button.setContentSize(cc.size(150, 48));同时使用起到自动缩放的功能。
/***********************CheckBox继承于Widget****************************/
var checkBox = new ccui.CheckBox("ccs-res/cocosui/check_box_normal.png", "ccs-res/cocosui/check_box_normal_press.png","ccs-res/cocosui/check_box_active.png","ccs-res/cocosui/check_box_normal_disable.png","ccs-res/cocosui/check_box_active_disable.png",cc.Widget.PLIST_TEXTURE);;
checkBox.loadTextures("ccs-res/cocosui/check_box_normal.png",//未选中常态纹理
"ccs-res/cocosui/check_box_normal_press.png",//背景选中状态纹理
"ccs-res/cocosui/check_box_active.png",//勾选选中状态纹理
"ccs-res/cocosui/check_box_normal_disable.png",//背景禁用状态纹理
"ccs-res/cocosui/check_box_active_disable.png",//勾选禁用状态纹理
ccui.Widget.PLIST_TEXTURE//纹理类型
);//加载相关状态纹理以及纹理类型
checkBox.loadTextureBackGround("ccs-res/cocosui/check_box_normal.png", ccui.Widget.PLIST_TEXTURE);//加载未选中常态纹理以及纹理类型
checkBox.loadTextureBackGroundSelected("ccs-res/cocosui/check_box_normal.png", ccui.Widget.PLIST_TEXTURE);//加载背景选中状态纹理以及纹理类型
checkBox.loadTextureFrontCross("ccs-res/cocosui/check_box_normal.png", ccui.Widget.PLIST_TEXTURE);//加载选中状态纹理以及纹理类型
checkBox.loadTextureBackGroundDisabled("ccs-res/cocosui/check_box_normal.png", ccui.Widget.PLIST_TEXTURE);//加载背景禁用状态纹理以及纹理类型
checkBox.loadTextureFrontCrossDisabled("ccs-res/cocosui/check_box_normal.png", ccui.Widget.PLIST_TEXTURE);//加载勾选禁用状态纹理以及纹理类型
checkBox.isSelected();//获取是否选中的结果
checkBox.setSelected(false);//设置是否选中
checkBox.addEventListener(this.selectedStateEvent, this);//添加事件监听器
checkBox.setEnabled(false);//不可点击
checkBox.setBright(false);//变灰
checkBox.ignoreContentAdaptWithSize(false);
checkBox.setZoomScale(0.5);
checkBox.setContentSize(cc.size(80,80));
checkBox.setTouchEnabled(true);
checkBox.x = size.width / 2.0;
checkBox.y = size.height / 2.0;
this.addChild(checkBox);
/***********************ImageView继承于Widget****************************/
var imageView = new ccui.ImageView("ccs-res/cocosui/buttonHighlighted.png");
imageView.loadTexture("ccs-res/cocosui/buttonHighlighted.png",ccui.Widget.PLIST_TEXTURE);//加载纹理图片以及纹理图片类型
imageView.setTextureRect(cc.rect(0,0,20,30));//设置纹理区域
imageView.setScale9Enabled(true);//设置为九宫格
imageView.isScale9Enabled();//获取是否为九宫格的结果
imageView.setContentSize(cc.size(200, 80));
imageView.setPosition(cc.p(size.width / 2, size.height / 2));
imageView.setSizeType(ccui.Widget.SIZE_PERCENT);//设置大小类型
imageView.setPositionType(ccui.Widget.POSITION_PERCENT);//设置位置类型
imageView.setSizePercent(cc.p(0.5, 0.5));//设置大小比例
imageView.setPositionPercent(cc.p(0.5, 0.5));//设置位置比例
imageView.setFlippedX(true);
imageView.setScale(0.5);
imageView.ignoreContentAdaptWithSize(false);
imageView.setTouchEnabled(true);
imageView.addTouchEventListener(function(sender, type){
if (type == ccui.Widget.TOUCH_ENDED) {
console.log("TOUCH_ENDED");
}
});
this.addChild(imageView);
/***********************Text继承于Widget****************************/
var text = new ccui.Text("TextArea Widget can line wrap","AmericanTypewriter",32);//文本内容、字体文件或者字体名称、字体大小
text.setString("Label Effect");//设置内容
text.getString();//获取内容
text.getFontSize();//获取字号大小
text.setFontSize(30);//设置字号大小
text.getFontName();//获取字体文件或名称
text.setFontName("Marker Felt");//设置字体文件或名称
text.getTextColor();//获取文本颜色
text.setTextColor(cc.color(100,10,150,255));//设置文本颜色
text.getType();//获取类型 ccui.Text.Type.SYSTEM:表示系统字体 ccui.Text.Type.TTF:表示TTF文字字体
text.getTextHorizontalAlignment();//获取文本水平对齐方式
text.setTextHorizontalAlignment(cc.TEXT_ALIGNMENT_LEFT);//设置文本水平对齐方式 TEXT_ALIGNMENT_RIGHT、TEXT_ALIGNMENT_CENTER
text.getTextVerticalAlignment();//获取文本垂直对齐方式
text.setTextVerticalAlignment(cc.VERTICAL_TEXT_ALIGNMENT_TOP);//设置文本垂直对齐方式VERTICAL_TEXT_ALIGNMENT_CENTER、VERTICAL_TEXT_ALIGNMENT_BUTTOM
text.enableShadow(cc.color.GRAY, cc.p(10, -10),false);//启用文本阴影效果，仅TTF字体对象有效
text.enableOutline(cc.color.BLUE, 2);//启用文本描边效果，仅TTF字体对象有效
text.enableGlow(cc.color.RED);//启用文本荧光效果，仅TTF字体对象有效
//text.boundingWidth = 280;
//text.boundingHeight = 150;
text.attr({
textAlign: cc.TEXT_ALIGNMENT_CENTER,
string: "Label TTF",
font: "32px mericanTypewriter",
x: this._widget.width / 2,
y: this._widget.height / 2 - text.height / 8
});
text.ignoreContentAdaptWithSize(false);//为TRUE时忽略自定义的大小，为FALSE时自定义大小是多少就是多少
text.setTextAreaSize(cc.size(60,60));//设置文本区域
text.setContentSize(cc.size(280, 150));//设置Text的大小
text.setTouchScaleChangeEnabled(true);//激活触摸缩放
text.setColor(cc.color(159, 168, 176));
text.setTouchEnabled(true);
text.addTouchEventListener(function(sender, type){
if (type == ccui.Widget.TOUCH_ENDED){
if (text.width == 280){
text.setContentSize(cc.size(380,100));
}else {
text.setContentSize(cc.size(280, 150));
}
}
});
text.setPosition(size.width / 2, size.height / 2 - text.height / 8);
this.addChild(text);
/***********************LoadingBar继承于Widget****************************/
var loadingBar = new ccui.LoadingBar();
loadingBar.setName("LoadingBar");
loadingBar.loadTexture("ccs-res/cocosui/sliderProgress.png");
loadingBar.setDirection(ccui.LoadingBar.TYPE_RIGHT);//设置方向
loadingBar.setPercent(0);//设置进度比例
loadingBar.x = size.width / 2;
loadingBar.y = size.height / 2 + loadingBar.height / 4;
loadingBar.setScale9Enabled(true);
loadingBar.setCapInsets(cc.rect(0, 0, 0, 0));//和图片缩放有关，特别是在九宫格里用的最多
loadingBar.setContentSize(cc.size(300, 30));
this.addChild(loadingBar);
/***********************RichText继承于Widget****************************/
var richText = new ccui.RichText();
richText.ignoreContentAdaptWithSize(false);
richText.x = size.width / 2;
richText.y = size.height / 2;
richText.width = 120;
richText.height = 100;
//整句话可以采取分段形式
//放入一段文本
var re1 = new ccui.RichElementText(1, cc.color.WHITE, 255, "This color is white. ", "Helvetica", 10);
var re2 = new ccui.RichElementText(2, cc.color.YELLOW, 255, "And this is yellow. ", "Helvetica", 10);
var re3 = new ccui.RichElementText(3, cc.color.BLUE, 255, "This one is blue. ", "Helvetica", 10);
var re4 = new ccui.RichElementText(4, cc.color.GREEN, 255, "And green. ", "Helvetica", 10);
var re5 = new ccui.RichElementText(5, cc.color.RED, 255, "Last one is red ", "Helvetica", 10);
//放入一张图片
var reimg = new ccui.RichElementImage(6, cc.color.WHITE, 255, "ccs-res/cocosui/sliderballnormal.png");
//放入一个动画
ccs.armatureDataManager.addArmatureFileInfo("ccs-res/cocosui/100/100.ExportJson");
var pAr = new ccs.Armature("100");
pAr.getAnimation().play("Animation1");
var recustom = new ccui.RichElementCustomNode(1, cc.color.WHITE, 255, pAr);
var re6 = new ccui.RichElementText(7, cc.color.ORANGE, 255, "Have fun!! ", "Helvetica", 10);
richText.pushBackElement(re1);
richText.insertElement(re2, 1);
richText.pushBackElement(re3);
richText.pushBackElement(re4);
richText.pushBackElement(re5);
richText.insertElement(reimg, 2);
richText.pushBackElement(recustom);
richText.pushBackElement(re6);
this.addChild(richText);
/***********************TextField继承于Widget****************************/
var textField = new ccui.TextField("PlaceHolder", "Marker Felt", 30);
textField.x = size.width / 2.0;
textField.y = size.height / 2.0;
textField.onTextFieldAttachWithIME(this.textFieldEvent);// 挂载输入法时的回调函数 并非这里面实现的内容，只是借用这函数，函数带一个参数
textField.onTextFieldDetachWithIME(this.textFieldEvent);// 取消挂载输入法时的回调函数
textField.onTextFieldInsertText(this.textFieldEvent,"123",3);//插入文本时的回调函数，其参数如下，sender：文本编辑框实例。text：将要插入的字符串 len:j将要插入的字符串长度
textField.onTextFieldDeleteBackward(this.textFieldEvent,"123",3);//删除文本时的回调函数，其参数如下。sender：文本编辑框实例。text：将要删除的字符串 len:j将要插入的字符串长度
textField.insertText("123",3);//插入文本
textField.deleteBackward();//回退删除
textField.openIME();//打开输入法编辑器
textField.closeIME();//关闭输入法编辑器
textField.setMaxLengthEnabled(false);//启用最大长度限制
textField.isMaxLengthEnabled();//获取是否启用了最大长度限制的结果
textField.setMaxLength(29);//设置最大长度
textField.getMaxLength();//获取最大长度
textField.getCharCount();//获取总共输入的字数
textField.setPasswordEnabled(false);//启用密码输入模式
textField.isPasswordEnabled();//获取是否启用密码输入模式的结果
textField.setPasswordStyleText("234");//设置密码模式下的文本样式
textField.setPasswordText("123");//设置密码
textField.setAttachWithIME(false);//设置是否挂载输入法编辑器
textField.getAttachWithIME();//获取是否挂载输入法编辑器的结果
textField.setDetachWithIME(false);//设置是否取消挂载输入法编辑器
textField.getDetachWithIME();//获取是否取消挂载输入法编辑器的结果
textField.setInsertText("123");//设置是否允许文本输入
textField.getInsertText();//获取是否允许文本输入的结果
textField.setDeleteBackward(false);//设置是否允许回删
textField.getDeleteBackward();//获取是否允许回删的结果
textField.setTouchEnabled(true);
textField.ignoreContentAdaptWithSize(false);
textField.setContentSize(240, 120);//和上面一句设置换行
textField.getVirtualRenderer().setLineBreakWithoutSpace(true);//这句开启换行功能
textField.fontName = "Marker Felt";
textField.fontSize = 30;
textField.placeHolder = "input words here";
textField.setString("input words here");
textField.setTextHorizontalAlignment(cc.TEXT_ALIGNMENT_CENTER);
textField.setTextVerticalAlignment(cc.TEXT_ALIGNMENT_CENTER);
textField.addEventListener(this.textFieldEvent, this);
this.addChild(textField);
/***********************Slider继承于Widget****************************/
var slider = new ccui.Slider();
slider.setTouchEnabled(true);
slider.loadBarTexture("ccs-res/cocosui/sliderTrack.png");
slider.loadSlidBallTextures("ccs-res/cocosui/sliderThumb.png", "ccs-res/cocosui/sliderThumb.png", "");
slider.loadProgressBarTexture("ccs-res/cocosui/sliderProgress.png");
slider.x = size.width / 2.0;
slider.y = size.height / 2.0;
slider.addTouchEventListener(this.sliderEvent, this);
this.addChild(slider);
/***********************Layout继承于Widget****************************/
var layout = new ccui.Layout();
/**************与背景颜色相关的函数*******************/
layout.getBackGroundColorType();//获取背景颜色类型
layout.setBackGroundColorType(ccui.Layout.BG_COLOR_SOLID);//设置背景颜色类型 单色
layout.getBackGroundColor();//获取背景颜色
layout.setBackGroundColor(cc.color(128, 128, 128));//设置背景颜色
layout.getBackGroundStartColor();//获取渐变背景颜色开始的值
layout.getBackGroundEndColor();//获取渐变背景颜色结束的值
layout.getBackGroundColorOpacity();//获取背景颜色不透明度
layout.setBackGroundColorOpacity(123);//获取背景颜色向量
layout.getBackGroundColorVector();//获取背景颜色向量
layout.setBackGroundColorVector(cc.vector());//设置背景颜色向量
/**************与背景颜色图片的函数*******************/
layout.setBackGroundImage("123",ccui.Widget.PLIST_TEXTURE);//设置背景图片
layout.removeBackGroundImage();//移除背景图片
layout.getBackGroundImageColor();//获取背景图片颜色
layout.setBackGroundImageColor(cc.color(125,125,125,125));//设置背景图片颜色
layout.getBackGroundImageOpacity();//获取背景图片不透明度
layout.setBackGroundImageOpacity(123);//设置背景图片不透明度
layout.getBackGroundImageTextureSize();//获取背景图片纹理大小
layout.isBackGroundImageScale9Enabled();//背景图片是否启用九宫格
layout.setBackGroundImageScale9Enabled(false);//开启/关闭背景图片九宫格模式
/**************其他相关的函数*******************/
layout.setLayoutType(ccui.LayoutParameter.LINEAR_VERTICAL);//设置布局类型
layout.getLayoutType();//获得布局类型
layout.requestDoLayout();//请求刷新布局
layout.forceDoLayout();//强制刷新布局
layout.isClippingEnabled();//获取是否开启了裁剪的结果
layout.setClippingEnabled(false);//设置是否开启裁剪
layout.isLoopFocus();//获取是否启用循环焦点的结果
layout.setLoopFocus(false);//设置是否启用循环焦点
layout.isPassFocusToChild();//获取是否允许传递焦点到子节点上的结果
layout.setPassFocusToChild(false);//设置是否允许传递焦点到子节点上
layout.getClippingType();//获取裁剪类型
layout.setClippingType(1);//设置裁剪类型
layout.findNextFocusedWidget(ccui.Widget.LEFT,this);//获取指定方向中的下一个能够具有焦点的控件
//裁剪必须结合下面两个函数使用
layout.setContentSize(cc.size(280, 150));
layout.setClippingEnabled(true);//允许剪裁
this.addChild(layout);
this.button = new ccui.Button();
this.button.setTouchEnabled(true);
this.button.loadTextures("ccs-res/cocosui/animationbuttonnormal.png", "ccs-res/cocosui/animationbuttonpressed.png", "");
this.button.x = this.button.width / 2;
this.button.y = layoutRect.height - this.button.height / 2;
layout.addChild(this.button);
//垂直布局
//布局参数
var lp = new ccui.LinearLayoutParameter();
this.button.setLayoutParameter(lp);
lp.setGravity(ccui.LinearLayoutParameter.CENTER_HORIZONTAL);//线性布局对齐方式
lp.setMargin(new ccui.Margin(0,10,0,10))
this.button_scale9 = new ccui.Button();
this.button_scale9.setTouchEnabled(true);
this.button_scale9.setScale9Enabled(true);
this.button_scale9.loadTextures("ccs-res/cocosui/backtotopnormal.png", "ccs-res/cocosui/backtotoppressed.png", "");
this.button_scale9.setTitleText("Text Button");
this.button_scale9.x = size / 2;
this.button_scale9.y = size / 2;
layout.addChild(this.button_scale9);
/***********************ScrollView继承于Layout****************************/
var scrollView = new ccui.ScrollView();
this.addChild(scrollView);
var imageView = new ccui.ImageView();
imageView.loadTexture("ccs-res/cocosui/ccicon.png");
//ScrollView布局格式为DIR_HORIZONTAL使用这个
var innerWidth = scrollView.width;
var innerHeight = scrollView.height + imageView.height;
//ScrollView布局格式为DIR_HORIZONTAL使用这个
var scrollViewRect = scrollView.getContentSize();
var innerWidth = scrollViewRect.width + imageView.getContentSize().width;
var innerHeight = scrollViewRect.height;
/*****************与方向相关的函数*******************/
scrollView.getDirection();//获取方向
scrollView.setDirection(ccui.ScrollView.DIR_VERTICAL);//设置方向
/*****************与惯性、弹力效果相关的函数*******************/
scrollView.isInertiaScrollEnabled();//获取是否开启滚动惯性效果的结果
scrollView.setInertiaScrollEnabled(false);//设置是否开启滚动惯性效果
scrollView.isBounceEnabled();//获取是否开启弹力效果的结果
scrollView.setBounceEnabled(false);//设置是否开启弹力效果
/*****************与容器及其大小相关的函数*******************/
scrollView.getInnerContainer();//获取滚动视图的内部布局容器
scrollView.getInnerContainerSize();//获取内部容器的大小
scrollView.setInnerContainerSize(cc.size(innerWidth, innerHeight));//设置内部容器的大小
/*****************与触摸事件相关的函数*******************/
scrollView.onTouchBegan(function (touch,event) {
return true;
});
scrollView.onTouchMoved(function (touch,event) {
});
scrollView.onTouchEnded(function (touch,event) {
});
scrollView.onTouchCancelled(function (touch,event) {
});
scrollView.addEventListener(function (touch,event) {
});
/*****************与滚动相关的函数*******************/
scrollView.scrollToBottom(0.2,false);//滚动到滚动视图的底部 持续时间、滚动速度是否衰减
scrollView.scrollToTop(0.2,false);//滚动到滚动视图的顶部
scrollView.scrollToLeft(0.2,false);//滚动到视图的左端
scrollView.scrollToRight(0.2,false);//滚动到视图的右端
scrollView.scrollToTopLeft(0.2,false);//滚动到视图的左上角
scrollView.scrollToTopRight(0.2,false);滚动到视图的右上角
scrollView.scrollToBottomLeft(0.2,false);滚动到视图的左下角
scrollView.scrollToBottomRight(0.2,false);滚动到视图的右下角
scrollView.scrollToPercentVertical(10,0.2,false);//按百分比竖直滚动
scrollView.scrollToPercentHorizontal(10,0.2,false);//按百分比水平滚动
scrollView.scrollToPercentBothDirection(cc.p(10,10),0.2,false);//竖直方向和水平方向分别按一定的百分比滚动
/*****************与跳跃相关的函数*******************/
// cocos2d-js中listView的jumpToBottom()方法无效的解决方法
// 本文提供两种解决方法：
// 一、延时调用
// listView2.runAction(cc.sequence(cc.delayTime(0.1),cc.callFunc(function () {
// listView2.jumpToBottom();
// })),this);
// 在listViwe创建（从cocostudio中获取）完毕并添加Item之后延时调用jumpToBottom()方法！
// 二、更新视图
// var listView2 = ccui.helper.seekWidgetByName(this.mainscene,"ListView_2");
// listView2.refreshView();
// ……添加Item
// listView2.jumpToBottom();
// 在listView创建（获取）之后先调用refreshView()方法更新list，再添加Item之后调用jumpToBottom()方法！
//三、而scrollToBottom()暂时只能用延时的方法，解决初始化直接用不起作用的bug！
scrollView.jumpToBottom();//跳到视图底端
scrollView.jumpToTop();//跳到视图顶端
scrollView.jumpToLeft();//跳到视图左边
scrollView.jumpToRight();//跳到视图右边
scrollView.jumpToTopLeft();//跳到视图左上角
scrollView.jumpToTopRight();//跳到视图右上角
scrollView.jumpToBottomLeft();//跳到视图右上角
scrollView.jumpToBottomRight();//跳到视图右下角
scrollView.jumpToPercentVertical(10);//竖直方向跳到指定百分比位置
scrollView.jumpToPercentHorizontal(10);//水平方向跳到指定百分比位置
scrollView.jumpToPercentBothDirection(cc.p(10,10));//竖直和水平方向跳到指定百分比位置
scrollView.setTouchEnabled(true);
scrollView.setContentSize(cc.size(280, 150));
scrollView.x = (size.width) / 2 ;
scrollView.y = size.height / 2;
scrollView.setBackGroundColor(cc.color.GREEN);
scrollView.setBackGroundColorType(ccui.Layout.BG_COLOR_SOLID);
var button = new ccui.Button();
button.setTouchEnabled(true);
button.loadTextures("ccs-res/cocosui/animationbuttonnormal.png", "ccs-res/cocosui/animationbuttonpressed.png", "");
button.x = innerWidth / 2;
button.y = scrollView.getInnerContainerSize().height - button.height / 2;
scrollView.addChild(button);
var textButton = new ccui.Button();
textButton.setTouchEnabled(true);
textButton.loadTextures("ccs-res/cocosui/backtotopnormal.png", "ccs-res/cocosui/backtotoppressed.png", "");
textButton.setTitleText("Text Button");
textButton.x = innerWidth / 2;
textButton.y = button.getBottomBoundary() - button.height;
scrollView.addChild(textButton);
var button_scale9 = new ccui.Button();
button_scale9.setTouchEnabled(true);
button_scale9.setScale9Enabled(true);
button_scale9.loadTextures("ccs-res/cocosui/button.png", "ccs-res/cocosui/buttonHighlighted.png", "");
button_scale9.width = 100;
button_scale9.height = 32;
button_scale9.x = innerWidth / 2;
button_scale9.y = textButton.getBottomBoundary() - textButton.height;
scrollView.addChild(button_scale9);
//ScrollView布局格式为DIR_VERTICAL使用这个
imageView.x = innerWidth / 2;
imageView.y = imageView.height / 2;
//ScrollView布局格式为DIR_HORIZONTAL使用这个
imageView.x = innerWidth - imageView.width / 2;
imageView.y = button_scale9.getBottomBoundary() - button_scale9.height / 2;
scrollView.addChild(imageView);
/***********************TableView继承于ScrollView****************************/
//创建一个tableview
var tableView = new cc.TableView(this, cc.size(500, 100 * 4));
tableView.setDirection(cc.SCROLLVIEW_DIRECTION_VERTICAL);设置tableview的滑动的方向
tableView.x = 100;
tableView.y = 200;
// 设置委托
tableView.setDelegate(this);
tableView.setVerticalFillOrder(cc.TABLEVIEW_FILL_TOPDOWN);//tableView填充方式 (cc.TABLEVIEW_FILL_BOTTOMUP)
this.addChild(tableView);
//更新tableview
tableView.reloadData();
/***********************ListView继承于ScrollView****************************/
this.listView = new ccui.ListView();
/***************项操作的相关函数*****************/
this.listView.setItemModel(widget);//设置项的模型
this.listView.pushBackDefaultItem();//插入一个默认项(通过克隆模式创建)到列表视图的尾部
this.listView.insertDefaultItem(1);//插入一个默认项(通过克隆模式创建)到列表视图的指定位置
this.listView.pushBackCustomItem(widget);//插入一个自定义项到列表视图的尾部
this.listView.insertCustomItem(widget,1);//插入自定义UI控件到列表视图中指定索引处
this.listView.removeItem(1);//删除给定索引的项
this.listView.removeLastItem();//删除最后一个项
this.listView.removeAllItems();//删除所有项
this.listView.getItem(1);//获取给定索引的项
this.listView.getItems();//获取所有项
this.listView.getIndex(widget);//获取指定项的索引
this.listView.getCurSelectedIndex();//获取当前所选项的索引
/***************边距、对齐方式以及方向相关的函数*****************/
this.listView.getItemsMargin();//获取每个项之间的边距
this.listView.setItemsMargin(1);//设置每个项之间的边距
this.listView.getGravity();//获取对齐方式
this.listView.setGravity(ccui.ListView.GRAVITY_RIGHT);//设置对齐方式
this.listView.getDirection();//获取方向
this.listView.setDirection(1);//设置方向
/***************刷新相关的函数*****************/
this.listView.requestRefreshView();//请求刷新视图和布局
this.listView.refreshView();//刷新列表视图的视图
this.listView.forceDoLayout();//强制刷新控件的布局
this.listView.doLayout();//请求刷星控件的布局
this.listView.setDirection(ccui.ScrollView.DIR_VERTICAL);//方向
this.listView.setTouchEnabled(true);
this.listView.setBounceEnabled(true);//是否反弹
this.listView.setBackGroundImage("ccs-res/cocosui/green_edit.png");//背景图片
this.listView.setBackGroundImageScale9Enabled(true);//九宫格
this.listView.setScrollBarWidth(30); //滚动条的宽度
this.listView.setScrollBarColor(cc.RED); //滚动条的颜色
this.listView.setScrollBarPositionFromCorner(cc.p(7, 7));
this.listView.setContentSize(cc.size(240, 130));
this.listView.setAnchorPoint(cc.p(0.5 ,0.5));
this.listView.x = size/ 2;
this.listView.y = size / 2;
this.listView.addEventListener(this.selectedItemEvent, this);
this.addChild(this.listView);
//创建一个按钮
var default_button = new ccui.Button();
default_button.setName("TextButton");
default_button.setTouchEnabled(true);
default_button.loadTextures("ccs-res/cocosui/backtotoppressed.png", "ccs-res/cocosui/backtotopnormal.png", "");
//创建layout（模型）
var default_item = new ccui.Layout();
default_item.setTouchEnabled(true);
default_item.setContentSize(default_button.getContentSize());
default_item.width = this.listView.width;
default_button.x = default_item.width / 2;
default_button.y = default_item.height / 2;
default_item.addChild(default_button);
this.listView.setItemModel(default_item);//设置模型
this._array = [];
for (var i = 0; i < this._totalCount; ++i) {
this._array.push("item_" + i);
}
for(var i = 0; i < 100; ++i) {
if (i < 8) {
var item = default_item.clone();
item.setTag(i);
var btn = item.getChildByName('TextButton');
btn.setTitleText(this._array[i]);
this.listView.pushBackCustomItem(item);
}
}
/***********************PageView继承于ListView****************************/
var pageView = new ccui.PageView();
/****************添加、删除、查询页相关的函数******************/
pageView.addPage(layout);//往分页视图的最后插入一页
pageView.addWidgetToPage(widget,1,false);//把一个UI控件添加到分页视图中
pageView.insertPage(layout,1);//在指定位置插入一页
pageView.removePage(layout);//移除一页
pageView.removePageAtIndex(1);//移除指定位置的页
pageView.removeAllPages();//移除所有页
pageView.setCurrentPageIndex(1);//跳入指定的页
pageView.getCurrentPageIndex();//获取当前显示页的索引号
pageView.getPages();//获取所有页的列表
pageView.getPage(1);//获取指定的页
//cocos2d-js中PageView的scrollToPage()方法直接使用无效的解决方法
//contentPageView.runAction(cc.sequence(cc.delayTime(0.1),cc.callFunc(function () {
//contentPageView.scrollToPage(index);
//})),this);
pageView.scrollToPage(1);//滚动到一个指定的页
/****************滑动临界值相关的函数******************/
pageView.setCustomScrollThreshold(1);//设置自定义滚动临界值
pageView.getCustomScrollThreshold();//获取自定义滚动临界值
pageView.setUsingCustomScrollThreshold(false);//设置是否使用自定义滚动临界值
pageView.isUsingCustomScrollThreshold();//获取是否使用自定义滚动临界值的结果
pageView.addEventListener(this.pageViewEvent, this);
pageView.setTouchEnabled(true);
pageView.setContentSize(cc.size(240, 130));
var backgroundSize = background.getContentSize();
pageView.setPosition(cc.p((size.width - backgroundSize.width) / 2.0 +
(backgroundSize.width - pageView.getContentSize().width) / 2.0,
(size.height - backgroundSize.height) / 2.0 +
(backgroundSize.height - pageView.getContentSize().height) / 2.0));
for (var i = 0; i < 3; ++i) {
//layout
var layout = new ccui.Layout();
layout.setContentSize(cc.size(240, 130));
var layoutRect = layout.getContentSize();
//imageView
var imageView = new ccui.ImageView();
imageView.setTouchEnabled(true);
imageView.setScale9Enabled(true);
imageView.loadTexture("ccs-res/cocosui/scrollviewbg.png");
imageView.setContentSize(cc.size(240, 130));
imageView.x = layoutRect.width / 2;
imageView.y = layoutRect.height / 2;
layout.addChild(imageView);
var text = new ccui.Text();
text.string = "page" + (i + 1);
text.font = "30px 'Marker Felt'";
text.color = cc.color(192, 192, 192);
text.x = layoutRect.width / 2;
text.y = layoutRect.height / 2;
layout.addChild(text);
pageView.insertPage(layout, i);
}
this.addChild(pageView);
/***********************EditBox****************************/
var editBox = new ccui.EditBox(cc.size(360.00,53.00),new cc.Scale9Sprite("ccs-res/cocosui/sliderThumb.png"));
editBox.x = size.width/2;
editBox.y = size.height/2;
editBox.setDelegate(this);
editBox.setMaxLength(20);
editBox.setPlaceHolder("点击输出账号");
editBox.setInputFlag(cc.EDITBOX_INPUT_FLAG_SENSITIVE);//修改为不使用密文
editBox.setInputMode(cc.EDITBOX_INPUT_MODE_ANY);
editBox.setReturnType(cc.KEYBOARD_RETURNTYPE_DONE);
this.addChild(editBox);
/***********************Scale9Sprite****************************/
var sprTV = new cc.Scale9Sprite("ccs-res/cocosui/sliderThumb.png", cc.rect(0, 0, 26, 26), cc.rect(10, 10, 7, 7));
sprTV.x = size.width/2;
sprTV.y = size.height/2;
sprTV.width = sprTV.width + 20;
sprTV.height = sprTV.height + 20;
this.addChild(sprTV, 5);
return true;
},
/********************************Button***********************************/
touchEvent: function (sender,type) {
switch (type){
case ccui.Widget.TOUCH_BEGAN:
console.log("TOUCH_BEGAN");
break;
case ccui.Widget.TOUCH_MOVED:
console.log("TOUCH_MOVED");
break;
case ccui.Widget.TOUCH_ENDED:
console.log("TOUCH_ENDED");
break;
case ccui.Widget.TOUCH_CANCELED:
console.log("TOUCH_CANCELED");
break;
default:
break;
}
},
/********************************CheckBox***********************************/
selectedStateEvent: function (sender, type) {
switch (type) {
case ccui.CheckBox.EVENT_UNSELECTED:
console.log("EVENT_UNSELECTED");
break;
case ccui.CheckBox.EVENT_SELECTED:
console.log("EVENT_SELECTED");
break;
default:
break;
}
},
/********************************ListView***********************************/
selectedItemEvent: function (sender, type) {
switch (type) {
case ccui.ListView.EVENT_SELECTED_ITEM:
var listViewEx = sender;
var item = listViewEx.getItem(listViewEx.getCurSelectedIndex());
cc.log("select child index = " + item.getTag());
break;
default:
break;
}
},
/********************************PageView***********************************/
pageViewEvent: function (sender, type) {
switch (type) {
case ccui.PageView.EVENT_TURNING:
var pageView = sender;
console.log("page = " + (pageView.getCurrentPageIndex().valueOf()-0 + 1));
break;
default:
break;
}
},
/********************************Slider***********************************/
sliderEvent: function (sender, type) {
switch (type) {
case ccui.Slider.EVENT_PERCENT_CHANGED:
var slider = sender;
var percent = slider.getPercent();
console.log(percent.toFixed(0));
break;
default:
break;
}
},
/********************************TextField***********************************/
textFieldEvent: function (textField, type) {
switch (type) {
case ccui.TextField.EVENT_ATTACH_WITH_IME://光标进入输入框
console.log("EVENT_ATTACH_WITH_IME");
break;
case ccui.TextField.EVENT_DETACH_WITH_IME://光标离开输入框
console.log("EVENT_DETACH_WITH_IME");
break;
case ccui.TextField.EVENT_INSERT_TEXT://输入文本
console.log("EVENT_INSERT_TEXT");
break;
case ccui.TextField.EVENT_DELETE_BACKWARD://删除文本
console.log("EVENT_DELETE_BACKWARD");
break;
default:
break;
}
},
/********************************EditBox***********************************/
editBoxEditingDidBegin: function (editBox) {
cc.log("editBox " + editBox.getName() + " DidBegin !");
},
editBoxEditingDidEnd: function (editBox) {
cc.log("editBox " + editBox.getName() + " DidEnd !");
},
editBoxTextChanged: function (editBox, text) {
cc.log("editBox " + editBox.getName() + ", TextChanged, text: " + text);
},
editBoxReturn: function (editBox) {
cc.log("editBox " + editBox.getName() + " was returned !");
},
/********************************Slider***********************************/
onSliderEvent: function (sender, type) {
switch (type) {
case ccui.Slider.EVENT_PERCENT_CHANGED://滑块滑动
var percent = sender.getPercent();
console.log("百分比: "+percent.toFixed(0));//取整输出
break;
default:
break;
}
},
/********************************TableVew***********************************/
//TableView继承ScrollView有这俩个方法，不需要添加任何内容
scrollViewDidScroll: function (view) {
},
scrollViewDidZoom: function (view) {
},
//设置点击cell后的回调函数
tableCellTouched: function (table, cell) {
cc.log("cell touched at index: " + cell.getIdx());
},
//设置cell大小
tableCellSizeForIndex: function (table, idx) {
return cc.size(100, 135);
},
//添加Cell
tableCellAtIndex: function (table, idx) {
var strValue = idx.toFixed(0);
//获得一个cell，滑动cell的时候会执行这个方法，把没有显示（没渲染）的cell拿过来，更改内容，为了减小内存的开销
var cell = table.dequeueCell();
var label;
if (!cell) {
cell = new CustomTableViewCell();
//添加图片
var sprite = new cc.Sprite("res/1.png");
sprite.anchorX = 0;
sprite.anchorY = 0;
sprite.x = 0;
sprite.y = 0;
cell.addChild(sprite);
// 添加文本
label = new cc.LabelTTF(strValue, "Helvetica", 50);
label.x = 0;
label.y = 0;
label.anchorX = 0;
label.anchorY = 0;
label.color = cc.color(255, 0, 0, 255);
label.tag = 123;
cell.addChild(label);
} else {
//更改文本信息
label = cell.getChildByTag(123);
label.setString(strValue);
}
return cell;
},
//设置cell个数
numberOfCellsInTableView: function (table) {
return 10;
}
});
var HelloWorldScene = cc.Scene.extend({
onEnter:function () {
this._super();
var layer = new HelloWorldLayer();
this.addChild(layer);
}
});
1057
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
