[置顶] cocos2dX UI控件之CCEditBox

刚刚看了看以前写的博客, 我们已经学了CCLabelTTF, CCLabelBMFont, CCLAbelAtlas, CCSprite, CCMenu这些基础控件了, 基础控件也没有多少了, 我们今天来学习基础控件中的CCEditBox, 嘿嘿, 看名字大家也就知道是什么东东了吧.

我们先来看看继承关系:

所以, 我们创建类的时候要继承CCIMEDelegate

用法:

CCEditBox* editbox = CCEditBox::create(创建一个矩形区域, 一个"九妹"对象);

对于"九妹", 相信做过安卓的都清楚吧, 这里, 我解释一下, 所谓的九妹就是指可拉伸图片, 我们等一会儿会使用一张97*18的图片作为编辑框背景, 然后我们设置编辑框的宽高为300*100, 大家等会儿看看是不是图片还是很清晰, 这就是九妹的强大之处, 对图片进行填充式拉升, 避免了图片的失真, 九妹的用法:CCScale9sprite::create( "图片文件");

我们继续来看CCEditBox, 由于CCScale9sprite属于扩展功能, 所以要加上#include "cocos-ext.h", 并且使用命名空间USING_NS_CC_EXT;(我使用的是2.1.5版本的, 直接就可以使用, 貌似2.0以前的直接引用头文件会报错, 我们来看看解决办法, 

( 旁白: 最近有盗图的, 进来了还说是原创, 打个标记先))

做了这么多准备工作, 我们正式开始来创建CCEditBox, 

CCScale9Sprite* jiumei = CCScale9Sprite::create( "bg.png");					//创建一个九妹对象
	CCEditBox* editbox = CCEditBox::create( CCSizeMake( 300, 100), jiumei);		//创建一个CCEditBox
	editbox->setPosition( ccp( visibleSize.width / 2, visibleSize.height / 2));
	addChild( editbox);

我们点击一下CCEditBox, 然后输入文字:

弹出了一个对话框, 我们就可以输入文字了, 并且背景图也并没有失真, 是不是?

手机会自动弹出键盘.

好了, 我们今天的课程... ... 其实还没完( 旁白:  去死!!!!)

我么输入文字之后, 还必须能够得到才行啊

我们继续来看, 查阅之后我们发现, cocos2dX为我们提供了很多功能, 我这里介绍两个常用的, 有需要的朋友可以自行查阅官方API, 或者离线手册(稍后我会上传)

getText();               //获取文本

setText( "字符串");               //设置文本(个人感觉没多大用处)

setFontColor( ccc3对象);           //设置文本颜色

setColor( ccc3对象); //设置背景颜色

setPlaceHolder( "文本");   //设置预设文本

setMaxLength( 对象);         //设置最大长度

setInputMode( 输入模式);             //设置键盘模式

setInputFlag( 文本类型);                  //设置文本类型

setReturnType( 键盘返回类型);       //设置键盘返回类型

键盘模式:

kEditBoxInputModeAny                    //文本样式

kEditBoxInputModeEmailAddr         //邮件样式

kEditBoxInputModeNumeric            //数字样式

kEditBoxInputModePhoneNumber  //电话号码样式

kEditBoxInputModeUrl                     //网址样式

kEditBoxInputModeDecimal            //输入样式

kEditBoxInputModeSingleLine        //文本样式

文本类型:

kEditBoxInputFlagPassword                          //密码形式

kEditBoxInputFlagSensitive                            //敏感数据输入

kEditBoxInputFlagInitialCapsWord                 //每个单词首字符大写

kEditBoxInputFlagInitialCapsSentence           //第一句首字符大写

kEditBoxInputFlagInitialCapsAllCharacters     //自动大写

返回类型:

kKeyboardReturnTypeDefault        //默认

kKeyboardReturnTypeDone           //Done

kKeyboardReturnTypeGo               //Go

kKeyboardReturnTypeSend           //Send

kKeyboardReturnTypeSearch        //Search

在使用getText的时候, 我们应该在用户输入完成之后再获取, 所以cocos2dX也给我们提供了一些虚函数, 监听完成之类的状态, 我也例举部分:

virtual void editBoxEditingDidEnd(cocos2d::extension::CCEditBox * myeditbox); //输入结束

virtual void editBoxReturn(cocos2d::extension::CCEditBox * myeditbox); //点了返回之后

... ...

我们可以根据需要, 实现对应的功能

我们继续, 加两行代码

	editbox->setInputFlag( kEditBoxInputFlagPassword);		//设置文本类型
	editbox->setColor( ccc3( 255, 0, 0));					//设置yanse
	editbox->setFontColor( ccc3( 0, 255, 255));				//设置文本颜色

再来看效果:

看起来还不错吧( 旁白: 真心丑)

嗯, 还有一部分功能没有办法在电脑上展示, 我们明天讲讲移植安卓, 大家在手机上测试吧