【玩轉cocos2d-x之三十】點九圖和輸入框的使用
阿新 • • 發佈:2019-01-02
登入介面一個帳號/密碼輸入框或者主角命名框是少不了的。這節就來了解一下點九圖的輸入框的使用。這裡只是介紹基礎知識,並不進行平臺的移植,也不處理跨平臺可能出現的問題。
1.點九圖CCScale9Sprite
1.1.概述
點九圖做過移動開發的肯定不會陌生。採用的是PNG點9圖,PNG點9圖可以自適應各種環境,同時保持伸縮不變形。移動端的UI基本上都是按這個來做的。點9圖的製作很簡單,用Android SDK的tool下的draw9patch.bat就可以製作。左為原理圖,右為效果圖。
1.2.使用
cocos2d-x採用CCScale9Sprite來處理點九圖,CCScale9Sprite為擴充套件類,所以在使用前需加入如下宣告。
#include "cocos-ext.h"
USING_NS_CC_EXT;
CCScale9Sprite和CCSprite一樣繼承於CCNodeRGB,所以基本上可以像使用CCSprite一樣使用CCScale9Sprite(有一點小差別CCSprite還繼承了CCTextureProtocol介面)。以下用於建立一個二態點九圖按鈕。
CCScale9Sprite* confirmnormal=CCScale9Sprite::create("btn_style_alert_dialog_button_normal.9.png");//normal態 confirmnormal->setContentSize(CCSizeMake(100,70));//設定大小 CCScale9Sprite* confirmpressd=CCScale9Sprite::create("btn_style_alert_dialog_button_pressed.9.png");//pressd態 confirmpressd->setContentSize(CCSizeMake(100,70));//設定大小 CCMenuItemSprite* menuitem=CCMenuItemSprite::create(confirmnormal,confirmpressd,this,menu_selector(TestLayer::btncallback)); CCMenu* menu=CCMenu::create(menuitem,NULL);//建立menu menu->setPosition(visibleSize.width/2,visibleSize.height/2); this->addChild(menu);
2.輸入框CCEditBox
2.1.概述
CCEditBox也是cocos2d-x的擴充套件類,所以和上面一樣要進行標頭檔案包含和名稱空間宣告。另外由於要監控輸入框的各種狀態,所以還必須實現CCEditBoxDelegate類,該類聲明瞭以下介面:
//當鍵盤彈出編輯框獲得焦點時呼叫 virtual void editBoxEditingDidBegin(CCEditBox* editBox) {}; //當鍵盤消失編輯框失去焦點時呼叫 virtual void editBoxEditingDidEnd(CCEditBox* editBox) {}; //當編輯框文字改變時呼叫 virtual void editBoxTextChanged(CCEditBox* editBox, const std::string& text) {}; //當返回鍵按下時或者點選了鍵盤以外的區域時呼叫 virtual void editBoxReturn(CCEditBox* editBox) = 0;
2.2.使用
在TestLayer.cpp的init()中建立編輯框。
//bool TestLayer::init()
CCSize visibleSize=CCDirector::sharedDirector()->getVisibleSize();
pEditBox = CCEditBox::create(CCSizeMake(250,50), CCScale9Sprite::create("login_edit_normal.9.png"));
pEditBox->setPosition(ccp(visibleSize.width/2, visibleSize.height*3/4));
pEditBox->setFontColor(ccRED);//設定字型顏色
pEditBox->setPlaceHolder("please input:");//設定預置文字
pEditBox->setMaxLength(8);//設定最大長度
// kEditBoxInputModeAny: 開啟任何文字的輸入鍵盤,包括換行
// kEditBoxInputModeEmailAddr: 開啟 郵件地址 輸入型別鍵盤
// kEditBoxInputModeNumeric: 開啟 數字符號 輸入型別鍵盤
// kEditBoxInputModePhoneNumber: 開啟 電話號碼 輸入型別鍵盤
// kEditBoxInputModeUrl: 開啟 URL 輸入型別鍵盤
// kEditBoxInputModeDecimal: 開啟 數字 輸入型別鍵盤,允許小數點
// kEditBoxInputModeSingleLine: 開啟任何文字的輸入鍵盤,不包括換行
pEditBox->setInputMode(kEditBoxInputModeAny);//設定輸入型別
//kEditBoxInputFlagPassword: 密碼形式輸入
//kEditBoxInputFlagSensitive: 敏感資料輸入、儲存輸入方案且預測自動完成
//kEditBoxInputFlagInitialCapsWord: 每個單詞首字母大寫,並且伴有提示
//kEditBoxInputFlagInitialCapsSentence: 第一句首字母大寫,並且伴有提示
//kEditBoxInputFlagInitialCapsAllCharacters:所有字元自動大寫
pEditBox->setInputFlag(kEditBoxInputFlagPassword);//設定輸入標誌位
// kKeyboardReturnTypeDefault: 預設使用鍵盤return 型別
// kKeyboardReturnTypeDone: 預設使用鍵盤return型別為“Done”字樣
// kKeyboardReturnTypeSend: 預設使用鍵盤return型別為“Send”字樣
// kKeyboardReturnTypeSearch: 預設使用鍵盤return型別為“Search”字樣
// kKeyboardReturnTypeGo: 預設使用鍵盤return型別為“Go”字樣
pEditBox->setReturnType(kKeyboardReturnTypeDone);//設定返回型別
pEditBox->setDelegate(this);//當前類繼承CCEditBoxDelegate類
addChild(pEditBox);
當前類繼承於CCEditBoxDelegate,實現其所有介面如下:
void TestLayer::editBoxEditingDidBegin(CCEditBox *editBox)
{
CCLOG("start edit");
}
void TestLayer::editBoxEditingDidEnd(CCEditBox *editBox)
{
CCLOG("end edit");
}
void TestLayer::editBoxReturn(CCEditBox *editBox)
{
CCLOG("editbox return");
}
void TestLayer::editBoxTextChanged(CCEditBox *editBox, const std::string &text)
{
CCLOG("text changed");
}